IOS UIView Animation (objective-c)

In my previous blog, "IOS UIView animation (Swift)" explains how to use Swift to implement the various animations that are available under the UIView class, such as position animations, rotational animations, scaled animations, color animations, transparency animations, and so on. For the completeness of this topic, today I use objective-c to completely rewrite all of the above animations. Project case has been uploaded to: https://github.com/chenyufeng1991/iOS-UIView-Animation in the Animation-oc folder, another directory is the swift implementation of the animation.

(1) Position animation

Positionanimation can realize the movement of the view, the simplest is the x axis, the y axis of movement. Here are some small squares to move.

#import "PositionViewController.h" @interface Positionviewcontroller () @property (weak, nonatomic) Iboutlet UIView * Redsquare; @property (weak, nonatomic) Iboutlet UIView *greensquare; @end @implementation positionviewcontroller-(void) viewdidload {  [Super viewdidload];} -(void) Viewwillappear: (BOOL) animated{  [Super viewwillappear:animated];  [UIView animatewithduration:2 animations:^{    self.redSquare.frame = CGRectMake (self.redsquare.frame.origin.x, Self.redSquare.bounds.size.width, self.redSquare.bounds.size.height);    Self.greenSquare.frame = CGRectMake ($, a, self.greenSquare.bounds.size.width, self.greenSquare.bounds.size.height);}  ];} @end

(2) Transparency animation

Transparency animations can make a view's transparency change between 0-1. A transparency of 0 means full transparency and is invisible. A transparency of 1 is indicated in the normal case.

#import "OpacityViewController.h" @interface Opacityviewcontroller () @property (weak, nonatomic) Iboutlet UIView * Redsquare; @end @implementation opacityviewcontroller-(void) viewdidload {  [Super viewdidload];} -(void) Viewwillappear: (BOOL) animated{  [Super viewwillappear:animated];  [UIView animatewithduration:2 animations:^{    self.redSquare.alpha = 0.3;  }];} @end

(3) Zoom animation

Scaling animations can change the size of a view and zoom out proportionally.

#import "ScaleViewController.h" @interface Scaleviewcontroller () @property (weak, nonatomic) Iboutlet UIView *redsquare ; @end @implementation scaleviewcontroller-(void) viewdidload {  [Super viewdidload];} -(void) Viewwillappear: (BOOL) animated{  [Super viewwillappear:animated];  [UIView animatewithduration:2 animations:^{    //width-height zoom ratio;    Self.redSquare.transform = Cgaffinetransformmakescale (2, 3);  }];} @end

(4) Color animation

Color animation allows a view to have a color gradient within a single time interval, making a color transition.

#import "ColorViewController.h" @interface Colorviewcontroller () @property (weak, nonatomic) Iboutlet UIView * Greensquare; @end @implementation colorviewcontroller-(void) viewdidload {  [Super viewdidload];} -(void) Viewwillappear: (BOOL) animated{  [Super viewwillappear:animated];  [UIView animatewithduration:2 animations:^{    //wide-height zoom ratio;    Self.greenSquare.backgroundColor = [Uicolor browncolor ];  }];} @end

(5) Rotate animation

Lets you rotate a view around a dot.

#import "RotationViewController.h" @interface Rotationviewcontroller () @property (weak, nonatomic) Iboutlet UIView * greensquare;//rotated once; @property (weak, nonatomic) Iboutlet UIView *redsquare;//rotated countless times; @end @implementation rotationviewcontroller-(void) viewdidload {  [Super viewdidload];} -(void) Viewwillappear: (BOOL) animated{  [Super viewwillappear:animated];  [Self spingreensquare];  [Self spinredsquare];} -(void) spingreensquare{  [UIView animatewithduration:2 animations:^{    self.greenSquare.transform = Cgaffinetransformrotate (Self.greenSquare.transform, M_PI);//a pi,180 degree;  } completion:^ (BOOL finished) {  }];} -(void) spinredsquare{  [UIView animatewithduration:1 delay:0 Options:uiviewanimationoptioncurvelinear animations:^{    self.redSquare.transform = cgaffinetransformrotate (Self.redSquare.transform, 360);//a pi,180 degree;  } completion:^ (BOOL finished) {    [self spinredsquare];}  ];} @end

(6) Repeat animation

The animation allows an animation process to execute repeatedly.

#import "RepeatViewController.h" @interface Repeatviewcontroller () @property (weak, nonatomic) Iboutlet UIView * Greensquare; @property (weak, nonatomic) Iboutlet UIView *redsquare; @end @implementation repeatviewcontroller-(void) viewdidload {  [Super viewdidload];} -(void) Viewwillappear: (BOOL) animated{  [Super viewwillappear:animated];  [UIView animatewithduration:2 delay:0 options:uiviewanimationoptionrepeat animations:^{    self.greenSquare.frame = CGRectMake (SELF.GREENSQUARE.FRAME.ORIGIN.Y, Self.greenSquare.frame.size.width, self.greenSquare.frame.size.height);  } completion:^ (BOOL finished) {  }];  [UIView Animatewithduration:2 delay:0 options:uiviewanimationoptionrepeat| Uiviewanimationoptionautoreverse animations:^{    self.redSquare.frame = CGRectMake (250, SELF.REDSQUARE.FRAME.ORIGIN.Y, Self.redSquare.frame.size.width, self.redSquare.frame.size.height);  } completion:^ (BOOL finished) {  }];} @end

(7) Buffer animation

The effect of Bezier curves is used primarily to change the rate effect of the view animation. Everyone can practice.

#import "EasingViewController.h" @interface Easingviewcontroller () @property (weak, nonatomic) Iboutlet UIView * Greensquare; @property (weak, nonatomic) Iboutlet UIView *redsquare; @end @implementation easingviewcontroller-(void) viewdidload {  [Super viewdidload];} -(void) Viewwillappear: (BOOL) animated{  [Super viewwillappear:animated];  The main is to set options this parameter;  [UIView animatewithduration:2 delay:0 Options:uiviewanimationoptioncurveeasein animations: ^{    self.greenSquare.frame = CGRectMake (+ SELF.GREENSQUARE.FRAME.ORIGIN.Y, self.greenSquare.frame.size.width , self.greenSquare.frame.size.height);  } Completion:nil];  [UIView animatewithduration:2 delay:0 options:uiviewanimationoptioncurveeaseout animations:^{    Self.redSquare.frame = CGRectMake (+, SELF.REDSQUARE.FRAME.ORIGIN.Y, Self.redSquare.frame.size.width, self.redSquare.frame.size.height);  } Completion:nil];} @end

(8) Spring animation

The animation performs a similar spring-like effect, and you can set the spring's damping and initial speed to achieve very realistic spring jitter.

#import "SpringViewController.h" @interface Springviewcontroller () @property (weak, nonatomic) Iboutlet UIView * Greensquare; @property (weak, nonatomic) Iboutlet UIView *redsquare; @end @implementation springviewcontroller-(void) viewdidload {[Super viewdidload];}  -(void) Viewwillappear: (BOOL) animated{[Super viewwillappear:animated]; The different states can be changed by setting parameters [UIView animatewithduration:2 delay:0.5 usingspringwithdamping:0.2 initialspringvelocity:0 Options:uiviewanimationoptiontransitionnone animations:^{self.greenSquare.frame = CGRectMake (250,  SELF.GREENSQUARE.FRAME.ORIGIN.Y, Self.greenSquare.frame.size.width, self.greenSquare.frame.size.height);  } Completion:nil]; [UIView animatewithduration:2 delay:0.5 usingspringwithdamping:0.2 initialspringvelocity:1 options: Uiviewanimationoptiontransitionnone animations:^{self.redSquare.frame = CGRectMake (250,  SELF.REDSQUARE.FRAME.ORIGIN.Y, Self.redSquare.frame.size.width, self.redSquare.frame.size.height); } Completion:nil];} @end

(9) Picture rotation

In our actual needs, we may need to let the picture before moving to the left 90 degrees, turn right 90 degrees, rotate 180 degrees, and then on the basis of another animation. The implementation is as follows:

#import "ImageRotationViewController.h" #define Kscreenwidth [[UIScreen Mainscreen] Bounds].size.width#define kscreenheight [[UIScreen mainscreen] bounds].size.height/** * Rotate uiimage In this example, note that it is not for uiimageview rotation, which can meet more customized requirements; */ @interface Imagerotationviewcontroller () @end @implementation imagerotationviewcontroller-(void) Viewdidload {[Super  Viewdidload]; /** uiimageorientationup,//default orientation Uiimageorientationdown,//+ deg rotation UII Mageorientationleft,//deg CCW uiimageorientationright,//deg CW uiimageorientationupmirrored ,//As above but the image mirrored along other axis.   Horizontal Flip uiimageorientationdownmirrored,//Horizontal Flip uiimageorientationleftmirrored,//Vertical Flip uiimageorientationrightmirrored,//Vertical Flip */Uiimageview *imageview = [[Uiimageview alloc] Initwithframe:cgre  Ctmake (0, KSCREENHEIGHT/2, kscreenwidth)];  UIImage *image = [UIImage imagenamed:@ "1"]; /**  * The following method allows a picture to be rotated at the beginning rather than in a positive state; Note the action on UIImage, not the operation of the Uiimageview control, and finally the image into the control. */UIImage *imagerotate = [UIImage imagewithcgimage:image.  Cgimage scale:1 Orientation:uiimageorientationleft];  [ImageView Setimage:imagerotate];  [Self.view Addsubview:imageview]; [UIView animatewithduration:2 animations:^{imageview.transform = cgaffinetransformrotate (ImageView.transform, M_PI_    2);  Imageview.frame = CGRectMake (0, +, kscreenwidth, 80); }];} @end

The animations implemented here are very simple, and you can try it yourself by downloading the code. Later on I will give you more advanced cool animation. Please look forward to it.

IOS UIView Animation (objective-c)