Simple animation for iOS development and learning

UIActivityIndicatorViewUIImageView sequential Frame Animation UIView animation clock animation I. UIActivityIndicatorView 1⃣Animated Attribute-isAnimating attribute determines whether animation is in progress 2⃣Dig third-party library SVProgressHUD [SVProgressHUD dismiss] [SVProgressHUD showWithStatus: @ "network loading" maskType: SVProgressHUDMashTypeGradient]; (whether the following parameters are blocked or not.) 3⃣Extends NSTimer [NSTimer scheduledTimerWithTimeInterval: 1 target: 2 selector: 3 userInfo: 4 repeats: 5]; 1. interval 2. self 3. method 4 called upon triggering. user Information 5. whether to repeat [timer invalidate]; copy the code-(void) touchesBegan :( NSSet *) touches withEvent :( UIEvent *) event {// use the maskType attribute of SVProgress, the current view cannot accept the touch event // you need to disable it // use NSTimer if ([_ indicatorView isAnimating]) {[SVProgressHUD dismiss]; [_ indicatorView stopAnimating];} else {[SVProgressHUD ShowWithStatus: @ "~~~ "MaskType: SVProgressHUDMaskTypeGradient]; // when the indicator is started, interaction will fail. Put the clock here [_ indicatorView startAnimating]; [NSTimer scheduledTimerWithTimeInterval: 2.0 target: self selector: @ selector (updateTimer :) userInfo: nil repeats: NO] ;}}// nstmer the parameter used to call the method. It can only be NSTimer. The parameter is used. In the current example, no need to use the member variable-(void) updateTimer :( NSTimer *) timer {[SVProgressHUD dismiss]; [_ indicatorView stopAnimating]; // disable the clock [timer invalidate];} copy code 2. Sequence Frame Animation of UIImageView 1⃣Animation attribute description-animationImages: A group of image disks to be displayed-animationDuration: the time required to display all images (if the speed is changed in the middle, you need to stop, set, and start)-animationRepeatCount: number of animation executions 2⃣Methods for listing -- (void) startAnimating; -- (void) stopAnimating -- (void) isAnimating; 1. zhao Yun animation copies the code // creates Zhao Yun's sequence Frame Animation-(void) createZhaoyunImage {// Do any additional setup after loading the view, typically from a nib. // set the sequence frame animation of the ImageView // 1. an array NSMutableArray * images = [NSMutableArray array]; for (int I = 1; I <11; I ++) {NSString * fileName = [NSString stringWithFormat: @ "/images/zy/movie d.png", I]; UIImage * image = [UIImage imageNamed: fileName]; [images addObject: image];} [_ zhaoyunImage setImage: images [0]; // sets the Image array [_ zhaoyunImage setAnimationImages: images]; // sets the playback duration of 10 images [_ zhaoyunImage setAnimationDuration: 1.0f]; // start the animation [_ zhaoyunImage startAnimating];}-(void) touchesBegan :( NSSet *) touches withEvent :( UIEvent *) event {if ([_ zhaoyunImage isAnimating]) {// when the sequence Frame Animation is stopped, the set image is displayed instead of the currently played image [_ zhaoyunImage stopAnimating];} else {[_ zhaoyunImage startAnimating];} copy Code 2. swallow animation copy Code # pragma mark-drag swallow-(void) dragBird :( UIPanGestureRecognizer *) sender {// first you need to know the finger position CGPoint location = [sender locationInView: self. view]; // when the gesture status is changed to UIGestureRecognizerStateChanged, the finger has not left the screen. // you can modify the position of the bird and let the bird crash if (sender. state = UIGestureRecognizerStateChanged) {// Note: If you want to modify the sequence Frame Animation in the playback, // 1. you need to stop the animation [_ birdImage stopAnimating]; // 2. modify the animation frequency [_ birdImage setAnimationDuration: 0.2f]; // 3. restart the animation [_ birdImage startAnimating]; // modify the animation frequency of the swallow // set the position of the swallow [_ birdImage setCenter: location];} else if (sender. state = UIGestureRecognizerStateEnded) {// restore the swallow. you need to stop the animation [_ birdImage stopAnimating]; // 2. modify the animation frequency [_ birdImage setAnimationDuration: 1.2f]; // 3. restart the animation [_ birdImage startAnimating] ;}// set the swallow sequence Frame Animation and set the swallow drag and drop gesture listener-(void) createBirdImage {// set the swallow sequence Frame Animation NSArray * images = @ [[UIImage imageNamed: @ "/images/material/ Zi 1.png"], [UIImage imageNamed: @ "/images/material/ Zi 2.png"]; [_ birdImage setAnimationImages: images]; [_ birdImage setAnimationDuration: 1.2f]; [_ birdImage startAnimating]; // define gesture UIPanGestureRecognizer * pan = [[UIPanGestureRecognizer alloc] initWithTarget: self action: @ selector (dragBird :)]; [_ birdImage addGestureRecognizer: pan]; // set swallow pictures to allow user interaction [_ birdImage setUserInteractionEnabled: YES];} copy Code 3, UIView animation 4, clock animation (CADisplayLink) -It is a clock mechanism triggered by refreshing the screen on the screen. The clock is executed about 60 times per second-poured into QuartzCore framework 1⃣How to Use the consumer-define CADisplayLink and define the method for triggering the call-Add the display link to the main running cycle queue 2⃣Two interval Determination Methods: member variables-global variables for copying code @ interface ViewController () {// Game clock CADisplayLink * _ gameTimer; // CFTimeInterval _ startTime;} @ end @ implementation ViewController # pragma mark-method for processing the CADisplayLink trigger time using the specified time (1)-(void) updateTimer :( CADisplayLink *) sender {// if _ startTime = 0, it indicates that the clock is triggered for the first time, and the time stamp of the clock needs to be recorded if (_ startTime = 0) {_ startTime = sender. timestamp;} // time difference for clock triggering CFTimeInterval deltaTi Me = sender. timestamp-_ startTime; if (deltaTime> 1.0) {NSLog (@ "% f triggered by the clock", sender. timestamp); // update the value of _ startTime to record the time of this task _ startTime = sender. timestamp ;}# pragma mark-method for processing the CADisplayLink trigger time using the specified time (2)-(void) step {// assume that the method is triggered once every second if (steps % (10*60*60) = 1) {NSLog (@ "The clock is triggered! % Ld ", steps) ;}steps ++ ;}- (void) viewDidLoad {[super viewDidLoad]; // Do any additional setup after loading the view, typically from a nib. // set the start time to 0 _ startTime = 0.0f; // set the total number of screen refreshes to 0 steps = 0; // initialize the Game clock _ gameTimer = [CADisplayLink displayLinkWithTarget: self selector: @ selector (step)]; // After the clock is initialized, you must set the Game clock, add to main running cycle [_ gameTimer addToRunLoop: [nsunloop mainRunLoop] forMode: NSDefaultRunLoopMode];} copy code 3⃣Method 1:-initialize a Game clock and add it to the main queue column-set the time interval and perform the operation 1. A member variable is required to record the start time of the clock: CFTimeInterval _ startTime; 2. calculate the time difference between the member variable and the time when the clock is triggered. If the time difference is greater than the specified time difference, perform the operation method 2:-define the number of global executions per second-if this number is executed, execute the operation to copy the code steps = 0; // initialize the snowflake image _ snowImage = [UIImage imageNamed: @ "/images/material/snowflake"]; // initialize the clock _ gameTimer = [CADisplayLink displayLinkWithTarget: self selector: @ selector (step)]; [_ gameTimer addToRunLoop: [nsunloop mainRunLoop] forMode: NSDefaultRunLoopMode]; copy the code and copy the Code # pragma mark-clock processing method-(void) step {// assume that six snowflakes are drawn per second if (steps % 10 = 0) {// draw a snowflake UIImageView * imageView = [[UIImageView alloc] initWithImage: _ snowImage]; // specify the position where the snowflake appears CGPoint startPoint = CGPointMake (arc4random () % 320, -30.0); // specify the end position of the snowflake CGPoint endPoint = CGPointMake (arc4random () % 320,490);/** new question 1. the snowflake is too big. snow is too bright. You need to change the transparency. 3. it will be better if the snowflake is converted */CGFloat r = arc4random () % 5 + 10; [imageView setFrame: CGRectMake (0, 0, r, r)]; // set the start point [imageView setCenter: startPoint]; // Add the snowflake image to the view [self. view addSubview: imageView]; [UIView animateWithDuration: 6.0f delay: 0.0f options: animated animations: ^ {[imageView setCenter: endPoint]; [imageView setAlpha: 0.2f]; [imageView setTransform: CGAffineTransformMakeRotation (M_PI)];} completion: ^ (BOOL finished) {// Delete from parent view. Do not forget [imageView removeFromSuperview] ;}];}