还记得当年MD风格刚出现的时候,还真是掀起了一股热潮;个人平时比较喜欢研究一些View相关的东西,这里呢就一时兴起来了解一下最普通的MD风格圆形的ProgressBar。如图(gif不太清晰):
以下就以个人的理解来分析一下,自己应该怎么做呢!
首先,根据这个效果首选的是使用动画来实现(这是句废话😂)。
其次,再来拆解一下这个过程,具体应该怎么实现。
最后,绘制出来。
了解动画的同学们,应该都知道在动画使用里面有个很神奇的东西 Interpolator,它能改变动画的属性值,从而实现理想的动画效果。
从整个过程进行分析,此过程拆解为2个同时执行的动画;一个使用LinearInterpolator(动画1),一个使用AccelerateDecelerateInterpolator(动画2);动画1用于改变当前进度的起始值(即当前进度的起始角度),动画2用于改变当前进度值(即修改图中红色线的长度,实际修改的是当前红色线所对应的角度值)。这两个动画都是循环执行的,单次动画时间一致。
动画1,使用ValueAnimator进行如下设计(不需要在意动画的Value):
修改起始值过程1:进度值由0--->Max,isReverseTo0为false;
过程2:进度值Max--->0,isReverseTo0为true;
progressStart默认值为0,isReverseTo0默认值为false;progressStart的值由0开始逐渐增加,增加步长为2,这个步长越大旋转一圈则越快,只需要确保值的合法性即可;当动画重复时且isReverseTo0为true,这个时候需要修改当前进度的起始值为当前进度的末尾值,以便于动画连贯(此时进度值在不断减小,在绘制时也需要作出调整,后边会提到)。在onAnimationUpdate时进行更新绘制。
动画2,主要是修改进度值,进行不断赋值即可;
更新进度值绘制当前进度,即绘制一段圆弧,如下:
进度绘制过程2时,需要对起始值做一下处理;
以上就是比较重要的一些,一些细节的地方不太好描述,只能好好理解一下了😂😂;当然了,还有其他的做法,欢迎指出呀!!!请大神赐教!!!
敲代码,就是这样;多敲多练,一点点积累,一步步提升!
网友评论