每次登录QQ的时候都觉得登录框的动画挺小清新的，今天想着自己实现一下这个小功能 ，首先效果如图
效果图
功能实现不难，就是刚开始的时候思路走了些弯路，刚开始我是打算先把动画的蓝色圆环先添加在界面上，然后通过改变该圆环的layer的strokestart和strokeend的数值来达到目标效果的，我首先设置了两个float类型的start和end属性，其中start默认0.25，end默认0.75，每秒钟start和end默认增加0.1，但是当end的值大于1后，为了使strokeend有效，我设置当end大于1时。end-1，然而并没用，甚至干脆动画都没了。然后我想过当end大于1后，交换start和end的值，发现圆环会突然变成反向的，所以我就放弃了使用strokestart和strokeend达到效果的方法。
然后我就用了这个方法，达到了最终的效果。
主要代码
if判断语句是为了看看在添加新的layer之前有没有旧的蓝色圆环，有的话就删除，然后添加，如果不加这个判断的话，就会导致圆环逐渐形成整环。另外使用insertSublayer是为了让蓝色圆环加在最底层从而达到滑过下面的绿色圆圈是不要遮盖住它。
网友评论