美文网首页
UIKit动画

UIKit动画

作者: 我不白先生 | 来源:发表于2020-10-30 14:45 被阅读0次

    ios动画

    • 1)序列帧动画是由多个动画帧按照一定的间隔时间逐帧连续播放而形成的动画
      ViewController.m
    #import "ViewController.h"
    @interface ViewController ()
    @property (weak, nonatomic) IBOutlet UIImageView *imageView;
    @property (weak, nonatomic) IBOutlet UIImageView *imageView2;
    @end
    @implementation ViewController
    -(void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
        /********************imageView2动画************************/
        NSMutableArray *mArray = [NSMutableArray array];
        for(NSInteger i = 0; i  < 12 ; i++){
            UIImage *image = [UIImage imageNamed:[NSString stringWithFormat:@"xiaolu%02ld",i+1]];
            [mArray addObject:image];
        }
        //将图片对象数组 赋值给imageView2.animationImages属性
        self.imageView2.animationImages = mArray;
        //设置动画时长
        self.imageView2.animationDuration = 3;
        //动画重复次数  设置为0 是无限循环
        self.imageView2.animationRepeatCount = 8;
        //开始运行动画
        [self.imageView2 startAnimating];
    }
    - (void)viewDidLoad {
        [super viewDidLoad];
        // Do any additional setup after loading the view, typically from a nib.
        /********************imageView动画************************/
        //自动去找xiaolu1、2、3、4图片
        UIImage *image = [UIImage animatedImageNamed:@"xiaolu0" duration:1];
        self.imageView.image = image;
    }
    
    • 2)补间动画:只需要设置动画起始状态和结束状态及动画的持续时间,iOS系统就会帮我们自动完成动画的过程(UIView做的)


      image.png
      image.png
      image.png
    image.png
    image.png
    image.png
    image.png
    image.png
    image.png
    image.png

    ViewController.m

    @interface ViewController ()
    @property (weak, nonatomic) IBOutlet UIImageView *imageView;
    @end
    @implementation ViewController
    -(void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
       // [UIView animateWithDuration:<#(NSTimeInterval)#> animations:<#^(void)animations#> completion:<#^(BOOL finished)completion#>]
       /**
        @param  Duration  持续时间
        @param  deplay    延迟时间 动画等待多长时间开始运行
        @param  options   动画选项
        @param  animations 动画体 里面写视图动画结束时的状态
        @param  completion  动画完成时 做什么事
        
        */
      //[UIView animateWithDuration:<#(NSTimeInterval)#> delay:<#(NSTimeInterval)#> options:<#(UIViewAnimationOptions)#> animations:<#^(void)animations#> completion:<#^(BOOL finished)completion#>
        [UIView animateWithDuration:3 animations:^{
            //        //设置结束位置一般用中心点center改变位置
            self.imageView.center = CGPointMake(150, 700);
            //        //设置结束透明度
            self.imageView.alpha = 1;
            //设置结束大小
            CGRect bounds = self.imageView.frame;
            bounds.size =CGSizeMake(400, 250);
            self.imageView.bounds = bounds;
        }];
    }
    - (void)viewDidLoad {
        [super viewDidLoad];
        // Do any additional setup after loading the view, typically from a nib.
        //设置起始位置
        self.imageView.center = CGPointMake(50, 50);
        //设置起始透明度
        self.imageView.alpha = 0;
        self.imageView.bounds = CGRectMake(0, 0, 200, 100);
    }
    
    • 3)关键帧动画:其实也是补间动画,只是需要再起始和结束中间插入一些关键点,在这些关键点中做补间动画


      image.png

      对UIView做动画并勾选了imageView超出自己范围不显示并切割掉


      image.png
      ViewController.m
    @interface ViewController ()
    @property (weak, nonatomic) IBOutlet UIImageView *imageView;
    @property (weak, nonatomic) IBOutlet UIView *myView;
    @property(nonatomic,assign)CGFloat viewHeight;
    @end
    @implementation ViewController
    -(void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
        //设置UIView动画4秒钟高度从0变成view自身的高度
        [UIView animateWithDuration:4 animations:^{
            CGRect frame = self.myView.frame;
            frame.size.height = self.viewHeight;
            self.myView.frame = frame;
        }];
    }
    - (void)viewDidLoad {
        [super viewDidLoad];
        CGRect frame = self.myView.frame;
        self.viewHeight = frame.size.height;
        frame.size.height = 0;
        self.myView.frame = frame;
    }
    

    相关文章

      网友评论

          本文标题:UIKit动画

          本文链接:https://www.haomeiwen.com/subject/yxirvktx.html