IOS Development notes-Basic UI (7) TOM (sequence Frame Animation, image loading, method reconstruction, Bundle image material of UIImageView ),

Source: Internet
Author: User
Tags uicontrol

IOS Development notes-Basic UI (7) TOM (sequence Frame Animation, image loading, method reconstruction, Bundle image material of UIImageView ),

Using UIImageView and UIButton to implement a comprehensive small case --- Tom

Recall: UIImageView is from UIView, UIView is from UIResponder, UIButton is from UIControl, UIControl is from UIView

Looking at the implementation alone, the code implementation is actually relatively simple, but the idea is rare, and the artist has a high requirement! It's a great game!

Function Analysis

(1) Click the corresponding button to show Tom the corresponding Animation

Step Analysis

(1) Build the UI and prepare materials. (2) Click the listening button. (3) execute the corresponding Animation Based on the clicked button.
Note: Only the 3.5-inch screen is supported.

Materials in Images. xcassets

1> images is strongly recommended by Apple. Xcassets only support png format) png format images, because png Format Image fidelity, do not use jpg images, jpg is not fidelity, the compression ratio is too high, there is noise.

2> images can only be instantiated using the [UIImage imageNamed] method, but cannot be loaded from the Bundle.

3> during compilation, all files in Images. xcassets will be packaged as Assets. car files.

 

If you must use jpg images, put them in the supporting files folder.

 

Sequence Frame Animation of UIImageView

Class relationship

NS_CLASS_AVAILABLE_IOS (2_0) @ interface UIImageView: UIView

Find an attribute; Animated Image (plural, array)

@property(nonatomic,copy) NSArray *animationImages;            // The array must contain UIImages. Setting hides the single image. default is nil

There is also a time interval

@property(nonatomic) NSTimeInterval animationDuration;         // for one cycle of images. default is number of images * 1/30th of a second (i.e. 30 fps)

Double type, which is a group of images. The playback period is one cycle. The default value is 30 images per second.

typedef double NSTimeInterval;

There is also a duplicate attribute. 0 indicates wireless repetition. The default value is 0.

@property(nonatomic) NSInteger      animationRepeatCount;      // 0 means infinite (default is 0)

There are three object Methods

- (void)startAnimating;- (void)stopAnimating;- (BOOL)isAnimating;

Note: you cannot execute animations in parallel. For example, you cannot start the animation at the same time when using water! The method to be determined. The isAnimating method is mentioned above.

The Code is as follows:

# Import "ViewController. h "@ interface ViewController () @ property (weak, nonatomic) IBOutlet UIImageView * tom; @ end @ implementation ViewController-(void) tomAnimationOfName :( NSString *) img andCount :( int) count {// sequential Frame Animation: allows a group of images to be played one by one, just like a movie. The dynamic effect // determines whether the animation is in progress. if ([self. tom isAnimating]) {// directly ends the animation operation method. Here there is no returned value, and nil cannot return;} // It must start to store images, 81, use a variable array NSMutableArray * arrayImage = [NSMutableArray array]; // traverse the image for (int I = 0; I <count; I ++) {// similar to c, format control, less than two zeros fill in NSString * name = [NSString stringWithFormat: @ "%@_%02d.jpg", img, I]; UIImage * image = [UIImage imageNamed: name]; // Add it to the array [arrayImage addObject: image];} // then start the animation. // place the image to the animationImages and accept the array parameter self. tom. animationImages = arrayImage; // set the interval between 81 images. If there are multiple images, the playback time is slightly longer. Otherwise, the image is short. self. tom. animationDuration = arrayImage. count * 0.074; // set the number of repetitions self. tom. animationRepeatCount = 1; // start the animation [self. tom startAnimating]; // end animation}-(IBAction) head {[self tomAnimationOfName: @ "knockout" andCount: 81];}-(IBAction) drink {[self tomAnimationOfName: @ "drink" andCount: 81];}

However, it is found that memory is consumed in Africa when the program is running!

 

Consider the problem of UIImage imageNamed (details: the difference between imageWithContentsOfFile: path and imageNamed of UIImage)

After the image is used, it will not be released directly. The specific release time is determined by the system, which is not good or unreasonable. We need to change it manually. For example, if the same image is used repeatedly in a program, it needs to be loaded from the disk every time, which will reduce the performance. (Programmers are pursuing a balance, with good performance and good execution time. Cannot be extreme .) These cannot be tested by the simulator, because the computer memory is used and will not be used up easily. In general, imageNmaed is suitable for small and common image processing. . You can also use [UIImage imageWithContentsOfFile: path] to instantiate an image (full path ).

Because the former has a cache (the memory occupied by the image will remain in the Program)

+ (UIImage *) imageNamed :( NSString *) name; the latter has no cache (the memory occupied by the image will be cleared after some specific operations) + (UIImage *) imageWithContentsOfFile :( NSString *) path-(id) initWithContentsOfFile :( NSString *) path; path is the full path of the image.
NSString * name = [NSString stringWithFormat: @ "%@_%02d.jpg", img, I]; // UIImage * image = [UIImage imageNamed: name]; // Add to the array NSString * file = [[NSBundle mainBundle] pathForResource: name ofType: nil]; UIImage * image = [UIImage imageWithContentsOfFile: file]; [arrayImage addObject: image];

In this way, there is still no major change, so we should manually clear the content of the animation array when calling the animation! Note that we need to wait for a moment, or the animation will be cleared at the beginning! Note!

// End the animation. Wait until [self. tom cancel mselector: @ selector (setAnimationImages :) withObject: nil afterDelay: self. tom. animationDuration] is cleared.

 

Method refactoring policy in code

1> copy common code to a New Method

2> Add method parameters based on different calls

Tip: Do not worry about refactoring when writing a program. Sometimes you can write the code first, so it is easier to see how to refactor it! When a piece of code is repeated in multiple places of the program, it will cause the program to stink and grow. When the structure of the code is to be modified, every place where the code appears must be modified, resulting in poor program scalability. Therefore, we need to extract repeated code into a method, call the method where the code is needed.

Idea of code extraction: Put the same code into a method and pass different values as method parameters

Image material in Bundle

When you drag a clip to a project

1> Destination: select

2> Folders:

Select the first item: yellow folder

Folder in Xcode, where all the materials in Bundle are located in the same folder, the development efficiency is very high. Therefore, duplicate file names are not allowed, but the artist is uncomfortable.

Features:

You can directly use [NSBundle mainBundle] As the resource path, which is highly efficient!

You can use [UIImage imageNamed:] to load images.

 

Select Item 2: blue folder

Folder in Xcode and folder in Bundle. Therefore, the file name can be duplicated.

Features:

The actual path needs to be spliced on the basis of [NSBundle mainBundle], which is less efficient!

You cannot use [UIImage imageNamed:] to load images.

 

File Management

[NSFileManager defaultManager]

Common Methods

1> determine whether a file exists

-(BOOL) fileExistsAtPath :( NSString *) path;

2> copy the file from the Source Path to the target path

-(BOOL) copyItemAtPath :( NSString *) srcPath toPath :( NSString *) dstPath error :( NSError **) error;

3> delete an object

-(BOOL) removeItemAtPath :( N

 

Sequence Frame Animation development steps:

// 1. set the Image array [self. tom setAnimationImages: xxx]; // 2. set the animation duration. By default, 30 images are played per second [self. tom setAnimationDuration: xxx]; // 3. set the number of animation repetitions. The default value is 0, and the infinite loop [self. tom setAnimationRepeatCount: xxx]; // 4. start animation [self. tom startAnimating]; // 5. after the animation is played, clear the animation array [self. tom specified mselector: @ selector (setAnimationImages :) withObject: nil afterDelay: self. tom. animationDuration];

 

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.