iOS动画:UIView动画和CALayer动画(CABasicAnimationCAKeyframeAnimation的使用)

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了iOS动画:UIView动画和CALayer动画(CABasicAnimationCAKeyframeAnimation的使用)相关的知识,希望对你有一定的参考价值。

 ios中的动画有两种实现方式,一种是UIView来实现动画,另一种动画是通过CALayer来实现,下面介绍两种动画的简单实现:

 

一、UIView动画的实现

   UIView使用Context来实现动画

关键代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
//参数1 动画名称 参数2 要实现动画的对象上下文
     
    [UIView beginAnimations:@"attribute" context:_showImageView];
     
    //设置动画的时间
    [UIView setAnimationDuration:1.0f];
     
    //设置动画延迟时间
//    [UIView setAnimationDelay:2];
     
    //设置视图center 实现试图移动动画
    _showImageView.center = CGPointMake(100, 100);
     
    //设置alpha值:视图透明度
    _showImageView.alpha = 0.2f;
     
    //设置背景颜色
    _showImageView.backgroundColor = [UIColor greenColor];
     
    //UIView动画 设置代理
    [UIView setAnimationDelegate:self];
     
    //动画将要开始代理方法
    [UIView setAnimationWillStartSelector:@selector(animationWillStart:context:)];
     
    //动画已经结束代理方法
    [UIView setAnimationDidStopSelector:@selector(animationDidStop:finished:context:)];
     
    //提交动画设置,执行动画
    [UIView commitAnimations];

 

 

使用Block实现的动画:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
//UIView动画, 使用Block实现
    [UIView animateWithDuration:1.0f animations:^{
         
        //通过设置translation 实现视图的偏移
        if ([self.mySwitch isOn]) {
             
            //基于上一次的translation
            _showImageView.transform = CGAffineTransformTranslate(_showImageView.transform, 50, 0);
        else {
             
            //基于原始的translation
            _showImageView.transform = CGAffineTransformMakeTranslation(-50, 0);
        }
    }];

 

 

二、CALayer动画的实现

CABasic动画的实现:根据初始位置和结束位置确定动画

1
2
3
4
5
6
//CABasic 有两个属性 fromValue 动画开始值,toValue动画结束值
    CABasicAnimation *animation1 = [CABasicAnimation animationWithKeyPath:@"position"];
    [animation1 setDuration:2];
    animation1.fromValue = [NSValue valueWithCGPoint:CGPointMake(150, 150)];
    animation1.toValue = [NSValue valueWithCGPoint:CGPointMake(200, 200)];
    [_imageView.layer addAnimation:animation1 forKey:@"position"];

 

 

创建一组动画:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
//创建组动画对象
    CAAnimationGroup *group = [CAAnimationGroup animation];
     
    //CABasic动画
    CABasicAnimation *animation1 = [CABasicAnimation animationWithKeyPath:@"transform.scale.y"];
    animation1.fromValue = @1.5;
    animation1.toValue = @0.5;
     
    //关键帧动画
    CAKeyframeAnimation *animation2 = [CAKeyframeAnimation animationWithKeyPath:@"position"];
    animation2.values = @[[NSValue valueWithCGPoint:CGPointMake(100, 100)],
                         [NSValue valueWithCGPoint:CGPointMake(200, 150)],
                         [NSValue valueWithCGPoint:CGPointMake(100, 200)],
                         [NSValue valueWithCGPoint:CGPointMake(200, 250)]];
     
    //group添加动画数组,group中动画对象并发执行
    [group setAnimations:@[animation1, animation2]];
    [group setDuration:4.0f];
    [_imageView.layer addAnimation:group forKey:@"group"];

 

以上是关于iOS动画:UIView动画和CALayer动画(CABasicAnimationCAKeyframeAnimation的使用)的主要内容,如果未能解决你的问题,请参考以下文章

iOS边练边学--CALayer,非根层隐式动画,钟表练习

使用 UIView 或 CALayer 绘制和动画?

UIView动画效果

使用 UIViewPropertyAnimator 同步动画 CALayer 属性和 UIView

CALayer 的简介 和Core Animation动画效果 A

CALayer动画