Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

How to customize the animation effect of thumb rotation by Android SeekBar

2025-01-19 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/02 Report--

This article is about how Android SeekBar customizes the effects of thumb rotation animation. The editor thinks it is very practical, so share it with you as a reference and follow the editor to have a look.

Sample dimens.xml

For ease of management, you can add some size settings

6dp2dp20dp4dpdrawable

We need to add a total of 4 drawable files. There are 2 kinds of thumb,1 animations and 1 progress bar "base" respectively.

Shape_thumb_round_1.xml # static thumblayers_seek_bar_progress_1.xmllayers_thumb_ring_sweep_1.xmlrotate_thumb_1.xmlshape_thumb_round_1.xml

The ring effect made by solid and stroke

Layers_thumb_ring_sweep_1.xml

This is the thumb that is going to turn around. Use layer-list to overlay multi-layer effects.

The bottom is a semi-white circle (android:shape= "oval").

Add a layer of android:shape= "ring" on top of it, using a gradient to increase the sense of motion.

Rotate_thumb_1.xml

Define the rotation effect. Notice that its drawable uses the layers_thumb_ring_sweep_1.xml defined above.

The rotation parameter android:toDegrees can be defined according to the requirements.

Layers_seek_bar_progress_1.xml

Defines the style of the progress bar. This is the pedestal. The color should match the one above. It looks better.

Layout

When the above resource file is ready. Add a SeekBar to our layout

Android:maxHeight and android:minHeight need to be set

Android:progressDrawable uses the previously defined "base"

Android:thumb uses static styles first

Called in Activity

Activity holds Drawable variables and animations. DataBinding is used in the example.

Private RotateDrawable mRotateThumbDrawable; / / the thumb being loaded, and Activity holds the drawableprivate Drawable mSolidThumb;private ObjectAnimator mThumbAnimator; / / control animation / /. @ Override protected void onCreate (Bundle savedInstanceState) {super.onCreate (savedInstanceState); mBinding = DataBindingUtil.setContentView (this, R.layout.act_seekbar_1); / /. MRotateThumbDrawable = (RotateDrawable) AppCompatResources.getDrawable (getApplicationContext (), R.drawable.rotate_thumb_1); mSolidThumb = AppCompatResources.getDrawable (getApplicationContext (), R.drawable.shape_thumb_round_1);}

The Drawable object is held directly by activity, which is easy to operate.

Change the thumb of seekbar, using the method setThumb (Drawable thumb)

Use static thumb

MBinding.playSb.setThumb (mSolidThumb)

To use the circle effect, setThumb first, and you need to start the animation.

MBinding.playSb.setThumb (mRotateThumbDrawable); mThumbAnimator = ObjectAnimator.ofInt (mRotateThumbDrawable, "level", 0, 10000); mThumbAnimator.setDuration (1000); mThumbAnimator.setRepeatCount (ValueAnimator.INFINITE); mThumbAnimator.setInterpolator (new LinearInterpolator ()); mThumbAnimator.start ()

The effect is as follows

You can switch between static and dynamic.

Remember to turn off the animation when you leave the page

@ Overrideprotected void onDestroy () {if (null! = mThumbAnimator) {mThumbAnimator.cancel ();} super.onDestroy ();} Thank you for reading! On "Android SeekBar how to customize thumb rotation animation effects" this article is shared here, I hope the above content can be of some help to you, so that you can learn more knowledge, if you think the article is good, you can share it out for more people to see it!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report