Detailed explanation of iOS Core Animation (5) CATransition_html/css

Detailed explanation of iOS Core Animation (5) CATransition_html/css_WEB-ITnose

WBOY

Release： 2016-06-24 11:39:13

Original

1179 people have browsed it

Welcome to follow my iOS SDK detailed explanation column

Unknowingly, I have written the fifth article in the iOS animation series. Here, you can easily find the articles I wrote before. Four articles on animation.

Foreword: CATransition is a subclass of CAAnimation. Its main purpose is to define the transition animation of view reload. Using this integrated class, you can create great effects with just a few lines of code.

Effect 1

Animation

Core code,

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

Copy after login

Complete code
To first drag an imageview on the Storyboard , and drag 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;}

Copy after login

Effect 2

Animation

Code

    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;

Copy after login

There are four main types Species

NSString * const kCATransitionFade; //消退NSString * const kCATransitionMoveIn;//移入NSString * const kCATransitionPush;//pushNSString * const kCATransitionReveal;//退出

Copy after login

There are also four secondary species

NSString * const kCATransitionFromRight;NSString * const kCATransitionFromLeft;NSString * const kCATransitionFromTop;NSString * const kCATransitionFromBottom;

Copy after login