CATransition

来源：互联网发布：广州烘焙培训知乎编辑：程序博客网时间：2024/06/15 09:46

前言：CATransition 是CAAnimation的子类，最主要的用途是用来定义view reload的转场动画。使用这个集成好的类，可以几行代码就创建出不错的效果。

效果一

动图
这里写图片描述
核心代码，

    CATransition * transition = [CATransition animation];    transition.type = kCATransitionFade;    transition.duration = 1.0;    [self.imageview.layer addAnimation:transition forKey:@"ToNext"];    self.imageview.image = nextImage;1
2
3
4
5
1
2
3
4
5

完整的代码
要在先在Storyboard上拖拽一个imageview，并拖拽outlet

@interface ViewController ()@property (weak, nonatomic) IBOutlet UIImageView *imageview;@property (assign,nonatomic)NSInteger currentIndex;@end@implementation ViewController-(NSArray *)imagesNamesArray{    return @[@"meidui1.jpg",             @"meidui2.jpg"];}- (void)viewDidLoad {    [super viewDidLoad];    UITapGestureRecognizer * tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(changeToNextImage)];    self.imageview.userInteractionEnabled = true;    [self.imageview addGestureRecognizer:tap];    self.currentIndex = 0;}-(void)changeToNextImage{    self.currentIndex = (self.currentIndex + 1) % 2;    NSString * imageName = [[self imagesNamesArray] objectAtIndex:self.currentIndex];    UIImage * nextImage = [UIImage imageNamed:imageName];    CATransition * transition = [CATransition animation];    transition.type = kCATransitionFade;    transition.duration = 1.0;    [self.imageview.layer addAnimation:transition forKey:@"ToNext"];    self.imageview.image = nextImage;}1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

效果二

动图

这里写图片描述

代码

    CATransition * transition = [CATransition animation];    transition.duration = 1.0;//动画间隔    transition.type = kCATransitionMoveIn;//主要种类，决定动画效果    transition.startProgress = 0.0;//开始    transition.endProgress = 1.0;//结束    transition.subtype = kCATransitionFromRight;//次要种类，决定动画方向    transition.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];//时间函数    [self.imageview.layer addAnimation:transition forKey:@"ToNext"];    self.imageview.image = nextImage;1
2
3
4
5
6
7
8
9
10
1
2
3
4
5
6
7
8
9
10

主要种类有四种

NSString * const kCATransitionFade; //消退NSString * const kCATransitionMoveIn;//移入NSString * const kCATransitionPush;//pushNSString * const kCATransitionReveal;//退出1
2
3
4
1
2
3
4

次要种类也有四种

NSString * const kCATransitionFromRight;NSString * const kCATransitionFromLeft;NSString * const kCATransitionFromTop;NSString * const kCATransitionFromBottom;1
2
3
4
1
2
3
4

0 0