CAKeyframeAnimation

2020-04-30  本文已影响0人  ienos

一、利用 UIView 动画实现

UIView animateKeyframesWithDuration(_: delay: options: : completion: )


duration
~~ 动画持续时长

delay
~~ 动画延迟时间

options
~~ UIViewKeyframeAnimationOptionCalculationModeLinear // 连续运算模式,线性
~~ UIViewKeyframeAnimationOptionCalculationModeDiscrete // 离散运算模式,只显示关键帧
~~ UIViewKeyframeAnimationOptionCalculationModePaced // 均匀执行运算模式,线性
~~ UIViewKeyframeAnimationOptionCalculationModeCubic // 平滑运算模式 (使用贝塞尔曲线)
~~ UIViewKeyframeAnimationOptionCalculationModeCubicPaced // 平滑均匀运算模式

animations
~~ 在 animations 中添加关键帧
UIView addKeyframeWithRelativeStartTime(_: relativeDuration: animations: )

startTime
~~ 关键帧开始时间,该时间是相对整个关键帧动画持续时间的相对时间,一般值在0到1之间。如果为0,则表明这一关键帧从整个动画的第0秒开始执行,如果设为0.5,则表明从整个动画的中间开始执行

relativeDuration
~~ 关键帧持续时间,该时间同样是相对整个关键帧动画持续时间的相对时间,一般值也在0到1之间。如果设为0.25,则表明这一关键帧的持续时间为整个动画持续时间的四分之一

animations
~~ 设置视图动画属性的动画闭包

completion
~~ 动画结束回调

恢复原来的状态
self.restorePaperAirplaneStatus()

代码示例

  [UIView animateKeyframesWithDuration: 4 delay: 0 options: UIViewKeyframeAnimationOptionCalculationModeCubicPaced animations: ^{
       
        __block CGPoint center = _leaf.center;
        [UIView addKeyframeWithRelativeStartTime: 0 relativeDuration: 0.1 animations: ^{
            _leaf.center = (CGPoint){ center.x + 15, center.y + 80 };
        }];
        [UIView addKeyframeWithRelativeStartTime: 0.1 relativeDuration: 0.15 animations: ^{
            _leaf.center = (CGPoint){ center.x + 45, center.y + 185 };
        }];
        [UIView addKeyframeWithRelativeStartTime: 0.25 relativeDuration: 0.3 animations: ^{
            _leaf.center = (CGPoint){ center.x + 90, center.y + 295 };
        }];
        [UIView addKeyframeWithRelativeStartTime: 0.55 relativeDuration: 0.3 animations: ^{
            _leaf.center = (CGPoint){ center.x + 180, center.y + 375 };
        }];
        [UIView addKeyframeWithRelativeStartTime: 0.85 relativeDuration: 0.15 animations: ^{
            _leaf.center = (CGPoint){ center.x + 260, center.y + 435 };
        }];
        [UIView addKeyframeWithRelativeStartTime: 0 relativeDuration: 1 animations: ^{
            _leaf.transform = CGAffineTransformMakeRotation(M_PI);
        }];
    } completion: nil];
上一篇下一篇

猜你喜欢

热点阅读