美文网首页iOS开发iOS学习笔记iOS开发记录
iOS动画篇:核心动画系列(三) CAKeyframeAnima

iOS动画篇:核心动画系列(三) CAKeyframeAnima

作者: 我是七月 | 来源:发表于2018-05-13 16:42 被阅读27次
    奋斗的七月

    • 关键帧动画,也是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];
    }
    

    相关文章

      网友评论

        本文标题:iOS动画篇:核心动画系列(三) CAKeyframeAnima

        本文链接:https://www.haomeiwen.com/subject/rhuofxtx.html