iOS动画篇：核心动画系列(三) CAKeyframeAnimation

奋斗的七月

• 关键帧动画，也是CAPropertyAnimation的子类，与CABasicAnimation的区别是：

CABasicAnimation只能从一个数值（fromValue）变到另一个数值（toValue），而CAKeyframeAnimation会使用一个NSArray保存这些数值

• CABasicAnimation可看做是只有2个关键帧的CAKeyframeAnimation

在关键帧动画中还有一个非常重要的参数，那便是calculationMode，所谓计算模式：其主要针对的是每一帧的内容为一个座标点的情况，也就是对anchorPoint和 position进行的动画
•当在平面座标系中有多个离散的点的时候，可以是离散的，也可以直线相连后进行插值计算，也可以使用圆滑的曲线将他们相连后进行插值计算
•calculationMode目前提供如下几种模式：
–kCAAnimationLinear 默认值，表示当关键帧为座标点的时候，关键帧之间直接直线相连进行插值计算
–kCAAnimationDiscrete 离散的，不进行插值计算，所有关键帧直接逐个进行显示
–kCAAnimationPaced 使得动画均匀进行，而不是按keyTimes设置的或者按关键帧平分时间，此时keyTimes和timingFunctions无效
–kCAAnimationCubic 对关键帧为座标点的关键帧进行圆滑曲线相连后插值计算，这里的主要目的是使得运行的轨迹变得圆滑
–kCAAnimationCubicPaced 看这个名字就知道和kCAAnimationCubic有一定联系,其实就是在kCAAnimationCubic的基础上使得动画运行变得均匀，就是系统时间内运动的距离相同，此时keyTimes以及timingFunctions也是无效的
•
•注意：就目前而言，此属性研究的意义不大，知道有这么一个属性即可，只有再做复杂动画，同时动画效果不够理想的时候，才需要考虑使用这一属性

//---点赞--

- (void)initBtn{
    UIButton *btn = [[UIButton alloc]init];
    btn.frame = CGRectMake(50, 150, 30, 30);
//        btn.showsTouchWhenHighlighted = YES;//---点击闪烁
    [btn setImage:[UIImage imageNamed:@"priase_dafault"] forState:UIControlStateNormal];
    [btn setImage:[UIImage imageNamed:@"priase_select"] forState:UIControlStateSelected];
    [btn addTarget:self action:@selector(btnClick:) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:btn];
}

- (void)btnClick:(UIButton *)sender{
    
    sender.selected = !sender.selected;
    
    CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"transform.scale"];
    if (sender.selected) {
        animation.values = @[@1.5 ,@0.8, @1.0,@1.2,@1.0];
        animation.duration = 0.5;
    }else{
        animation.values = @[@0.8, @1.0];
        animation.duration = 0.4;
    }
    animation.calculationMode = kCAAnimationCubic;
    [sender.layer addAnimation:animation forKey:@"transform.scale"];
}

//---抖动动画

// 角度转弧度
#define angle2Radion(angle) (angle / 180.0 * M_PI)
- (void)setKeyframeAnimation{
    
    // 创建动画
    CAKeyframeAnimation *animation = [CAKeyframeAnimation animation];
    animation.keyPath = @"transform.rotation";
    // rotation旋转，需要添加弧度值
    // angle2Radion() 角度转弧度的宏
    // @() 包装为NSNumber对象
    animation.values = @[@(angle2Radion(-5)),@(angle2Radion(5)),@(angle2Radion(-5))];
    animation.repeatCount = MAXFLOAT;
    animation.duration = 0.2;

    [self.imageView1.layer addAnimation:animation forKey:nil];
        // 修改锚点
//    self.imageView1.layer.anchorPoint = CGPointZero;
//        self.imageView1.layer.anchorPoint = CGPointMake(0.2, 0.2);
}

//--转圈

- (void)btnClick{
    
    CAKeyframeAnimation *anim = [CAKeyframeAnimation animation];
    //     设置动画属性
    anim.keyPath = @"position";
    //设置path************************
    UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(60, 60, 100, 100)];
    anim.path = path.CGPath;
    anim.duration = 0.25;
    // 取消反弹
    anim.removedOnCompletion = NO;
    anim.fillMode = kCAFillModeForwards;
    anim.repeatCount = MAXFLOAT;
    [self.imageView1.layer addAnimation:anim forKey:nil];
}

//动画添加贝塞尔路径
- (void)demoViewBezierPathAnimation
{
    
    UIBezierPath *path = [UIBezierPath bezierPath];
    [path moveToPoint:self.imageView1.center];    //一定要设置 不然底层的CGPathRef找不到起始点，将会崩溃
    [path addCurveToPoint:CGPointMake(270, 410) controlPoint1:CGPointMake(0, SCREEN_HEIGHT) controlPoint2:CGPointMake(SCREEN_WIDTH, 0)];    //以左下角和右上角为控制点
    
    CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
    animation.path = path.CGPath;
    animation.duration = 3.0f;
    animation.removedOnCompletion = NO;
    animation.fillMode = kCAFillModeForwards;
    
    [self.imageView1.layer addAnimation:animation forKey:nil];
}