Gif animation in iPhone

Gif animation in iPhone/iPad app OR How to implement .gif file in iPhone/iPad app.

Here we will see how an UIImage can be used to implement similar effect as in .gif animation like this:

To show an animation or to implement .gif file in your iPhone/iPad app view follow these steps:

Step 1: Create new project in xcode and name it as "gif_Animation".

Step 2: First of all split the .gif file into frames (because gif file is nothing but a series of images, and also iPhone/iPad app does not directly support gif file).

Here for example we split the .gif  file and save frame as:

• frame1.jpg
• frame2.jpg
• frame3.jpg
• frame4.jpg
• frame5.jpg

Step 3: Add all frames into resource folder.

Step 4: Now open "gif_AnimationViewController.h" and add this code:

#import <UIKit/UIKit.h>
@interface gif_AnimationViewController : UIViewController {

 UIImageView   *animatedImages;
 NSMutableArray *imageArray;
}
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event;
@end
Step 5: Now open "gif_AnimationViewController.m" and add this code: 

#import "gif_AnimationViewController.h"

#define IMAGE_COUNT       5
#define IMAGE_HEIGHT      480 
#define IMAGE_WIDTH       320

@implementation gif_AnimationViewController

-(void)viewWillAppear:(BOOL)animated 

{ 

imageArray = [[NSMutableArray alloc] initWithCapacity:IMAGE_COUNT];

// Array to hold jpg images

imageArray = [NSMutableArray arrayWithObjects: [UIImage imageNamed:@"frame1.jpg"], [UIImage imageNamed:@"frame2.jpg"], [UIImage imageNamed:@"frame3.jpg"], [UIImage imageNamed:@"frame4.jpg"], [UIImage imageNamed:@"frame5.jpg"], nil];

// Animated images - centered on screen

animatedImages = [[UIImageView alloc] initWithFrame:CGRectMake(0,0,IMAGE_WIDTH, IMAGE_HEIGHT)];

animatedImages.animationImages = [NSArray arrayWithArray:imageArray];

// One cycle through all the images takes 1.5 seconds

animatedImages.animationDuration =1;

// Repeat forever

animatedImages.animationRepeatCount = -1;

// Add subview and make window visible

[self.view addSubview:animatedImages];

// Start it up

[animatedImages startAnimating];

// Wait 5 seconds, then stop animation

[self performSelector:@selector(stopAnimation) withObject:nil afterDelay:8.0];

}

- (void)stopAnimation

{

[animatedImages stopAnimating];

}

//if we want to stop animation by user touch without any delay then use this

-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event

{

[self performSelector:@selector(stopAnimation) withObject:nil afterDelay:0.0];

}

/*

// The designated initializer. Override to perform setup that is required before the view is loaded.

- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil {

    self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];

    if (self) {

        // Custom initialization

    }

    return self;

}

*/

/*

// Implement loadView to create a view hierarchy programmatically, without using a nib.

- (void)loadView {

}

*/

/*

// Implement viewDidLoad to do additional setup after loading the view, typically from a nib.

- (void)viewDidLoad {

    [super viewDidLoad];

}

*/

/*

// Override to allow orientations other than the default portrait orientation.

- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation {

    // Return YES for supported orientations

    return (interfaceOrientation == UIInterfaceOrientationPortrait);

}

*/

- (void)didReceiveMemoryWarning {

// Releases the view if it doesn't have a superview.

    [super didReceiveMemoryWarning];

// Release any cached data, images, etc that aren't in use.

}

- (void)viewDidUnload {

// Release any retained subviews of the main view.

// e.g. self.myOutlet = nil;

}

- (void)dealloc {

    [super dealloc];

[imageArray release];

[animatedImages release];

}

@end 

Step 6: Now run your project, it will look like this:

Click Here to download the source code. 

 Happy Coding :)

Next….