iOS:CALayer的隐式动画的详解

最新推荐文章于 2024-08-13 19:03:09 发布

转载最新推荐文章于 2024-08-13 19:03:09 发布 · 80 阅读

本文详细介绍了如何利用CALayer的隐式动画特性，在触摸事件触发时，实现子层动画跑到点击位置，并在动画过程中改变其透明度和形变的效果。通过在控制器类中编写代码，演示了从创建子层、设置属性到添加到根层的过程，再到处理触摸事件并开启动画的过程。最后展示了触摸触发前后子层动画变化的直观效果。

CALayer的隐式动画属性：

•每一个UIView内部都默认关联着一个CALayer，称这个Layer为Root Layer。所有的非Root Layer都存在着隐式动画，隐式动画的默认时长为1/4秒。

•当修改非Root Layer的部分属性时，相应的修改会自动产生动画效果，能执行隐式动画的属性被称为“可动画属性”，诸如:

1.bounds: 缩放动画

2.position: 平移动画

3.opacity: 淡入淡出动画（改变透明度）

•在文档中搜素animatable可以找到所有可动画属性

•如果要关闭默认的动画效果，可以通过动画事务方法实现：

[CATransaction begin];

[CATransaction setDisableActions:YES];

// ...一些其他的代码<#code#>

[CATransaction commit];

具体的演示实例如下：只需要在控制器ViewController类中写代码即可.......

操作目的：当我们触摸屏幕时，子层会动画跑到点击的位置停留下来,同时动画的过程中，它的透明度和形变也可以发生改变。

操作步骤：

1.创建子层，设置属性，然后添加到根层

- (void)viewDidLoad {
    [super viewDidLoad];
    
    //创建子层并设置属性(使用了默认的锚点)
    self.subLayer = [[CALayer alloc]init];
    self.subLayer.bounds = CGRectMake(0, 0, 100, 100);
    self.subLayer.position = CGPointMake(100, 100);
    self.subLayer.backgroundColor = [[UIColor redColor]CGColor];
    
    //将子层添加到根层
    [self.view.layer addSublayer:self.subLayer];
}

2.重写-(void)touchBegan:(NSSet*)touches withEvent:(UIEvent *)event方法,进行触摸事件的处理,动画过程中处理的代码如下：

//取出当前点

    //取出当前点
    UITouch *touch = [touches anyObject];
    CGPoint location = [touch locationInView:self.view];

//开始动画事物([CATransaction setDisableActions:YES]关闭隐式动画后,子层直接跳到了触击位置,没有了移动动画流程)

    //动画事物开始
    [CATransaction begin];
    
    //关闭隐式动画
    //[CATransaction setDisableActions:YES];

//设置动画持续时间为1秒

    [CATransaction setAnimationDuration:1.0];

//设置子层的动画后的位置

    //设置子层的位置为当前点坐标
    self.subLayer.position = location;
    
    //CGRect frame = self.subLayer.frame；  
    /*
    虽然CALayer可以使用frame，但最好还是使用bounds和position。为层设置动画时，用bounds和position会方便一点
    */
    //self.subLayer.frame = CGRectMake(location.x, location.y, frame.size.width, frame.size.height);

//设置子层透明度的变化值,透明度由1.0变成了0.5

    //设置透明度
    self.subLayer.opacity = 0.5;

//设置子层变形,以x为旋转轴旋转45度

    //将子层以x轴为轴旋转45度
    self.subLayer.transform = CATransform3DMakeRotation(M_PI_4, 1, 0, 0);

//提交动画事物

    //动画事物提交
    [CATransaction commit];

3.演示结果如下：

没有任何触发时的截图：在屏幕右下角点击一下,子层慢慢移动了此位置,并且透明度慢慢变浅,形变产生