IOS CoreAnimation中layer动画闪烁的解决方法

 更新时间:2016年06月01日 11:40:19   作者:大熊猫侯佩  
这篇文章主要为大家详细介绍了IOS CoreAnimation中layer动画闪烁的原因,分享了layer动画闪烁的解决方法,感兴趣的小伙伴们可以参考一下

网上有一段Core Animation层动画的例子,是将view中的云朵从左向右移动,直到移出屏幕,这时再将云朵移到最左端然后重复移动动画.

所有动画在layer上完成,不过有个小问题,就是第一次每朵云动画完成时,会在其原位置处有一个闪烁,然后才会移动到屏幕最右端,而随后的运动动画都没有这个问题了:

由于录制gif文件时使用的帧率比较低,所以上图较难展示这个问题.不过实际App运行的时候每朵云在第一次移出屏幕的时候都会在初始位置闪烁一下再运行随后的动画.这是为什么呢?

因为layer动画不同于view层面上的动画,它实际不会修改原始view的任何属性.就拿云朵移动的动画来说,你虽然看上去改变了云朵的x坐标使其向右移动,可实际上原来的云朵ImageView根本还在原地,只不过CA用其外观创建了一个临时绘制进行移动,原来的云朵被暂时隐藏起来;一旦移动动画完成,该临时对象被删除,原来的云朵会在初始位置出现.

那么为什么只有动画第一次会出现闪烁呢?因为在第一次动画结束后,我在代码中修改了云朵view的x坐标,所以后面云朵的x坐标都和layer动画的fromValue相同,这将保证后续动画不会发生”闪烁”。

知道了原因,解决就很简单了,我只要在第一次动画前将云朵的x坐标修改为指定的位置,同时调整fromValue的值为初始位置即可:

func animateCloud(layer:CALayer){
 let cloudSpeed = 15.0/Double(view.layer.frame.size.width)
 let duration:NSTimeInterval = Double(view.layer.frame.size.width - layer.frame.origin.x) * cloudSpeed
 //提前存储云朵layer的初始位置 
 let fromValue = layer.position
 //设置云朵的最终位置
 layer.position.x = -layer.bounds.width/2

 let cloudMove = CABasicAnimation(keyPath: "position.x")
 cloudMove.fillMode = kCAFillModeForwards
 //cloudMove.removedOnCompletion = false
 cloudMove.duration = duration
 //设置云朵的初始位置
 cloudMove.fromValue = fromValue.x
 cloudMove.toValue = self.view.bounds.size.width + layer.bounds.width/2
 cloudMove.delegate = self
 cloudMove.setValue("cloud", forKey: "name")
 cloudMove.setValue(layer, forKey: "layer")
 layer.addAnimation(cloudMove, forKey: nil)
 }

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • 总结iOS App开发中控制屏幕旋转的几种方式

    总结iOS App开发中控制屏幕旋转的几种方式

    这篇文章主要介绍了iOS app开发中控制屏幕旋转的方法总结,分为自动旋转和手动旋转以及强制旋转三种情况,代码为Objective-C语言,需要的朋友可以参考下
    2016-02-02
  • iOS中仿QQ侧滑菜单功能

    iOS中仿QQ侧滑菜单功能

    这篇文章主要介绍了iOS中仿QQ侧滑菜单功能,在实现此功能之前,需要先了解UITabBarController的层级结构,具体实现思路大家可以参考下本文
    2017-07-07
  • iOS开发中实现邮件和短信发送的简单示例

    iOS开发中实现邮件和短信发送的简单示例

    这篇文章主要介绍了iOS开发中实现邮件和短信发送的简单示例,编程语言依然是传统的Objective-C,需要的朋友可以参考下
    2015-09-09
  • IOS客户端接入微信支付

    IOS客户端接入微信支付

    对于一个ios的app,如果有一些虚拟的商品或者服务需要通过在线支付来收费的话,一般有几种主流的选择。如果是通过APP调用支付平台APP的思路的话,一个是调起支付宝客户端,一个则是调起微信支付。本文给大家分享ios客户端接入微信支付,需要的朋友可以参考下
    2015-09-09
  • iOS实现微信/QQ显示最近拍摄图片的功能实例代码

    iOS实现微信/QQ显示最近拍摄图片的功能实例代码

    如果你刚刚拍摄了图片,在使用微信/QQ发生消息时会显示“你可能要发送的图片”,这个功能非常人性化,怎么实现的呢?下面小编给大家分享iOS实现微信/QQ显示最近拍摄图片的功能实例代码,一起看看吧
    2017-03-03
  • iOS中自动实现对象序列化的方法详解

    iOS中自动实现对象序列化的方法详解

    这篇文章主要给大家介绍了在iOS中自动实现对象序列化的相关资料,文中通过示例代码介绍的非常详细,对大家具有一定的参考学习价值,需要的朋友们下面来一起看看吧。
    2017-05-05
  • iOS App中UILabel的自定义及在Auto Layout中的使用

    iOS App中UILabel的自定义及在Auto Layout中的使用

    这篇文章主要介绍了iOS App中UILabel的自定义及在Auto Layout中的使用,示例代码为传统的Objective-C语言,需要的朋友可以参考下
    2016-03-03
  • iOS中正向、逆向传值的方法总结

    iOS中正向、逆向传值的方法总结

    这篇文章主要给大家总结介绍了关于iOS中正向、逆向传值的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2018-08-08
  • iOS制作带弹跳动画发布界面

    iOS制作带弹跳动画发布界面

    这篇文章主要为大家详细介绍了iOS制作带弹跳动画发布界面,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-08-08
  • Flutter ScrollController滚动监听及控制示例详解

    Flutter ScrollController滚动监听及控制示例详解

    这篇文章主要为大家介绍了Flutter ScrollController滚动监听及控制示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-11-11

最新评论