·您现在的位置: 云翼网络 >> 文章中心 >> 网站建设 >> app软件开发 >> IOS开发 >> iOSCoreAnimation学习总结(3)--动画的基本类型

iOSCoreAnimation学习总结(3)--动画的基本类型

作者:佚名      IOS开发编辑:admin      更新时间:2022-07-23

一. CABasicAnimation (基础动画)

移位:

    CABasicAnimation *animation = [CABasicAnimation animation];
    //keyPath指定动画类别,position表示移位
    animation.keyPath = @"position";
    //移动到x=200,y=200的位置
    animation.toValue = [NSValue valueWithCGPoint:CGPointMake(200, 200)];
    animation.duration = 2;
    //动画执行完毕后不删除动画
    animation.removedOnCompletion = NO;
    //保持最新的状态
    animation.fillMode = @"forwards";
    //添加动画
    [self.layer addAnimation:animation forKey:nil];

缩放:

    CABasicAnimation *animation = [CABasicAnimation animation];
    //keyPath指定动画类别,bounds表示缩放
    animation.keyPath = @"bounds";
    //缩放到width=50,height=50
    animation.toValue = [NSValue valueWithCGRect:CGRectMake(0, 0, 50, 50)];
    animation.duration = 2;
    //动画完成不删除动画
    animation.removedOnCompletion = NO;
    //保持最新的状态
    animation.fillMode = @"forwards";
    
    [self.layer addAnimation:animation forKey:nil];

旋转:

    CABasicAnimation *animation = [CABasicAnimation animation];
    //keyPath指定动画类别,transform表示旋转
    animation.keyPath = @"transform";
    //沿x,y轴顺时针旋转45度
    animation.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI_4, 1, 1, 0)];
    animation.duration = 2;
    animation.removedOnCompletion = NO;
    animation.fillMode = @"forwards";
    
    [self.layer addAnimation:animation forKey:nil];

 

二.  CAKeyframeAnimation (关键帧动画)

    CAKeyframeAnimation *anim = [CAKeyframeAnimation animation];
    
    anim.keyPath = @"position";
    anim.removedOnCompletion = NO;
    anim.fillMode = kCAFillModeForwards;
    anim.duration = 2.0;
    
    //设置圆形轨迹,并绕圆形轨迹移动
    CGMutablePathRef path = CGPathCreateMutable();
    CGPathAddEllipseInRect(path, NULL, CGRectMake(100, 100, 200, 200));
    anim.path = path;
    CGPathRelease(path);
    
    
    // 设置动画的执行节奏
    // kCAMediaTimingFunctionEaseInEaSEOut : 一开始比较慢, 中间会加速,  临近结束的时候, 会变慢
    anim.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    anim.delegate = self;
    [anim setValue:@"aaa" forKey:@"TAG"];
    [self.layer addAnimation:anim forKey:nil];

设置代理的回调方法,让动画结束后弹出提示

- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag
{
    NSString *strTag = [anim valueForKey:@"TAG"];
    if ([strTag isEqualToString:@"aaa"]) {
        UIAlertView *alert = [[UIAlertView alloc] initWithTitle:@"Animation Done" message:@"动作完成" delegate:self cancelButtonTitle:nil otherButtonTitles:@"确定", nil];
        [alert show];
    }
}

 

三. CATransition(转场动画)

(1)视图跳转

    _newView = [[UIView alloc] init];
    _newView.frame = CGRectMake(100, 100, 100, 100);
    [self.view addSubview:_newView];
    
    UIView *view1 = [[UIView alloc] init];
    view1.frame = CGRectMake(0, 0, 100, 100);
    view1.backgroundColor = [UIColor yellowColor];
    [_newView addSubview:view1];
    
    UIView *view2 = [[UIView alloc] init];
    view2.frame = CGRectMake(0, 0, 100, 100);
    view2.backgroundColor = [UIColor greenColor];
    [_newView addSubview:view2];

添加转场按钮事件处理:

- (IBAction)exchangeView {
    // 转场动画
    CATransition *transition = [CATransition animation];
    transition.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    transition.type = @"pageCurl";
    transition.subtype = kCATransitionFromRight;
    transition.duration = 1;
    [_newView exchangeSubviewAtIndex:0 withSubviewAtIndex:1];
    [_newView.layer addAnimation:transition forKey:@"myAnimation"];
}

(2)控制器跳转

- (IBAction)pushView {
    CATransition *transition = [CATransition animation];
    transition.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    //立体动画效果
    transition.type = @"cube";
    [self.navigationController.view.layer addAnimation:transition forKey:@"navAnimation"];
    TestViewController *testVC = [[TestViewController alloc] init];
    [self.navigationController showViewController:testVC sender:nil];
}

四. CAAnimationGroup (组合动画)

    //添加图片
    UIImageView *imgView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"curry.jpg"]];
    imgView.frame = CGRectMake(100, 100, imgView.frame.size.width, imgView.frame.size.height);
    [self.view addSubview:imgView];
    
    //贝塞尔曲线路径
    UIBezierPath *movePath = [UIBezierPath bezierPath];
    [movePath moveToPoint:CGPointMake(10.0, 10.0)];
    [movePath addQuadCurveToPoint:CGPointMake(100, 300) controlPoint:CGPointMake(300, 100)];
    
    //以下必须导入QuartzCore包
    //关键帧动画(位置)
    CAKeyframeAnimation * posAnim = [CAKeyframeAnimation animationWithKeyPath:@"position"];
    posAnim.path = movePath.CGPath;
    posAnim.removedOnCompletion = YES;
    
    //缩放动画
    CABasicAnimation *scaleAnim = [CABasicAnimation animationWithKeyPath:@"transform"];
    scaleAnim.fromValue = [NSValue valueWithCATransform3D:CATransform3DIdentity];
    scaleAnim.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeScale(0.1, 0.1, 1.0)];
    scaleAnim.removedOnCompletion = YES;
    
    //透明动画
    CABasicAnimation *opacityAnim = [CABasicAnimation animationWithKeyPath:@"alpha"];
    opacityAnim.fromValue = [NSNumber numberWithFloat:1.0];
    opacityAnim.toValue = [NSNumber numberWithFloat:0.1];
    opacityAnim.removedOnCompletion = YES;
    
    //动画组
    CAAnimationGroup *animGroup = [CAAnimationGroup animation];
    animGroup.animations = [NSArray arrayWithObjects:posAnim, scaleAnim, opacityAnim, nil];
    animGroup.duration = 1;
    
    [imgView.layer addAnimation:animGroup forKey:nil];