iOS开发之模仿Mac版QQ登录动画

每次登录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是为了让蓝色圆环加在最底层从而达到滑过下面的绿色圆圈是不要遮盖住它。


demo地址github.com/hmj0930/QQLogin.git

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 在iOS中随处都可以看到绚丽的动画效果,实现这些动画的过程并不复杂,今天将带大家一窥ios动画全貌。在这里你可以看...
    每天刷两次牙阅读 12,712评论 6 30
  • 在iOS实际开发中常用的动画无非是以下四种:UIView动画,核心动画,帧动画,自定义转场动画。 1.UIView...
    请叫我周小帅阅读 8,369评论 1 23
  • 在iOS中随处都可以看到绚丽的动画效果,实现这些动画的过程并不复杂,今天将带大家一窥iOS动画全貌。在这里你可以看...
    F麦子阅读 10,521评论 5 13
  • 目录: 主要绘图框架介绍 CALayer 绘图 贝塞尔曲线-UIBezierPath CALayer子类 补充:i...
    Ryan___阅读 5,637评论 1 9
  • 离职申请提交的前一个晚上,我在电脑面前犹豫不决,不知道该不该辞职,确切地说,是裸辞。我看到网上很多人对年底辞职以...
    潜心时间阅读 3,276评论 0 0