2012年10月24日 星期三

UIView的Animation(四)

與前一篇不同的是在實作翻頁相關的動畫形態。

向上翻頁的效果:
//Curl Up
UIViewAnimationTransition transition = UIViewAnimationTransitionCurlUp;


向下翻頁的效果:
//Curl Down
UIViewAnimationTransition transition = UIViewAnimationTransitionCurlDown;


由左向右旋轉的效果:
//Flip From Left
UIViewAnimationTransition transition = UIViewAnimationTransitionFlipFromLeft;


由右向左旋轉的效果:
//Flip From Right
UIViewAnimationTransition transition = UIViewAnimationTransitionFlipFromRight;


無動畫效果,直接變化
UIViewAnimationTransition transition = UIViewAnimationTransitionNone;

以下是實作例
1. 開啓一個專案

2. 加入兩個風景圖檔

3. 對storyBoard加上四個Button,並分別對tag設定105~108


4. 在mainViewController.h註冊Button及UIViewImage變數,Button因為四個合在一起用,因此只註冊一個就可以了。
#import <UIKit/UIKit.h>

@interface mainViewController : UIViewController

@property (weak, nonatomic) IBOutlet UIButton *functionButtons;

@property (nonatomic) UIImageView *Image1;
@property (nonatomic) UIImageView *Image2;

@property (nonatomic, assign) NSInteger typeID;

@end

5. 在mainViewController.m加上程式碼,唯一要注意的是,四個Button都與同一個IBAction聯結。

#import "mainViewController.h"

@interface mainViewController ()

@end

@implementation mainViewController

@synthesize Image1, Image2;
@synthesize typeID;

int change = 1;


#define kDuration 2   // 动画持续时间(秒)

- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
   
    Image1= [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 1024,768)];
   
    Image2= [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 1024, 768)];
   
    [Image1 setImage:[UIImage imageNamed:@"mount1.jpg"]];
   
   
    [Image2 setImage:[UIImage imageNamed:@"mount2.jpg"]];
   
    [self.view  addSubview:Image1];
    [self.view  addSubview:Image2];
   
    [self.view sendSubviewToBack:Image1];
    [self.view sendSubviewToBack:Image2];

   
}

- (void)didReceiveMemoryWarning
{
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

- (IBAction)transferAction:(id)sender {
   
    UIButton *button = (UIButton *)sender;
    NSInteger tag = button.tag;
   
    CGContextRef context = UIGraphicsGetCurrentContext();
    [UIView beginAnimations:nil context:context];
    [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
    [UIView setAnimationDuration:kDuration];
   
    switch (tag) {
        case 105:
            [UIView setAnimationTransition:UIViewAnimationTransitionCurlDown forView:self.view cache:YES];
            break;
        case 106:
            [UIView setAnimationTransition:UIViewAnimationTransitionCurlUp forView:self.view cache:YES];
            break;
        case 107:
            [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft forView:self.view cache:YES];
            break;
        case 108:
            [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:self.view cache:YES];
            break;
        default:
            break;
    }
   
    self.typeID += 1;
    if (self.typeID > 3) {
        self.typeID = 0;
    }
   
    NSUInteger image1 = [[self.view subviews] indexOfObject:self.Image1];
    NSUInteger image2 = [[self.view subviews] indexOfObject:self.Image2];
    [self.view exchangeSubviewAtIndex:image1 withSubviewAtIndex:image2];
   
    [UIView setAnimationDelegate:self];
    // 动画完毕后调用某个方法
    //[UIView setAnimationDidStopSelector:@selector(animationFinished:)];
    [UIView commitAnimations];
   
    if (change == 1)
        change = 2;
    else
        change = 1;
}


@end

6. 結果因為是動畫不截圖了,特殊點在iPhone/iPad要設成直立。如果改成橫放,則展示的功能會相反(上下變左右),不知是Bug還是原始設計就是如此,此處要在查詢。

沒有留言: