Home > Web Front-end > HTML Tutorial > Detailed explanation of iOS Core Animation (5) CATransition_html/css_WEB-ITnose

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

WBOY
Release: 2016-06-24 11:39:13
Original
1195 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

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template