两张图片的交换,以及放大缩小的动画

 

在IPhone SDK开发范例大全中,有很多的范例码

下面这段范例码,示范了两张图片的交换,以及放大缩小的动画

动画效果请参照下图

 

两张图片的交换,以及放大缩小的动画_第1张图片

 

view plain copy to clipboard print ?
  1. #import <UIKit/UIKit.h>   
  2.   
  3. #define IMAGE_VIEW_1    100  
  4. #define    IMAGE_VIEW_2    101   
  5.   
  6. #define BIGRECT CGRectMake(0.0f, 0.0f, 320.0f, 435.0f)  
  7. #define SMALLRECT CGRectMake(130.0f, 187.0f, 60.0f, 60.0f)   
  8.   
  9. @interface ToggleView: UIView  
  10. {  
  11.     BOOL isOne;  
  12. }  
  13. @end  
  14.   
  15. @implementation ToggleView  
  16.   
  17. - (id) initWithFrame: (CGRect) aFrame;  
  18. {  
  19.     self = [super initWithFrame:aFrame];  
  20.       
  21.     // Load both views, make them non-interactive  
  22.     UIImageView *imgView1 = [[UIImageView alloc] initWithFrame:BIGRECT];  
  23.     imgView1.image = [UIImage imageNamed:@"one.png"];  
  24.     imgView1.userInteractionEnabled = NO;  
  25.     imgView1.tag = IMAGE_VIEW_1;  
  26.   
  27.     UIImageView *imgView2 = [[UIImageView alloc] initWithFrame:SMALLRECT];  
  28.     imgView2.image = [UIImage imageNamed:@"two.png"];  
  29.     imgView2.userInteractionEnabled = NO;  
  30.     imgView2.tag = IMAGE_VIEW_2;  
  31.       
  32.     // image 1 is in front of image 2 to begin  
  33.     [self addSubview:imgView2];      
  34.     [self addSubview:imgView1];   
  35.     isOne = YES;  
  36.       
  37.     [imgView1 release];  
  38.     [imgView2 release];  
  39.   
  40.     return self;  
  41. }  
  42.   
  43. - (void) touchesBegan:(NSSet*)touches withEvent:(UIEvent*)event  
  44. {  
  45.     // Determine which view occupies which role  
  46.     UIImageView *big = (UIImageView *)[self viewWithTag: (isOne ? IMAGE_VIEW_1 : IMAGE_VIEW_2)];  
  47.     UIImageView *little = (UIImageView *)[self viewWithTag: (isOne ? IMAGE_VIEW_2 : IMAGE_VIEW_1)];  
  48.     isOne = !isOne;  
  49.       
  50.     // Pack all the changes into the animation block  
  51.     CGContextRef context = UIGraphicsGetCurrentContext();  
  52.     [UIView beginAnimations:nil context:context];  
  53.     [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];  
  54.     [UIView setAnimationDuration:1.0];  
  55.   
  56.     [big setFrame:SMALLRECT];  
  57.     [big setAlpha:0.5];  
  58.     [little setFrame:BIGRECT];  
  59.     [little setAlpha:1.0];  
  60.       
  61.     [UIView commitAnimations];  
  62.       
  63.     // Hide the shrunken "big" image.  
  64.     [big setAlpha:0.0f];  
  65.     [[big superview] bringSubviewToFront:big];  
  66. }  
  67. @end  
  68.   
  69. @interface HelloController : UIViewController  
  70. @end  
  71.   
  72. @implementation HelloController  
  73. - (void)loadView  
  74. {  
  75.     ToggleView *contentView = [[ToggleView alloc] initWithFrame:[[UIScreen mainScreen] applicationFrame]];  
  76.     contentView.backgroundColor = [UIColor whiteColor];  
  77.     self.view = contentView;  
  78.     [contentView release];  
  79. }  
  80. @end  
  81.   
  82.   
  83. @interface SampleAppDelegate : NSObject <UIApplicationDelegate>   
  84. @end  
  85.   
  86. @implementation SampleAppDelegate  
  87. - (void)applicationDidFinishLaunching:(UIApplication *)application {      
  88.     UIWindow *window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];  
  89.     HelloController *hello = [[HelloController alloc] init];  
  90.     [window addSubview:hello.view];  
  91.     [window makeKeyAndVisible];  
  92. }  
  93. @end  
  94.   
  95. int main(int argc, char *argv[])  
  96. {  
  97.     NSAutoreleasePool * pool = [[NSAutoreleasePool alloc] init];  
  98.     int retVal = UIApplicationMain(argc, argv, nil, @"SampleAppDelegate");  
  99.     [pool release];  
  100.     return retVal;  
  101. }  
#import <UIKit/UIKit.h> #define IMAGE_VIEW_1 100 #define IMAGE_VIEW_2 101 #define BIGRECT CGRectMake(0.0f, 0.0f, 320.0f, 435.0f) #define SMALLRECT CGRectMake(130.0f, 187.0f, 60.0f, 60.0f) @interface ToggleView: UIView { BOOL isOne; } @end @implementation ToggleView - (id) initWithFrame: (CGRect) aFrame; { self = [super initWithFrame:aFrame]; // Load both views, make them non-interactive UIImageView *imgView1 = [[UIImageView alloc] initWithFrame:BIGRECT]; imgView1.image = [UIImage imageNamed:@"one.png"]; imgView1.userInteractionEnabled = NO; imgView1.tag = IMAGE_VIEW_1; UIImageView *imgView2 = [[UIImageView alloc] initWithFrame:SMALLRECT]; imgView2.image = [UIImage imageNamed:@"two.png"]; imgView2.userInteractionEnabled = NO; imgView2.tag = IMAGE_VIEW_2; // image 1 is in front of image 2 to begin [self addSubview:imgView2]; [self addSubview:imgView1]; isOne = YES; [imgView1 release]; [imgView2 release]; return self; } - (void) touchesBegan:(NSSet*)touches withEvent:(UIEvent*)event { // Determine which view occupies which role UIImageView *big = (UIImageView *)[self viewWithTag: (isOne ? IMAGE_VIEW_1 : IMAGE_VIEW_2)]; UIImageView *little = (UIImageView *)[self viewWithTag: (isOne ? IMAGE_VIEW_2 : IMAGE_VIEW_1)]; isOne = !isOne; // Pack all the changes into the animation block CGContextRef context = UIGraphicsGetCurrentContext(); [UIView beginAnimations:nil context:context]; [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut]; [UIView setAnimationDuration:1.0]; [big setFrame:SMALLRECT]; [big setAlpha:0.5]; [little setFrame:BIGRECT]; [little setAlpha:1.0]; [UIView commitAnimations]; // Hide the shrunken "big" image. [big setAlpha:0.0f]; [[big superview] bringSubviewToFront:big]; } @end @interface HelloController : UIViewController @end @implementation HelloController - (void)loadView { ToggleView *contentView = [[ToggleView alloc] initWithFrame:[[UIScreen mainScreen] applicationFrame]]; contentView.backgroundColor = [UIColor whiteColor]; self.view = contentView; [contentView release]; } @end @interface SampleAppDelegate : NSObject <UIApplicationDelegate> @end @implementation SampleAppDelegate - (void)applicationDidFinishLaunching:(UIApplication *)application { UIWindow *window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]]; HelloController *hello = [[HelloController alloc] init]; [window addSubview:hello.view]; [window makeKeyAndVisible]; } @end int main(int argc, char *argv[]) { NSAutoreleasePool * pool = [[NSAutoreleasePool alloc] init]; int retVal = UIApplicationMain(argc, argv, nil, @"SampleAppDelegate"); [pool release]; return retVal; }

 

最重要的动画代码

view plain copy to clipboard print ?
  1. - (void) touchesBegan:(NSSet*)touches withEvent:(UIEvent*)event  
  2. {  
  3.     // 這一段代碼,設定目前哪一張圖是大圖,哪一張是小圖   
  4.     UIImageView *big = (UIImageView *)[self viewWithTag: (isOne ? IMAGE_VIEW_1 : IMAGE_VIEW_2)];  
  5.     UIImageView *little = (UIImageView *)[self viewWithTag: (isOne ? IMAGE_VIEW_2 : IMAGE_VIEW_1)];  
  6.     isOne = !isOne;  
  7.       
  8.     // 這是使用動畫的一些基本設定   
  9.     CGContextRef context = UIGraphicsGetCurrentContext();  
  10.     [UIView beginAnimations:nil context:context];  
  11.     [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut]; // 設定為IN OUT的動畫   
  12.     [UIView setAnimationDuration:1.0]; // 動畫時間為一秒   
  13.   
  14.     [big setFrame:SMALLRECT];  
  15.     [big setAlpha:0.5];  
  16.     [little setFrame:BIGRECT];  
  17.     [little setAlpha:1.0];  
  18.       
  19.     [UIView commitAnimations];  
  20.       
  21.     // Hide the shrunken "big" image.   
  22.     [big setAlpha:0.0f];  
  23.     [[big superview] bringSubviewToFront:big];  
  24. }  
  25. @end  
- (void) touchesBegan:(NSSet*)touches withEvent:(UIEvent*)event { // 這一段代碼,設定目前哪一張圖是大圖,哪一張是小圖 UIImageView *big = (UIImageView *)[self viewWithTag: (isOne ? IMAGE_VIEW_1 : IMAGE_VIEW_2)]; UIImageView *little = (UIImageView *)[self viewWithTag: (isOne ? IMAGE_VIEW_2 : IMAGE_VIEW_1)]; isOne = !isOne; // 這是使用動畫的一些基本設定 CGContextRef context = UIGraphicsGetCurrentContext(); [UIView beginAnimations:nil context:context]; [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut]; // 設定為IN OUT的動畫 [UIView setAnimationDuration:1.0]; // 動畫時間為一秒 [big setFrame:SMALLRECT]; [big setAlpha:0.5]; [little setFrame:BIGRECT]; [little setAlpha:1.0]; [UIView commitAnimations]; // Hide the shrunken "big" image. [big setAlpha:0.0f]; [[big superview] bringSubviewToFront:big]; } @end

 

两张图片的交换,以及放大缩小的动画_第2张图片

代码中设定透明度的目的,为了就是小图放大的时候,才不会被原本在上面的大图盖到,导致看不到图

你可能感兴趣的:(两张图片的交换,以及放大缩小的动画)