zoukankan      html  css  js  c++  java
  • iOS开发CABasicAnimation动画理解

    1、CALayer简介

    CALayer是个与UIView很类似的概念,同样有backgroundColor、frame等相似的属性,我们可以将UIView看做一种特殊的CALayer。但实际上UIView是对CALayer封装,在CALayer的基础上再添加交互功能。UIView的显示必须依赖于CALayer。
    我们同样可以跟新建view一样新建一个layer,然后添加到某个已有的layer上,同样可以对layer调整大小、位置、透明度等。
    一般来说,layer可以有两种用途:一是对view相关属性的设置,包括圆角、阴影、边框等参数;二是实现对view的动画操控。因此对一个view进行动画,本质上是对该view的.layer进行动画操纵。

    2.CAAnimation的分类

    (1) CABasicAnimation

    基础动画,通过设定起始点,终点,时间,动画会沿着你这设定点进行移动。可以看做特殊的CAKeyFrameAnimation

    (2) CAKeyframeAnimation
    关键帧动画

    (3) CAAnimationGroup
    组动画,支持多个CABasicAnimation或者CAKeyframeAnimation动画同时执行

    基本动画代码:

        /**创建CALayer*/
        CALayer * testLayer = [[CALayer alloc] init];
        testLayer.backgroundColor = [UIColor greenColor].CGColor;
        testLayer.frame = CGRectMake(100, 100, 100, 100);
        testLayer.cornerRadius = 10;
        [self.view.layer addSublayer:testLayer];
        /**创建动画*/
        CABasicAnimation * testAnimiation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
        testAnimiation.fromValue = [NSNumber numberWithFloat:1.0];
        testAnimiation.toValue = [NSNumber numberWithFloat:1.5];
        testAnimiation.autoreverses = YES;
        testAnimiation.fillMode = kCAFillModeBackwards;
        testAnimiation.removedOnCompletion = NO;
        testAnimiation.repeatCount = MAXFLOAT;
        testAnimiation.duration = 1;
        [testLayer addAnimation:testAnimiation forKey:@"testAnimiation"];

    参数解释:

    1.animationWithKeyPath的值如下:

    anchorPoint 
    backgroundColor 
    backgroundFilters 
    borderColor 
    borderWidth 
    bounds 
    compositingFilter 
    contents 
    contentsRect 
    cornerRadius 
    doubleSided 
    filters 
    frame :This property is not animatable. You can achieve the same results by animating theboundsandpositionproperties. 
    hidden 
    mask 
    masksToBounds 
    opacity 
    position 
    shadowColor 
    shadowOffset 
    shadowOpacity 
    shadowPath 
    shadowRadius 
    sublayers 
    sublayerTransform 
    transform 翻转包含scale rotation 
    zPosition

    大部分我们常用的是:

    transform.scale = 比例缩放动画 
    transform.scale.x = 宽的比例动画 
    transform.scale.y = 高的比例动画 
    transform.rotation.z = 平面的旋转 
    opacity = 透明度

    2.fromValue: 动画的起始状态值,虽然iOS文档给出的类型是id,不过这里应该传NSValue对象,比如NSNumber(NSNubmer继承自NSValue)。其具体含义

    3.autoreverse: 当动画执行到toValue指定的状态时是从toValue的状态逆回去,还是直接跳到fromValue的状态再执行一遍

    4.fileMode: fillMode的作用就是决定当前对象过了非active时间段的行为. 非active时间段是指动画开始之前以及动画结束之后。如果是一个动画CAAnimation,则需要将其removedOnCompletion设置为NO,要不然fillMode不起作用. 下面来讲各个fillMode的意义:

    kCAFillModeRemoved 这个是默认值,也就是说当动画开始前和动画结束后,动画对layer都没有影响,动画结束后,layer会恢复到之前的状态

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

    kCAFillModeBackwards 这个和kCAFillModeForwards是相对的,就是在动画开始前,你只要将动画加入了一个layer,layer便立即进入动画的初始状态。因为有可能出现fromValue不是目前layer的初始状态的情况,如果fromValue就是layer当前的状态,则这个参数就没太大意义。

    kCAFillModeBoth 理解了上面两个,这个就很好理解了,这个其实就是上面两个的合成.动画加入后开始之前,layer便处于动画初始状态,动画结束后layer保持动画最后的状态.

    CAAnimationGroup实现动画

     /**创建CALayer*/
    //    CALayer * testLayer = [[CALayer alloc] init];
    //    testLayer.backgroundColor = [UIColor greenColor].CGColor;
    //    testLayer.frame = CGRectMake(100, 100, 100, 100);
    //    testLayer.cornerRadius = 10;
    //    [self.view.layer addSublayer:testLayer];
        UILabel * label = [[UILabel alloc] initWithFrame:CGRectMake(100, 100, 100, 100)];
        label.backgroundColor = [UIColor greenColor];
        [self.view addSubview:label];
        /**创建动画*/
        /**缩放*/
        CABasicAnimation * testAnimiation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
        testAnimiation.fromValue = [NSNumber numberWithFloat:1.0];
        testAnimiation.toValue = [NSNumber numberWithFloat:1.5];
        testAnimiation.autoreverses = YES;
        testAnimiation.fillMode = kCAFillModeBackwards;
        testAnimiation.removedOnCompletion = NO;
        testAnimiation.repeatCount = MAXFLOAT;
        testAnimiation.duration = 1;
    //    [label.layer addAnimation:testAnimiation forKey:@"testAnimiation"];
        /**移动*/
        CABasicAnimation *moveAnimation = [CABasicAnimation animationWithKeyPath:@"position"];
        moveAnimation.fromValue = [NSValue valueWithCGPoint:label.layer.position];
        moveAnimation.toValue = [NSValue valueWithCGPoint:CGPointMake(320 - 80, label.layer.position.y)];
        moveAnimation.autoreverses = YES;
        moveAnimation.repeatCount = MAXFLOAT;
        moveAnimation.duration = 2;
        /**旋转*/
        CABasicAnimation *rotateAnimation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.x"];
        rotateAnimation.fromValue = [NSNumber numberWithFloat:0.0];
        rotateAnimation.toValue = [NSNumber numberWithFloat:6.0 * M_PI];
        rotateAnimation.autoreverses = YES;
        rotateAnimation.repeatCount = MAXFLOAT;
        rotateAnimation.duration = 2;
        /**动画组合*/
        CAAnimationGroup *groupAnnimation = [CAAnimationGroup animation];
        groupAnnimation.duration = 2;
        groupAnnimation.autoreverses = YES;
        groupAnnimation.animations = @[moveAnimation, testAnimiation, rotateAnimation];
        groupAnnimation.repeatCount = MAXFLOAT;
        
        [label.layer addAnimation:groupAnnimation forKey:@"groupAnnimation"];
  • 相关阅读:
    Git轻松入门3:远程仓库篇
    Git轻松入门2:分支篇
    Git轻松入门1:本地仓库篇
    通俗易懂的解释:什么是API
    小白都看得懂的Javadoc使用教程
    尾调用与尾递归
    要理解递归就要先理解递归:手把手教你写递归
    不复杂的空间复杂度
    不复杂的时间复杂度
    Java程序执行过程及内存机制
  • 原文地址:https://www.cnblogs.com/WJJ-Dream/p/5799025.html
Copyright © 2011-2022 走看看