FillMode详解

首页图片.jpg

最近在学核心动画的时候遇到了遇到了fillMode的属性，除了kCAFillModeForwards比较理解意外，其他三个参数一脸蒙蔽，感觉没什么区别，看官方文档也没看出个所以然，去网上查了一些资料如下：

kCAFillModeBackwards 这个和kCAFillModeForwards是相对的,就是在动画开始前,你只要将动画加入了一个layer,layer便立即进入动画的初始状态并等待动画开始.你可以这样设定测试代码,将一个动画加入一个layer的时候延迟5秒执行.然后就会发现在动画没有开始的时候,只要动画被加入了layer,layer便处于动画初始状态

而网上所有的哥们都是照抄这句话，根本不理解啊有木有！后来通过查资料明白了其中的真理，删除线中的话很容易把人带到坑里面--！看到删除线中的话我一直在延迟把layer加到动画中，然后我就掉坑里面去了，后来想通了，应该是让动画延迟5秒执行（开始），这样就能看出效果了。

在说fillMode之前首先要说说removedOnCompletion属性

removedOnCompletion：默认为YES，代表动画执行完毕后就从图层上移除，图形会恢复到动画执行前的状态。如果想让图层保持显示动画执行后的状态，那就设置为NO，不过还要设置fillMode为kCAFillModeForwards

接下来说说fillMode属性

fillMode：决定当前对象在非active时间段的行为.比如动画开始之前,动画结束之后

kCAFillModeRemoved 这个是默认值,也就是说当动画开始前和动画结束后,动画对layer都没有影响,动画结束后,layer会恢复到之前的状态（可以理解为动画执行完成后移除）

kCAFillModeForwards 当动画结束后,layer会一直保持着动画最后的状态

kCAFillModeBackwards 当在动画开始前,你只要把layer加入到一个动画中,layer便立即进入动画的初始状态并等待动画开始.你可以这样设定测试代码,延迟3秒让动画开始,只要动画被加入了layer,layer便处于动画初始状态

当点击屏幕的时候让动画3秒后执行

核心代码

//kCAFillModeForwards
CABasicAnimation * basicAnimation = [[CABasicAnimation alloc] init];
    basicAnimation.keyPath = @"position.y";
    basicAnimation.removedOnCompletion = NO;
    //beginTime : 动画的开始时间
    //CACurrentMediaTime() : 图层的当前时间
    //让动画延迟3秒执行
    basicAnimation.beginTime = CACurrentMediaTime()+3;
    basicAnimation.fillMode = kCAFillModeForwards;
    //动画的开始位置
    basicAnimation.fromValue = @300;
    //动画的结束位置
    basicAnimation.toValue = @500;
    //动画持续时间
    basicAnimation.duration = 3;
    [self.layer addAnimation:basicAnimation forKey:nil];

效果

练习1.gif

核心代码

CABasicAnimation * basicAnimation = [[CABasicAnimation alloc] init];
    basicAnimation.keyPath = @"position.y";
    //beginTime : 动画的开始时间
    //CACurrentMediaTime() : 图层的当前时间
    //让动画延迟3秒执行
    basicAnimation.beginTime = CACurrentMediaTime()+3;
    basicAnimation.fillMode = kCAFillModeBackwards;
    //动画的开始位置
    basicAnimation.fromValue = @300;
    //动画的结束位置
    basicAnimation.toValue = @500;
    //动画持续时间
    basicAnimation.duration = 3;
    [self.layer addAnimation:basicAnimation forKey:nil];

效果

练习2.gif

相信大家从效果能看出来kCAFillModeForwards是在动画开始之后layer迅速进入指定位置开始执行动画并在removedOnCompletion = NO的前提下会停在动画结束的最后位置，而kCAFillModeBackwards则是在动画开始之前迅速进入指定状态并在动画开始后执行动画，动画结束后迅速返回到layer的本身位置

如果kCAFillModeForwards和kCAFillModeBackwards区分后那kCAFillModeBoth就很好理解了如果removedOnCompletion = NO那layer会在动画开始之前就会迅速进入动画的初始位置并在执行完动画后停在动画结束的位置，如果removedOnCompletion = YES那layer会在动画开始之前就会迅速进入动画的初始位置并在执行完动画后迅速返回到layer的本身位置

代码比较简单，如果有需要源码的同学请在评论区留言。
转载请注明出处~~（尊重原创）