iOS Animation - CABasicAnimation与CAKeyframeAnimation

在 iOS 的 CAAnimation 中 CABasicAnimation、CAKeyframeAnimation的名字如此类似,方法调用也差不多,让较少使用到的开发者些许感到混淆,那我们就来讲讲这两者的区别和联系吧。

首先让我们看看他们的继承图:

CAAnimation继承图

很直观的,从上面可以看出CABasicAnimation与CAKeyframeAnimation都继承于CAPropertyAnimation。而CAPropertyAnimation提供了基本的动画属性设置keyPath、additive、cumulative。

  • iOS Animation-KeyPath值
keyPath值 说明 值类型
position 移动位置 CGPoint
opacity 透明度 0-1
bounds 变大与位置 CGRect
bounds.size 由小变大 CGSize
backgroundColor 背景颜色 CGColor
cornerRadius 渐变圆角 任意数值
borderWidth 改变边框border的粗细 任意数值
contents 改变layer内容(图片) CGImage
transform.scale 缩放、放大 0.0-1.0
transform.rotation.x 旋转动画(翻转,沿着X轴) M_PI*n
transform.rotation.y 旋转动画(翻转,沿着Y轴) M_PI*n
transform.rotation.z 旋转动画(翻转,沿着Z轴) M_PI*n
transform.translation.x 横向移动(沿着X轴) 任意数值
transform.translation.y 纵向移动(沿着Y轴) 任意数值

PS:后面的代码是用swift实现的,那些方法我们都可以用作公共类来调用。


单独解析

1)CABasicAnimation(基础动画)

CABasicAnimation提供了最基础的动画属性设置,是简单的keyframe动画性能。CABasicAnimation可以看做是一种CAKeyframeAnimation的简单动画,因为它只有头尾的关键帧(keyframe)。

我们可以创建一个CABasicAnimaiton的对象通过keyPath的方式。CABasicAnimation提供了fromValue、toValue、byValue的设置(插值)。它们三个属性定义了一个动画的轨迹,并且最少两个值不能为空。

当设置了CABasicAnimation的起点与终点值后,中间的值都是通过插值方式计算出来的,插值计算是通过timingFunction来指定,timingFunction默认为空,使用liner(匀速运动)。
例如,当我们设置了一个position的动画,设置了开始值PointA与结束值PointB,它们的运动先计算PointA与PointB的中间运动值PointCenter,而PointCenter是由timingFunction来指定值的,并且动画默认是直线匀速运动的。

我们来看看CABasicAnimation的一些简单实现的动画,例如移动、透明度、翻转等等。方法里面传入一个CALayer类或者子类就可以了。
PS:一般做简单动画,最快捷是用KVC给核心动画设置效果,图层里有哪些属性,我们就可以设置哪些属性,具体参考上面的KeyPath值。

//移动动画position
    func addLayerAnimationPosition(layer: CALayer) {
        let animation = CABasicAnimation(keyPath: "position")
        //开始的位置
        animation.fromValue = NSValue(CGPoint: layer.position)
        //移动到的位置
        animation.toValue = NSValue(CGPoint: CGPointMake(120, 200))
        //持续时间
        animation.duration = 3
        //运动后的位置保持不变(layer的最后位置是toValue)
        animation.removedOnCompletion = false
        animation.fillMode = kCAFillModeForwards

        //添加动画
        layer.addAnimation(animation, forKey: "addLayerAnimationPosition")
    }

    //透明度 opacity
    func addLayerAnimationOpacity(layer: CALayer) {
        let animation = CABasicAnimation(keyPath: "opacity")
        animation.fromValue = 1
        animatio
  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值