Home >Web Front-end >HTML Tutorial >Detailed explanation of iOS Core Animation (5) CATransition_html/css_WEB-ITnose
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.
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;
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;}
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;
There are four main types Species
NSString * const kCATransitionFade; //消退NSString * const kCATransitionMoveIn;//移入NSString * const kCATransitionPush;//pushNSString * const kCATransitionReveal;//退出
There are also four secondary species
NSString * const kCATransitionFromRight;NSString * const kCATransitionFromLeft;NSString * const kCATransitionFromTop;NSString * const kCATransitionFromBottom;