1.最简单的动画(view的移动或者View的缩小与放大)
- (void)viewDidLoad { [super viewDidLoad]; view4 = [[UIView alloc]initWithFrame:CGRectMake(354, 676, 60, 60)]; view4.backgroundColor = [UIColor yellowColor]; [self.view addSubview:view4]; //准备动画 [UIView beginAnimations:nil context:nil]; //给动画设置时间间隔 [UIView setAnimationDuration:3]; //设置动画的重复次数 [UIView setAnimationRepeatCount:1]; //重复执行的时候,第二次响应相反的效果 //[UIView setAnimationRepeatAutoreverses:YES]; [UIView setAnimationDelegate:self]; //动画开始时,执行方法选择器选择的方法 //[UIView setAnimationWillStartSelector:@selector(willStart)]; [UIView setAnimationDidStopSelector:@selector(didStop)]; view4.frame =CGRectMake(354,0, 60, 60); //真正开始动画 [UIView commitAnimations]; }
需要注意的地方:必须挂代理,动画开始和结束的方法才会被调用,这里的代理是没有协议的,遵守的是监听动画开始和结束的方法
2.gif动态图片的播放(TOM喝牛奶为例为例)(需要TOM资源的可以简书联系我)
- (void)viewDidLoad { [super viewDidLoad]; UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom]; button.frame = CGRectMake(15, 580, 60, 60); button.layer.cornerRadius = 25; [button addTarget:self action:@selector(milk) forControlEvents:UIControlEventTouchUpInside]; [button setImage:[UIImage imageNamed:@"牛奶"] forState:UIControlStateNormal]; button.clipsToBounds = YES; [self.view addSubview:button]; }
-(void)milk { UIImageView *imageView = [[UIImageView alloc] initWithFrame:self.view.bounds]; [self.view addSubview:imageView]; NSMutableArray imagesArray = [NSMutableArray array]; for (int index = 0; index<81; index++) { NSString *string = [NSString stringWithFormat:@"eat_%d.jpg",index]; UIImage *image = [UIImage imageNamed:str]; [imagesArray addObject:image]; } //给iamgeView设置动画图片 imageView.animationImages = imagesArray; //设置动画时间 imageView.animationDuration = 4; //设置重复次数 imageView.animationRepeatCount =1; //设置0也表示无数次执行 //让动画开始 [imageView startAnimating]; //让动画结束 //[imageView stopAnimating]; }
需要注意的地方:图片的加载上是一个数组,然后把数组给动画进行播放。获取动态图片可以到百度,输入“gif图片”就可以了,下载下来,打开图片,可以看到是有很多张图片组成,统一进行改名字(便于使用)。
3.利用Block语句进行动画(有关透明度的问题,也是一种动画)
-(void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event { UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(100, 100, 250, 300)]; label.center = self.view.center; label.backgroundColor = [UIColor redColor]; [self.view addSubview:label]; label.text = @"动画"; label.textAlignment = NSTextAlignmentCenter; label.layer.cornerRadius = 10; label.clipsToBounds = YES; label.alpha = 0; label.backgroundColor = [UIColor greenColor]; [self.view addSubview:label]; [UIView animateWithDuration:5 animations:^{ label.alpha = 1; } completion:^(BOOL finished) { [UIView animateWithDuration:5 animations:^{ label.alpha = 0; } completion:^(BOOL finished) { [label removeFromSuperview]; }]; } ]; }
需要注意的地方:block模块方面,它的UIView animateWithDuration:5 animations:^{ label.alpha = 1;} 相当于动画的开始,completion:^(BOOL finished)后面相当于动画的结束。
4.转场动画(其实也就是两个view之间的转换)
#import "ViewController.h" @interface ViewController () { UIView *view1; UIView *view2; } @end @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; view1 = [[UIView alloc]initWithFrame:self.view.frame]; view1.backgroundColor = [UIColor yellowColor]; [self.view addSubview:view1]; view2 = [[UIView alloc]initWithFrame:self.view.frame]; view2.backgroundColor = [UIColor greenColor]; [self.view addSubview:view2]; } -(void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event { //1.创建一个动画对象(转场动画对象) CATransition *animation = [CATransition animation]; //2.创建一个代理监听动画的开始与结束 animation.delegate = self; //3.动画执行时间 animation.duration = 2.0; //4.设置动画的快慢效果(四种) /* UIViewAnimationCurveEaseInOut, // slow at beginning and end UIViewAnimationCurveEaseIn, // slow at beginning UIViewAnimationCurveEaseOut, // slow at end UIViewAnimationCurveLinear */ animation.timingFunction = UIViewAnimationCurveEaseInOut;//curve |kɜːv曲线 //5.设置类型 /* //动画类型说明 公有API kCATransitionFade 交叉淡化过渡,新视图逐渐显示在屏幕上,旧视图逐渐淡化出视野 kCATransitionMoveIn 新视图移到旧视图上面,好像盖在上面。 kCATransitionPush 新视图将旧视图推出去。 kCATransitionReveal 将旧视图移开显示出下面的新视图。 */ animation.type = kCATransitionPush; animation.type = @"cameraIrisHollowClose";//苹果私有的,下面更多详解 //6.设置动画的子类型(动画方向) /* *kCATransitionFromRight *kCATransitionFromLeft *kCATransitionFromTop *kCATransitionFromBottom */ animation.subtype = kCATransitionFromTop; //获取到子视图在父视图上的位置 NSInteger indexOfView1 = [self.view.subviews indexOfObject:view1]; NSInteger indexOfView2 = [self.view.subviews indexOfObject:view2]; //在parentView执行动画的时候,调换两个视图的位置,以达到视图切换的效果 [self.view exchangeSubviewAtIndex:indexOfView1 withSubviewAtIndex:indexOfView2]; //7.将转场动画添加到self.view的图层layer [self.view.layer addAnimation:animation forKey:nil]; } -(void)animationDidStart:(CAAnimation *)anim { NSLog(@"动画开始了"); } -(void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag { NSLog(@"动画结束了"); } @end
需要注意的地方:1.转场动画一定要有一个animation对象,2.type代表的是动画类型,subtype代表的是动画方向,它们的开头都是KCA记住就好了。3.获取到子视图在父视图上的位置 NSInteger indexOfView1 = [self.view.subviews indexOfObject:view1];一定要学会,在交换时不用担心view位置的变化
5.无限轮播动画(图片一直可以滑动,左右一直无线循环)
下面的代码大家可以复制到Xcode里面打开(自己添加几张图片,模拟一下效果)
ViewController.m 无线轮播动画 Created by 王冲 on 16/5/12. Copyright © 2016年 王冲. All rights reserved. #import "ViewController.h" @interface ViewController () { UIImageView *_imageView; int _currentIndex; } @end @implementation ViewController #pragma mark 1.**************(添加两个清扫手势,左右) - (void)viewDidLoad { [super viewDidLoad]; _imageView = [[UIImageView alloc]initWithFrame:self.view.frame]; _imageView.image = [UIImage imageNamed:@"0.jpg"]; [self.view addSubview:_imageView]; //要想实现左滑和右侧滑动就需要添加手势 UISwipeGestureRecognizer *leftSwipe = [[UISwipeGestureRecognizer alloc]initWithTarget:self action:@selector(leftSwipe)]; leftSwipe.direction = UISwipeGestureRecognizerDirectionLeft; [self.view addGestureRecognizer:leftSwipe]; UISwipeGestureRecognizer *rightSwipe = [[UISwipeGestureRecognizer alloc]initWithTarget:self action:@selector(rightSwipe)]; rightSwipe.direction = UISwipeGestureRecognizerDirectionRight; [self.view addGestureRecognizer:rightSwipe]; } #pragma mark 2.**************两个手势实现的方法 -(void)leftSwipe { [self setTransition:YES]; } -(void)rightSwipe { [self setTransition:NO]; } #pragma mark 3.************** //真正实现转场动画 -(void)setTransition:(BOOL)isNext { CATransition *animation = [CATransition animation]; animation.duration =0.5; //duration |djʊˈreɪʃn, 持续时间 //设置动画类型type /* *动画类型说明(公有API)4种类型 * kCATransitionFade 交叉淡化过渡,新视图逐渐显示在屏幕上,旧视图逐渐淡化出视野 * kCATransitionMoveIn 新视图移到旧视图上面,好像盖在上面。 * kCATransitionPush 新视图将旧视图推出去。 * kCATransitionReveal 将旧视图移开显示出下面的新视图。 */ animation.type = kCATransitionPush ; /* 私有API,注意对于苹果官方没公开的动画类型只能使用字符串,并没有对应的常量定义 animation.type = @"cube" //立方体效果 animation.type = @"suckEffect" //收缩效果,如一块布被抽走 animation.type = @"oglFlip" //上下翻转效果 animation.type = @"rippleEffect" //滴水效果 animation.type = @"pageCurl" //向上翻一页 animation.type = @"pageUnCurl" //向下翻一页 animation.type = @“cameralIrisHollowOpen” //摄像头打开效果 animation.type = @“cameraIrisHollowClose” //摄像头关闭效果 */ //设置动画的子类型subtype(动画方向)4种类型 /* *kCATransitionFromRight () *kCATransitionFromLeft *kCATransitionFromTop *kCATransitionFromBottom */ if (isNext) { animation.subtype = kCATransitionFromRight; }else { animation.subtype = kCATransitionFromLeft; } //清扫获取下面一张图片 _imageView.image = [self getImage:isNext]; [_imageView.layer addAnimation:animation forKey:nil]; } #pragma mark 4. **************轻划切换图片 -(UIImage *)getImage:(BOOL)isNext { if (isNext) { _currentIndex = (_currentIndex +1)%3; } else { _currentIndex = (_currentIndex +2)%3;/ } NSString *string = [NSString stringWithFormat:@"%d.jpg",_currentIndex]; UIImage *image = [UIImage imageNamed:string]; return image; } @end