UIImageView class provides a view container for displaying either a single image or for animating a series of images. In this example we are going to display an image inside a frame that is smaller in size. With the help of ContentMode UIViewContentModeScaleAspectFit we can scale the content to fit the size of the view by maintaining the aspect ratio. Please see the reference Guide for other content modes that may help you set the image respective to the view frame. In this tutorial we are going to learn the following
- Display an image on the screen
- How to resize the image to fit the view frame
- Animate a series of images
- Flip an image using animation
Interface file for the view controller - MyImageViewViewController.h
#import <UIKit/UIKit.h>
@interface MyImageViewViewController : UIViewController
@property (nonatomic, strong) UIImageView *myImageView;
@end
Implementation file for the view controller - MyImageViewViewController.m
#import "MyImageViewViewController.h"
@interface MyImageViewViewController ()
@end
@implementation MyImageViewViewController
@synthesize myImageView;
- (void)viewDidLoad
{
[super viewDidLoad];
//create an image
UIImage *myScreenShot = [UIImage imageNamed:@"settings-image.png"];
//image view instance to display the image
self.myImageView = [[UIImageView alloc] initWithImage:myScreenShot];
//set the frame for the image view
CGRect myFrame = CGRectMake(10.0f, 10.0f, self.myImageView.frame.size.width,
self.myImageView.frame.size.height/2);
[self.myImageView setFrame:myFrame];
//If your image is bigger than the frame then you can scale it
[self.myImageView setContentMode:UIViewContentModeScaleAspectFit];
//add the image view to the current view
[self.view addSubview:self.myImageView];
//create a button so that when the user taps it we can animate some images
UIButton *myButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
myButton.frame = CGRectMake(85.0f, 200.0f, 150.0f, 37.0f);
[myButton setTitle:@"Start Animation"
forState:UIControlStateNormal];
[myButton addTarget:self
action:@selector(checkButtonClick:)
forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:myButton];
//create a button to stop the animation
UIButton *myButton2 = [UIButton buttonWithType:UIButtonTypeRoundedRect];
myButton2.frame = CGRectMake(85.0f, 250.0f, 150.0f, 37.0f);
[myButton2 setTitle:@"Stop Animation"
forState:UIControlStateNormal];
[myButton2 addTarget:self
action:@selector(checkButtonClick:)
forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:myButton2];
//create a button to flip an image using animations
UIButton *myButton3 = [UIButton buttonWithType:UIButtonTypeRoundedRect];
myButton3.frame = CGRectMake(85.0f, 300.0f, 150.0f, 37.0f);
[myButton3 setTitle:@"Flip an Image"
forState:UIControlStateNormal];
[myButton3 addTarget:self
action:@selector(checkButtonClick:)
forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:myButton3];
}
- (void) checkButtonClick:(UIButton *)paramSender{
UIButton *myButton = paramSender;
//check which button was tapped
if([myButton.currentTitle isEqualToString:@"Start Animation"]){
NSLog(@"Clicked on the button");
//create an array of images
NSArray *myArray = [NSArray arrayWithObjects:
[UIImage imageNamed:@"settings-image.png"],
[UIImage imageNamed:@"settings-image-2.png"],
[UIImage imageNamed:@"settings-image-3.png"], nil];
[self.myImageView setAnimationImages:myArray];
//all image frames will execute in 3.0 seconds
self.myImageView.animationDuration = 3.0;
//repeat the annimation forever
self.myImageView.animationRepeatCount = 0;
//start animating
[self.myImageView startAnimating];
}
else if ([myButton.currentTitle isEqualToString:@"Stop Animation"]){
//stop animating
[self.myImageView stopAnimating];
}
else if ([myButton.currentTitle isEqualToString:@"Flip an Image"]){
UIImage *myScreenShot2 = [UIImage imageNamed:@"settings-image-2.png"];
//Creates a transition animation for the specified container view.
//The block you specify in the animations parameter contains whatever state changes
//you want to make. You can use this block to add, remove, show, or hide subviews
//of the specified view
[UIView transitionWithView:self.myImageView duration:2.5
options:UIViewAnimationOptionTransitionFlipFromRight
animations:^{
self.myImageView.image = myScreenShot2;
} completion:nil];
}
}
- (void)didReceiveMemoryWarning
{
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
@end
Reference
No comments:
Post a Comment
NO JUNK, Please try to keep this clean and related to the topic at hand.
Comments are for users to ask questions, collaborate or improve on existing.