动画总结

最新推荐文章于 2021-12-22 11:30:48 发布

weixin_30258027

最新推荐文章于 2021-12-22 11:30:48 发布

阅读量45

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/wcLT/p/4100386.html

本文详细介绍了如何在iOS应用中实现各种翻页动画效果，包括使用UIView和CATransition进行动画设置的方法，通过代码示例展示了不同动画类型的实现过程。

//翻页效果动画 左边
    [UIView beginAnimations:@"animation" context:nil];
    [UIView setAnimationDuration:1.0f];
    [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:self.navigationController.view cache:YES];
    [UIView commitAnimations];
    
    //翻页效果动画 右边
    [UIView beginAnimations:nil context:NULL];
    [UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
    [UIView setAnimationDuration:0.35f];
    [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft forView:self.navigationController.view cache:NO];
    [UIView commitAnimations];
    
    
    //lar动画,从上到下模糊
    CATransition *animation = [CATransition animation];
    [animation setDuration:2.0f];
    [animation setFillMode:kCAFillModeForwards];
    [animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]];
    [animation setType:kCATransitionPush];
    [animation setSubtype:kCATransitionFromBottom];
    [self.navigationController.navigationBar.layer addAnimation:animation forKey:nil];
    
    //折页效果动画
    [UIView animateWithDuration:0.35f animations:^
     {
         /**
          *  @see       http://donbe.blog.163.com/blog/static/138048021201061054243442/
          *
          *  @param     transform   形变属性(结构体),可以利用这个属性去对view做一些翻转或者缩放.详解请猛戳↑URL.
          *
          *  @method    valueWithCATransform3D: 此方法需要一个CATransform3D的结构体.一些非详细的讲解可以看下面的URL
          *
          *  @see       http://blog.youkuaiyun.com/liubo0_0/article/details/7452166
          *
          */
         
         self.navigationController.view.transform = CGAffineTransformMakeScale(0.001, 0.001);
         
         CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform"];
         
         // 向右旋转45°缩小到最小,然后再从小到大推出.
         animation.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI, 0.70, 0.40, 0.80)];
         
         /**
          *     其他效果:
          *     从底部向上收缩一半后弹出
          *     animation.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI, 0.0, 1.0, 0.0)];
          *
          *     从底部向上完全收缩后弹出
          *     animation.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI, 1.0, 0.0, 0.0)];
          *
          *     左旋转45°缩小到最小,然后再从小到大推出.
          *     animation.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI, 0.50, -0.50, 0.50)];
          *
          *     旋转180°缩小到最小,然后再从小到大推出.
          *     animation.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI, 0.1, 0.2, 0.2)];
          */

         
         animation.duration = 2;
         animation.repeatCount = 1;
         [self.navigationController.view.layer addAnimation:animation forKey:nil];
         
     }
                     completion:^(BOOL finished)
     {
         [UIView animateWithDuration:0.35f animations:^
          {
              self.navigationController.view.transform = CGAffineTransformMakeScale(1.0, 1.0);
          }];
     }];
    
    
    //从下到上模糊推出
    CATransition *animation = [CATransition animation];
    [animation setDuration:1.0f];
    [animation setType:kCATransitionReveal];
    [animation setSubtype:kCATransitionFromTop];
    [animation setFillMode:kCAFillModeForwards];
    [animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]];
    
    [self.navigationController.navigationBar.layer addAnimation:animation forKey:nil];
    
    
    //旋转动画
    CABasicAnimation *rotationAnimation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];
    rotationAnimation.toValue = [NSNumber numberWithFloat:(2 * M_PI) * 2];
    rotationAnimation.duration = 0.35f;
    rotationAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    
    CABasicAnimation *scaleAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
    scaleAnimation.toValue = [NSNumber numberWithFloat:0.0];
    scaleAnimation.duration = 0.35f;
    scaleAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    
    CAAnimationGroup *animationGroup = [CAAnimationGroup animation];
    animationGroup.duration = 2.35f;
    animationGroup.autoreverses = YES;
    animationGroup.repeatCount = 1;
    animationGroup.animations =[NSArray arrayWithObjects:rotationAnimation, nil];
    [self.navigationController.view.layer addAnimation:animationGroup forKey:@"animationGroup"];

    
    
    [UIView commitAnimations];
    CATransition *animation = [CATransition animation];
    [animation setDuration:0.8];
     /* 各种动画效果*/
    /* type类型 */  /*这里要注意不用私有方法*/
    /*
     pageCurl   向上翻一页
     pageUnCurl 向下翻一页
     rippleEffect 滴水效果
     suckEffect 收缩效果，如一块布被抽走
     cube 立方体效果
     oglFlip 上下翻转效果
     */
    
    [animation setType: kCATransitionReveal];
    /* 动画方向*/
    /* SubType类型 */
     /*
     kCATransitionFade淡出
     kCATransitionMoveIn覆盖原图
     kCATransitionPush推出
     kCATransitionReveal底部显出来
     也可以有四种类型：
     kCATransitionFromRight；
     kCATransitionFromLeft
     kCATransitionFromTop；
     kCATransitionFromBottom
     */
    [animation setSubtype: kCATransitionFromBottom];
     /* 动画的开始与结束的快慢*/ [animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]]; [self.navigationController.self.view.layer addAnimation:animation forKey:nil]; //这里应用场景是已经有2个viewController插入要的self.view上 /* [self.view insertSubview:self.blueController.view atIndex:0]; [self.view insertSubview:self.yellowController.view atIndex:1]; */ [self.view exchangeSubviewAtIndex:0 withSubviewAtIndex:1]; //UIView开始动画，第一个参数是动画的标识，第二个参数附加的应用程序信息用来传递给动画代理消息 [UIView beginAnimations:@"animation" context:nil]; //动画持续时间 [UIView setAnimationDuration:1.25]; //设置动画的回调函数，设置后可以使用回调方法 [UIView setAnimationDelegate:self]; //设置动画曲线，控制动画速度 [UIView setAnimationCurve: UIViewAnimationCurveEaseInOut]; //设置动画方式，并指出动画发生对象 [UIView setAnimationTransition:UIViewAnimationTransitionCurlUp forView:self.navigationController.view cache:YES];//cache /*cache 如果是YES，那么在开始和结束图片视图渲染一次并在动画中创建帧；否则，视图将会在每一帧都渲染。例如缓存，你不需要在视图转变中不停的更新，你只需要等到转换完成再去更新视图。 讨论 */ //设置动画重复 [UIView setAnimationRepeatCount:5.0]; //提交UIView动画 结束动画 [UIView commitAnimations]; //开始一个动画块 [UIView beginAnimations:@"animationID" context:nil]; //设置动画块中的动画持续时间（用秒） [UIView setAnimationDuration:1.5f]; //设置动画块中的动画属性变化的曲线 [UIView setAnimationCurve:UIViewAnimationCurveLinear]; /*变化曲线还有 （ UIViewAnimationCurveEaseInOut, // slow at beginning and end UIViewAnimationCurveEaseIn, // slow at beginning UIViewAnimationCurveEaseOut, // slow at end UIViewAnimationCurveLinear） */ //设置动画块中的动画效果是否自动重复播放。 [UIView setAnimationRepeatAutoreverses:NO]; //设置动画在动画模块中的重复次数 //setAnimationRepeatCount: //设置动画消息的代理。 [UIView setAnimationDelegate:self]; /* UIView动画的代理方法 // [UIView // //设置消息给动画代理当动画开始的时候 // setAnimationWillStartSelector:@selector(resizeAnimationWillStart:context:)]; // [UIView // //设置消息给动画代理当动画停止的时候 // setAnimationDidStopSelector:@selector(resizeAnimationDidStop:finished:context:)]; //将效果作用在指定的view */ [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:self.navigationController.view cache:YES]; /* 效果还有（UIViewAnimationTransitionFlipFromLeft，UIViewAnimationTransitionFlipFromRight，UIViewAnimationTransitionCurlUp，UIViewAnimationTransitionCurlDown） */ //显示在最前面 [self.view exchangeSubviewAtIndex:1 withSubviewAtIndex:0]; //结束动画 [UIView commitAnimations];

[view addSubview:imageView];

[UIView animateWithDuration:1 //时长

delay:0 //延迟时间

options:kCAFillModeForwards//动画效果

animations:^{

//动画设置区域

imageView.backgroundColor=[UIColor blueColor];

imageView.frame=CGRectMake(50, 50, 200, 200);

imageView.alpha=0.5;

// animation.fillMode=kCAFillModeForwards ;

} completion:^(BOOL finish){

//动画结束时调用