正在加载之8个圆球动画旋转
显示8个圆球围成一个圆形的动画加载效果,类似一个实心球带着拖尾旋转只需要绘制8个实心圆球外加8个无限动画触发圆球的透明度alpha和scale的变化,且每个动画之间保持一定的延迟
圆球如何绘制
先在绘制区域中,8个小实心圆围成一个大圆,透明度范围在0到255,缩放范围在0到1.0排列方式为上下左右位置,以及他们的中间位置,正好8个位置,8个圆心位置不变
1:圆球半径radius设置为整个View的Region正方形长度的十分之一
2:计算出每个圆球圆心的坐标(x,y)
3:设置每个圆球当前的透明度以及缩放的比例
4:Canvas移到圆心坐标处translate进行绘制
每个圆球的缩放比例区间是0到1.0,1时代表正常状态,圆球的缩放依赖Canvas的scale,将Canvas的scale缩放至对应的比例,绘制当前圆球的时候实现其缩放并Canvas的原点到translate圆心位置,每个圆球当前的scale不同,绘制时,Canvas需要save与restore保存和恢复状态
圆心(x,y)坐标如何确定
圆球的圆心都在正方形View的内切大圆的内部圆环上,距离其内切大圆有一个半径的距离,角度分别是0-360度均分
每一个点到大圆的圆心的距离是1/2的正方形半宽减去小圆球的半径,计算得到每个小圆心点的对应角度的正切和余切,即得到以正方形View中心为坐标远点的x,y值,转换为相对于原点的圆心坐标(再加上正方形半宽即是)
第一个球圆心坐标相对View的中心是0度,第二个是顺时针旋转45度...依次
动画及其延迟
在1000毫秒内,scale的值设置为1到0.4f再到1,alpha的值设置为255到77再到255
二者并不是同比例,但是是线性改变,为每个圆球设置2个动画,如果同比例,可设置一个,动画的持续时间可设置为1000毫秒,每个动画之间的延迟大约在120毫秒。从第一个圆球开始动画,第8个开始动画的时间是840毫秒后,按照这个速度960毫秒后第一个动画开始下一轮动画,但第一个动画还未持续完毕,等待40毫秒,第8个开始动画变小,第一个动画在40毫秒的变大后也会开始由大变小,基本实现无缝衔接,如果适当加长动画时间,则会让代表动画旋转的实心球及其拖尾缓慢变化,从而实现旋转