iOS开发之动画组CAAnimationGroup_ios 动画组-优快云博客

本文探讨了iOS开发中CAAnimationGroup的使用，重点介绍了其关键属性，包括animations数组和beginTime属性。同时，举例说明了如何创建一个花瓣飘落并伴有旋转效果的动画实例，强调了设置动画组持续时间可能对内部动画持续时间的影响。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

CAAnimationGroup 的两个重要属性

1、动画的数组 animations

2、启动的时间 beginTime

注意：动画组设置了持续时间(duration)，可能会导致动画里面的动画持续时间失效

实例：花瓣在飘落的同时，自身也有动画（自身在旋转）

1、设置背景图，再设置一个CALayer内容为花瓣图

    UIImageView *iv = [[UIImageView alloc]initWithFrame:[UIScreen mainScreen].bounds];
    iv.image = [UIImage imageNamed:@"背景.jpg"];
    [self.view addSubview:iv];

    UIImage *image = [UIImage imageNamed:@"花瓣"];
    petal = [[CALayer alloc]init];
    petal.position = CGPointMake(100, 200);
    petal.bounds = CGRectMake(0, 0, image.size.width, image.size.height);
    petal.contents = (id)image.CGImage;
    
    [self.view.layer addSublayer:petal];

2、编译一个旋转动画（基础动画）的方法

- (CABasicAnimation *)rotationAnimation
{
    CABasicAnimation *rotation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];
    rotation.toValue = @(M_PI_2*3);
    rotation.removedOnCompletion = NO;

    return rotation;
}

3、编译一个下落的动画（关键帧动画）的方法

<span style="color:#333333;">- (CAKeyframeAnimation *)dropAnimation
{
    CAKeyframeAnimation *drop = [CAKeyframeAnimation animationWithKeyPath:@"position"];
    
    CGMutablePathRef pathRef = CGPathCreateMutable();
    CGPathMoveToPoint(pathRef, NULL, petal.position.x, petal.position.y);
</span><span style="color:#33cc00;"> //    CGPathAddCurveToPoint cp1x y cpx y 设置两个点 在这两个点之间画曲线
 //    x y 终止点</span><span style="color:#333333;">
    CGPoint endPoint = CGPointMake(80, 500);
    CGPathAddCurveToPoint(pathRef, NULL, 160, 280, -30, 300, endPoint.x, endPoint.y);
    
    drop.path = pathRef;
    CGPathRelease(pathRef);

    return drop;   
}</span>

4、添加动画组，把上面编译的两个方法作为实现动画组的animations

<span style="color:#cc33cc;">-</span><span style="color:#333333;"> (void)addAnimationGroup
{
    CAAnimationGroup *animationGroup = [CAAnimationGroup animation];
    animationGroup.animations = @[[self rotationAnimation],[self dropAnimation]];
    animationGroup.duration = 10;
</span><span style="color:#33cc00;">//    beginTime 动画开始的时间
//    CACurrentMediaTime 获得当前的时间
</span><span style="color:#333333;">
    animationGroup.beginTime = CACurrentMediaTime() + 5;  </span><span style="color: rgb(51, 204, 0); font-family: 'Heiti SC Light';">//    从调用这个方法开始 5秒之后 执行动画</span><span style="color:#333333;">

    animationGroup.removedOnCompletion = NO;
    animationGroup.fillMode = kCAFillModeBoth;
    
    [petal addAnimation:animationGroup forKey:@"animationGroup"];
}</span>