IOS Animation details, UIView Animation (UIView attribute Animation, UIViewTransition Animation, UIView Block Animation), CALayer Animation (CABasicAnima ...)

Source: Internet
Author: User

IOS Animation details, UIView Animation (UIView attribute Animation, UIViewTransition Animation, UIView Block Animation), CALayer Animation (CABasicAnima ...)

IOS Animation details, UIView Animation (UIView attribute Animation, UIViewTransition Animation, UIView Block Animation), CALayer Animation (CABasicAnima, CAKeyframeAnimation, CATransition, CAAnimationGroup) // FirstVC. m // LessonAnimation /// Created by lanouhn on 14-9-17. // Copyright (c) 2014 vaercly@163.com Chen conglei. all rights reserved. // # import "FirstVC. h "@ interface FirstVC () @ end @ implementation FirstVC/* Create xib process 1 create xib (with the same name and Class Name) 2 The file owner is the class name 3 and the view line of the class */-(Id) initWithNibName :( NSString *) nibNameOrNil bundle :( NSBundle *) handle {self = [super initWithNibName: nibNameOrNil bundle: nibBundleOrNil]; if (self) {// initim initialization} return self;}-(void) viewDidLoad {[super viewDidLoad]; // Do any additional setup after loading the view from its nib .} -(void) didReceiveMemoryWarning {[super didreceivemorywarning]; // Dispose of any resourc Es that can be recreated .} // UIView property animation-(IBAction) pressPropertyAnimation :( id) sender {// 1 prepare the animation // parameter 1: Role of the animation, used to differentiate multiple animations. Parameter 2: transmit Parameters Using nil: OC using NULL: C language using [UIView beginAnimations: @ "" context: NULL]; // when preparing an animation, you can set the animation attribute [UIView setAnimationDuration: 2]; // set the animation duration [UIView setAnimationDelegate: self]; [UIView setAnimationWillStartSelector: @ selector (startAnimation)]; // [UIView setAnimationDelay: 1]; // animation Extension Late execution time [UIView setAnimationCurve: UIViewAnimationCurveEaseInOut]; // animation curve [UIView setAnimationRepeatCount: 20]; // Number of animation repetitions [UIView setAnimationRepeatAutoreverses: YES]; // re-run the animation. You must set the number of animations. // 2. Modify the view attributes. You can modify multiple attributes at the same time. Note: not all attributes can be modified (only frame, center, bounds, backgroundColor, alpha, transform can be modified) self. changeView. frame = CGRectMake (110,100,100,100); // self. changeView. backgroundColor = [UIColor brownCol Or]; self. changeView. backgroundColor = [UIColor colorWithRed: arc4random () % 256/255 .0 green: arc4random () % 256/255 .0 blue: arc4random () % 256/255 .0 alpha: 0.5]; // 3 submit and execute the animation [UIView commitAnimations];} // UIView excessive animation-(IBAction) pressTranstionAnimation :( id) sender {// 1 prepare the animation [UIView beginAnimations: @ "excessive Animation" context: NULL]; [UIView setAnimationDuration: 5]; [UIView setAnimationRepeatCount: 50]; // 2 set excessive Samples // Parameter 1: over-style, parameter 2: Specifies the View for animation, parameter 3: whether to set cache [UIView setAnimationTransition: UIViewAnimationTransitionFlipFromLeft forView: self. changeView cache: YES]; self. changeView. backgroundColor = [UIColor colorWithRed: arc4random () % 256/255 .0 green: arc4random () % 256/255 .0 blue: arc4random () % 256/255 .0 alpha: 0.5]; // 3 submit and execute the animation [UIView commitAnimations];} // Block animation-(IBAction) pressBlockAnimation :( id) sender {// Only one line of code Block animation encapsulates the UIView animation. // parameter 1: animation duration parameter 2: Block: sets the View attribute to be modified./* [UIView animateWithDuration: 2 animations: ^ {self. changeView. backgroundColor = [UIColor orangeColor];}]; * // second Block/* // parameter 1: animation duration parameter 2: Block: set View attribute parameter 3: Call [UIView animateWithDuration: 2 animations: ^ {self. changeView. backgroundColor = [UIColor orangeColor];} completion: ^ (BOOL finished) {// finished determines whether the animation is completed if (f Inished) {NSLog (@ "finished") ;}}]; * // the third Block/* [UIView animateWithDuration: 2 delay: 1 options: UIViewAnimationOptionCurveEaseInOut animations: ^ {// set the View attribute self to be modified. changeView. backgroundColor = [UIColor orangeColor];} completion: ^ (BOOL finished) {// finished judge whether the animation is completed if (finished) {NSLog (@ "finished") ;}}]; * /// encapsulation of over-animation // parameter 1: changed View parameter 2: animation duration parameter 3: animation type parameter 4 Block: set the View attribute parameter to be modified 5: The operation after completion [UI View transitionWithView: self. changeView duration: 2 options: UIViewAnimationOptionTransitionFlipFromLeft animations: ^ {self. changeView. backgroundColor = [UIColor orangeColor];} completion: ^ (BOOL finished) {// finished determines whether the animation is completed if (finished) {NSLog (@ "finished") ;}}] ;}# pragma mark-AnimationDelegate // call-(void) animationWillStart :( NSString *) when the animation is about to start *) animationID context :( void *) context {NSLog (@ "start: % @, % @ ", AnimationID, context);} // call at animation end-(void) animationDidStop :( NSString *) animationID finished :( NSNumber *) finished context :( void *) context {NSLog (@ "stop: % @, % @", animationID, context) ;}- (void) startAnimation {NSLog (@ "self") ;}- (void) dealloc {[_ changeView release]; [super dealloc] ;}@ end /// SecondVC. m // LessonAnimation /// Created by lanouhn on 14-9-17. // Copyright (c) 2014 vaercly@163.com Chen conglei. all rights reserved. // # import "SecondVC. h "@ interface SecondVC () @ end @ implementation SecondVC-(id) initWithNibName :( NSString *) bundle :( NSBundle *) handle {self = [super initWithNibName: nibNameOrNil bundle: nibBundleOrNil]; if (self) {// Custom initialization} return self;}-(void) viewDidLoad {[super viewDidLoad]; // Do any additional setup after loading the view from its Nib. NSLog (@ "% @", NSStringFromCGRect (self. changeView. frame); NSLog (@ "% f", CGRectGetWidth (self. changeView. frame); // The Relationship Between the UIView and CALayer // The UIView is responsible for interaction, the frame and the CALayer display are responsible for rendering, and it is a readonly attribute of the UIView/* self. changeView. layer. cornerRadius = 100; // set the rounded corner. The parameter is the radius of the incircle. To draw a circle, make sure that the view must be a square. The parameter should be half the length of the view side. changeView. layer. borderWidth = 1; // set the width of the stroke self. changeView. layer. borderColor = [UIColor o RangeColor]. CGColor; // set the stroke color (UIColor is used for UIView and CGColor is used for CALayer) self. changeView. layer. shadowOffset = CGSizeMake (50,100); // you can specify the offset width of the shadow to affect the horizontal offset (positive-right-negative-left) and the vertical offset (positive-low-negative) self. changeView. layer. shadowColor = [UIColor grayColor]. CGColor; // color of the Shadow offset self. changeView. layer. shadowOpacity = 1; // shadow opacity, value range (0 ~ 1) The default value is 0, which is transparent * // CAAnimation abstract class. You must use its specific subclass // CAPropertyAnimation abstract subclass to use it, subclass // CABasicAnimation // CAKeyframeAnimation}-(void) didReceiveMemoryWarning {[super didreceivemorywarning]; // Dispose of any resources that can be recreated .} -(void) dealloc {[_ changeView release]; [super dealloc];} // The basic CABasicAnimation animation does not actually modify the attribute value-(IBAction) pressBasicAnimation :( id) sender {// 1 created and the attributes to be modified // KeyP Ath: attribute name of CAlayer. Not all attributes are allowed. You can modify attributes of an animation only when the animation attribute appears in the header file, for example, bounds. size // CALayer CABasicAnimation * basic = [CABasicAnimation animationWithKeyPath: @ "bounds"]; [basic setDuration: 2]; // 2 modify the attribute value basic. fromValue = [NSValue valueWithCGRect: CGRectMake (0, 0, self. changeView. bounds. size. width, self. changeView. bounds. size. height)]; basic. toValue = [NSValue valueWithCGRect: CGRectMake (0, 0,300, 30 0)]; // basic. byValue = // 3 add an animation // key for distinguishing an animation using [self. changeView. layer addAnimation: basic forKey: @ "changColor"];} // CAKeyframeAnimation Key Frame Animation-(IBAction) pressKeyFrameAnimation :( id) sender {/* // 1 create an animation CAKeyframeAnimation * keyFrame = [CAKeyframeAnimation animationWithKeyPath: @ "bounds"]; [keyFrame setDuration: 2]; // 2 modify the attribute keyFrame. values = @ [[NSValue valueWithCGRect: CGRectMake (0, 0, self. changeView. bounds. Size. width, self. changeView. bounds. size. height)], [NSValue valueWithCGRect: CGRectMake (0, 0,250,250)], [NSValue valueWithCGRect: CGRectMake (0, 0,300,300)]; // keyTimes: the value indicates the animation time. The value range is 0 ~ 1. The value must be incremental. The keyTimes and values correspond to one-to-one keyFrame. keyTimes = @ [@ (0.4), @ (0.6), @ (1)]; // 3 add an animation [self. changeView. layer addAnimation: keyFrame forKey: @ "keyFrame"]; */CAKeyframeAnimation * keyFrame = [CAKeyframeAnimation animationWithKeyPath: @ "backgroundColor"]; [keyFrame setDuration: 10]; keyFrame. values = @ [(id) [UIColor redColor]. CGColor, (id) [UIColor orangeColor]. CGColor, (id) [UIColor yellowColor]. CGColor, (id) [UIColor greenColor]. CGColor, (id) [UIColor blueColor]. CGColor]; // the first value in keyTimes is 0, and keyFrame cannot be modified. keyTimes = @ [@ (0.3), @ (0.5), @ (0.6), @ (0.7), @ (0.9)]; [self. changeView. layer addAnimation: keyFrame forKey: nil];} // CATransaction excessive animation-(IBAction) pressTransition :( id) sender {// 1 create CATransition * transition = [CATransition animation]; [transition setDuration: 2]; // 2 sets the excessive style transition. type = kCATransitionReveal; // control the style transition. subtype = kCATransitionFromTop; // control the direction // Add an animation [self. changeView. layer addAnimation: transition forKey: nil];} // CAAnimationGroup Group Animation-(IBAction) pressAnimationGroup :( id) sender {// 1 created and attributes to be modified // KeyPath: not all attributes of CAlayer can be modified. Only the animatable attribute is displayed in the header file. For example, bounds. size // CALayer CABasicAnimation * basic = [CABasicAnimation animationWithKeyPath: @ "bounds"]; [basic setDuration: 2]; // 2 modify the attribute value basic. fromValue = [NSValue valueWithCGRect: CGRectMake (0, 0, self. changeView. bounds. size. width, self. changeView. bounds. size. height)]; basic. toValue = [NSValue valueWithCGRect: CGRectMake (0, 0,300,300)]; CAKeyframeAnimation * keyFrame = [CAKeyframeAnimation encoding: @ "backgroundColor"]; [keyFrame setDuration: 5]; keyFrame. values = @ [(id) [UIColor redColor]. CGColor, (id) [UIColor orangeColor]. CGColor, (id) [UIColor yellowColor]. CGColor, (id) [UIColor greenColor]. CGColor, (id) [UIColor blueColor]. CGColor]; // the first value in keyTimes is 0, and keyFrame cannot be modified. keyTimes = @ [@ (0.3), @ (0.5), @ (0.6), @ (0.7), @ (0.9)]; // create // when the group Animation duration> the maximum length of all animations in the group, the animation duration is subject to the longest time in the group. // The duration of the group Animation <The maximum length of all animations in the group, the animation duration is subject to the group duration // The most appropriate: The group duration = the maximum length of all animations in the group CAAnimationGroup * group = [CAAnimationGroup animation]; [group setDuration: 10]; // sets the group Animation group. animations = @ [basic, keyFrame]; // Add an animation [self. changeView. layer addAnimation: group forKey: nil];} @ end

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.