IOS开发之UIView动画

    通过IOS的UIView动画，能够产生流畅的动画效果，改善用户体验，最重要的，我们不用做太多工作就能够实现这些动画效果。我们可以通过下面这几个动画效果来实现：

（1）@property frame //基于父视图的位置和大小

（2）@property bounds //改变视图的框架和边界

（3）@property center //改变视图的中心位置

（4）@property transform //使视图产生选择效果

（5）@property alpha //改变视图的透明度

（6）@property backgroundColor //改变视图背景颜色

（7）@property contentStretch //使视图产生拉伸效果

1、然后我们来创建一个简单的UIView移动位置的动画

（1）普通方法实现视图移动

    UIImageView*bireView=[[UIImageView alloc]initWithFrame:CGRectMake(20, 20, 45, 36)]; //创建并初始化视图

    bireView.image=[UIImage imageNamed:@"鸟"];

    [self.view addSubview:bireView];

    [UIView beginAnimations:@"hello" context:bireView];//设置动画开始（第一个是动画名称，第二个是传给代理）

    [UIView setAnimationDuration:2];//动画时间

    [UIView setAnimationDelegate:self];//设置动画代理自身self

    [UIView setAnimationDidStopSelector:@selector(animationDidStop: finished: context:)];//当前设置动画的代理再动画执行结束时的方法

    bireView.center=CGPointMake(140, 80);//小鸟移动到的位置

 

    [UIView commitAnimations];//提交动画

（2）用UIView动画的Block语法实现视图的移动

       UIImageView *birdView=[[UIImageView alloc]initWithFrame:CGRectMake(20, 20, 45, 36)];

    birdView.image=[UIImage imageNamed:@"鸟"];

    [self.view addSubview:birdView];

    //---------------使用Block块代码设置动画代理----------------

    [UIView animateWithDuration:2 animations:^{

        //向右横向移动小鸟

        birdView.center=CGPointMake(170, 20);}

                     completion:^(BOOL finished) {

        [UIView animateWithDuration:2 animations:^{

            //向下竖着移动小鸟

            birdView.center=CGPointMake(180, 230);

        } completion:^(BOOL finished) {

            [UIView animateWithDuration:2 animations:^{

                //向左移动小鸟

                birdView.center=CGPointMake(20, 230);

            } completion:^(BOOL finished) {

                [UIView animateWithDuration:2 animations:^{

                    //向上竖着移动小鸟

                    birdView.center=CGPointMake(20, 20);

                } completion:^(BOOL finished) {

                    //回调函数（小鸟重复移动动画）

                [self moveBtn:nil];

                  //移动结束后移除小鸟

                [birdView removeFromSuperview];

                }];

            }];

        }];

   }];

2、实现视图的旋转

    CABasicAnimation *animation=[CABasicAnimation animationWithKeyPath:@"transform"];

    animation.fromValue=[NSValue valueWithCATransform3D:CATransform3DIdentity];

    //围绕Z轴旋转，垂直于屏幕

    animation.toValue=[NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI, 0, 0, 1.0)];

    animation.duration=1;

    //旋转效果累计，先转180度，接着再转180度，从而实现旋转360度

    animation.cumulative=YES;

    animation.repeatCount=111;

    [imgView2.layer addAnimation:animation forKey:nil];

3、实现视图的放大

    CGAffineTransform tf;

    tf=CGAffineTransformMakeScale(1.2, 1.2);//横轴竖轴放大1.2倍       

 

    [UIView animateWithDuration:2 animations:^{self.imgView2.transform=tf;} completion:^(BOOL finished) { }];

4、实现视图的翻页效果

    [UIView beginAnimations:nil context:nil];

    [UIView setAnimationDuration:2];

    [UIView setAnimationTransition:UIViewAnimationTransitionCurlDown forView:self.imgView2 cache:YES];

    [UIView commitAnimations];

5、实现视图的翻转

    [UIView beginAnimations:nil context:nil]

    [UIView setAnimationDuration:2];

    [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft forView:self.imgView2 cache:YES];

    [UIView commitAnimations];

6、实现视图的透明效果

    CABasicAnimation*animation=[CABasicAnimation animationWithKeyPath:@"opaciy"];//创建动画对象

    animation.toValue=[NSNumber numberWithFloat:0];

    animation.fromValue=[NSNumber numberWithFloat:1];

    animation.duration=2;

    animation.repeatCount=2;//动画重复次数

     animation.repeatDuration=100;//动画重复时间

     [self.imgView2.layer addAnimation:animation forKey:@"opc"];//forKey代表自己定义的动画名

7、实现视图的爆炸效果

     CABasicAnimation*animation=[CABasicAnimation animationWithKeyPath:@"bounds.size"];//创建动画对象

    animation.fromValue=[NSValue valueWithCGSize:CGSizeMake(0, 0)];

    animation.toValue=[NSValue valueWithCGSize:self.imgView2.frame.size];

    animation.duration=2;

    animation.repeatCount=10;

    [ self . imgView2 . layer addAnimation :animation forKey : @"exp" ];

8、实现视图按照相关路劲移动

    NSArray *pathArry=[NSArray arrayWithObjects:[NSValue valueWithCGPoint:CGPointMake(50, 50)],[NSValue valueWithCGPoint:CGPointMake(250, 50)], [NSValue valueWithCGPoint:CGPointMake(250, 250)], [NSValue valueWithCGPoint:CGPointMake(50, 250)], [NSValue valueWithCGPoint:CGPointMake(50, 50)],nil];

    CAKeyframeAnimation *animation=[CAKeyframeAnimation animationWithKeyPath:@"position"];

    animation.values=pathArry;

    animation.duration=2;

    animation.repeatCount=10;

    [ self . imgView2 . layer addAnimation :animation forKey : @"flay" ];