zoukankan      html  css  js  c++  java
  • UIView动画

    过渡动画

    1、CAAnimation的子类,用于做转场动画,能够为层提供移出屏幕和移入屏幕的动画效果

    type:动画过渡类型

    subtype:动画过渡方向

    startProgress:动画起点(在整体动画的百分比)

    endProgress:动画终点(在整体动画的百分比)

     CATransition *ca=[CATransition animation];

        //设置过度效果

        ca.type=@"cube";

        //设置动画的过度方向(向左)

        ca.subtype=kCATransitionFromLeft;

        //设置动画的时间

        ca.duration=1.0;

        //添加动画

      self.redView.backgroundColor = [UIColor blueColor];

        [self.redView.layer addAnimation:ca forKey:nil];

    2、实例

     //1 准备动画

        [UIView beginAnimations:@"过度动画" context:NULL];

        [UIView setAnimationDuration:5];

        [UIView setAnimationRepeatCount:50];

        //2 设置过度样式

        //参数1: 过度样式, 参数2: 指定那个View做动画, 参数3: 是否设置缓存

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

        self.redView.backgroundColor = [UIColor colorWithRed:arc4random() % 256 / 255.0 green:arc4random() % 256 / 255.0 blue:arc4random() % 256 / 255.0 alpha:0.5];

        //3 提交并执行动画

        [UIView commitAnimations];

    //UIView属性动画

    - (IBAction)pressPropertyAnimation:(id)sender {

        //1 准备动画

        //参数1: 动画的作用, 用来区分多个动画, 参数二: 传递参数用 nil:OC中使用 NULL:C语言使用

        [UIView beginAnimations:@"改变大小" context:NULL];

        //在准备动画的时候可以设置动画的属性

        [UIView setAnimationDuration:2];//设置动画的持续时间

        [UIView setAnimationDelegate:self];

        [UIView setAnimationWillStartSelector:@selector(startAnimation)];

        //    [UIView setAnimationDelay:1];//动画延迟执行时间

        [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];//动画的曲线

        [UIView setAnimationRepeatCount:20];//动画的重复次数

        [UIView setAnimationRepeatAutoreverses:YES];//动画往返执行, 必须设置动画的重复次数

        //2 修改view的属性, 可以同时修改多个属性 注意:不是所有的属性都可以修改的(只有frame, center, bounds, backgroundColor, alpha, transform 可以修改)

        self.redView.frame = CGRectMake(110, 100, 100, 100);

        //    self.redView.backgroundColor = [UIColor brownColor];

        self.redView.backgroundColor = [UIColor colorWithRed:arc4random() % 256 / 255.0 green:arc4random() % 256 / 255.0 blue:arc4random() % 256 / 255.0 alpha:0.5];

        //3 提交并执行动画

        [UIView commitAnimations];

    }

    组动画

    CAAnimation的子类,可以保存一组动画对象,将CAAnimationGroup对象加入层后,组中所有动画对象可以同时并发运行

    animations:用来保存一组动画对象的NSArray

    默认情况下,一组动画对象是同时运行的,也可以通过设置动画对象的beginTime属性来更改动画的开始时间

    // 平移动画

        CABasicAnimation *a1 = [CABasicAnimation animation];

        a1.keyPath = @"transform.translation.y";

        a1.toValue = @(100);

        a1.duration = 1.0;

        a1.beginTime = 0;

        a1.fillMode = kCAFillModeForwards;

        // 缩放动画

        CABasicAnimation *a2 = [CABasicAnimation animation];

        a2.keyPath = @"transform.scale";

        a2.toValue = @(0.5);

        a2.duration = 1.0;

        a2.beginTime = 1.0;

        a2.fillMode = kCAFillModeForwards;

     

        // 旋转动画

        CABasicAnimation *a3 = [CABasicAnimation animation];

        a3.keyPath = @"transform.rotation";

        a3.toValue = @(M_PI_4);

        a3.duration = 1.0;

        a3.beginTime = 2.0;

        a3.fillMode = kCAFillModeForwards;

      

        // 组动画

        CAAnimationGroup *groupAnima = [CAAnimationGroup animation];

        groupAnima.animations = @[a1, a2, a3];

        

        //设置组动画的时间

        groupAnima.duration = 3;

        groupAnima.fillMode = kCAFillModeForwards;

        groupAnima.removedOnCompletion = NO;

        

        [self.redView.layer addAnimation:groupAnima forKey:nil];

    //    CAAnimationGroup 组动画

    - (IBAction)pressAnimationGroup:(id)sender {

        

        //1 创建并指定要修改的属性

        //    KeyPath:CAlayer的属性名, 不是所有的属性都可以, 只有在头文件中出现animatable的属性才可以, 可以修改属性的属性, 例如:bounds.size

        //    CALayer

        CABasicAnimation *basic = [CABasicAnimation animationWithKeyPath:@"bounds"];

        [basic setDuration:2];

        //2 修改属性值

        basic.fromValue = [NSValue valueWithCGRect:CGRectMake(0, 0, self.redView.bounds.size.width, self.redView.bounds.size.height)];

        basic.toValue = [NSValue valueWithCGRect:CGRectMake(0, 0, 300, 300)];

        

        CAKeyframeAnimation *keyFrame = [CAKeyframeAnimation animationWithKeyPath:@"backgroundColor"];

        [keyFrame setDuration:5];

        keyFrame.values = @[(id)[UIColor redColor].CGColor, (id)[UIColor orangeColor].CGColor, (id)[UIColor yellowColor].CGColor, (id)[UIColor greenColor].CGColor, (id)[UIColor blueColor].CGColor];

        //keyTimes中的第一个值是0, 不能修改

        keyFrame.keyTimes = @[@(0.3), @(0.5), @(0.6), @(0.7), @(0.9)];

        

    // 创建

        //当group动画的时长 > 组中所有动画的最长时长, 动画的时长以组中最长的时长为准

        //当group动画的时长 < 组中所有动画的最长时长, 动画的时长以group的时长为准

        //最合适: group的时长 = 组中所有动画的最长时长

        CAAnimationGroup *group = [CAAnimationGroup animation];

        [group setDuration:10];

        //设置组动画

        group.animations = @[basic, keyFrame];

        //添加动画

        [self.redView.layer addAnimation:group forKey:nil];

    }

    //Block动画

    - (IBAction)pressBlockAnimation:(id)sender {

        //只有一行代码 Block动画实质是对UIView动画的封装

        //参数1:动画时长 参数2:Block: 设置要修改的View属性

        /*

         [UIView animateWithDuration:2 animations:^{

         self.redView.backgroundColor = [UIColor orangeColor];

         }];

         */

        //第二种Block

        /*

         //参数1:动画时长 参数2:Block: 设置要修改的View属性 参数3: 动画完成时调用

         [UIView animateWithDuration:2 animations:^{

         self.redView.backgroundColor = [UIColor orangeColor];

         } completion:^(BOOL finished) {

         //finished判断动画是否完成

         if (finished) {

         NSLog(@"finished");

         }

         }];

         */

        //第三种Block

        /*

         [UIView animateWithDuration:2 delay:1 options:UIViewAnimationOptionCurveEaseInOut animations:^{

         //        设置要修改的View属性

         self.redView.backgroundColor = [UIColor orangeColor];

         } completion:^(BOOL finished) {

         //finished判断动画是否完成

         if (finished) {

         NSLog(@"finished");

         }

         }];

         */

        //对过度动画的封装

        //参数1: 改变的View 参数2:动画时长 参数3:动画类型 参数4 Block: 设置要修改的View属性 参数5:完成后的操作

        [UIView transitionWithView:self.redView duration:2 options:UIViewAnimationOptionTransitionFlipFromLeft animations:^{

            self.redView.backgroundColor = [UIColor orangeColor];

        } completion:^(BOOL finished) {

            //finished判断动画是否完成

            if (finished) {

                NSLog(@"finished");

            }

        }];

       //UIView和CALayer的关系

        //UIView负责交互, frame以及显示CALayer

        //CALayer负责渲染, 并且它是UIView的一个readonly属性

        /*

         self.redView.layer.cornerRadius = 100;//设置圆角, 参数是内切圆的半径, 若想画一个圆, 前提是view必须是正方形, 参数应该是view边长的一半

         self.redView.layer.borderWidth = 1;//设置描边的宽度

         self.redView.layer.borderColor = [UIColor orangeColor].CGColor;//设置描边的颜色(UIView上的颜色使用的是UIColor, CALayer上使用的颜色是CGColor)

         self.redView.layer.shadowOffset = CGSizeMake(50, 100);//设置阴影的偏移量 width影响水平偏移(正右负左), height影响垂直偏移(正下负上)

         self.redView.layer.shadowColor = [UIColor grayColor].CGColor;//阴影的偏移的颜色

         self.redView.layer.shadowOpacity = 1;//阴影的不透明度, 取值范围(0 ~ 1), 默认是0, 就是透明的

         */

        //    CAAnimation抽象类, 使用必须要使用其具体的子类

        //    CAPropertyAnimation抽象子类, 需要子类化

        //    CABasicAnimation

        //    CAKeyframeAnimation

    }

  • 相关阅读:
    登录注册功能
    29-----BBS论坛
    linux笔记
    nginx,uwsgi发布web服务器
    linux常用服务部署
    linux系统基础优化及常用命令
    linux基本操作命令
    linux命令
    linux基础
    阿里云服务器搭建
  • 原文地址:https://www.cnblogs.com/PJXWang/p/5514212.html
Copyright © 2011-2022 走看看