iOS 動畫Animation詳解, UIView動畫(UIView屬性動畫,UIViewTransition動畫,UIView Block動畫),CALayer動畫(CABasicAnima...)

iOS 動畫Animation詳解, UIView動畫(UIView屬性動畫,UIViewTransition動畫,UIView Block動畫),CALayer動畫(CABasicAnima...)

iOS 動畫Animation詳解, UIView動畫(UIView屬性動畫,UIViewTransition動畫,UIView Block動畫),CALayer動畫(CABasicAnima, CAKeyframeAnimation, CATransition, CAAnimationGroup)////  FirstVC.m//  LessonAnimation////  Created by lanouhn on 14-9-17.//  Copyright (c) 2014年 vaercly@163.com 陳聰雷. All rights reserved.//#import "FirstVC.h"@interface FirstVC ()@end@implementation FirstVC/*    建立xib過程    1 建立xib(名字和類名相同)    2 檔案擁有者為類名    3 和類的view連線 */- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil{    self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];    if (self) {        // Custom initialization    }    return self;}- (void)viewDidLoad{    [super viewDidLoad];    // Do any additional setup after loading the view from its nib.}- (void)didReceiveMemoryWarning{    [super didReceiveMemoryWarning];    // Dispose of any resources that can be recreated.}//UIView屬性動畫- (IBAction)pressPropertyAnimation:(id)sender {    //1 準備動畫    //參數1: 動畫的作用, 用來區分多個動畫, 參數二: 傳遞參數用 nil:OC中使用 NULL:C語言使用    [UIView beginAnimations:@"改變大小" context:NULL];    //在準備動畫的時候可以設定動畫的屬性    [UIView setAnimationDuration:2];//設定動畫的期間    [UIView setAnimationDelegate:self];    [UIView setAnimationWillStartSelector:@selector(startAnimation)];//    [UIView setAnimationDelay:1];//動畫順延強制時間    [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];//動畫的曲線    [UIView setAnimationRepeatCount:20];//動畫的重複次數    [UIView setAnimationRepeatAutoreverses:YES];//動畫往返執行, 必須設定動畫的重複次數    //2 修改view的屬性, 可以同時修改多個屬性 注意:不是所有的屬性都可以修改的(只有frame, center, bounds, backgroundColor, alpha, transform 可以修改)    self.changeView.frame = CGRectMake(110, 100, 100, 100);//    self.changeView.backgroundColor = [UIColor brownColor];    self.changeView.backgroundColor = [UIColor colorWithRed:arc4random() % 256 / 255.0 green:arc4random() % 256 / 255.0 blue:arc4random() % 256 / 255.0 alpha:0.5];    //3 提交並執行動畫    [UIView commitAnimations];}//UIView過度動畫- (IBAction)pressTranstionAnimation:(id)sender {    //1 準備動畫    [UIView beginAnimations:@"過度動畫" context:NULL];    [UIView setAnimationDuration:5];    [UIView setAnimationRepeatCount:50];    //2 設定過度樣式    //參數1: 過度樣式, 參數2: 指定那個View做動畫, 參數3: 是否設定緩衝    [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft forView:self.changeView cache:YES];    self.changeView.backgroundColor = [UIColor colorWithRed:arc4random() % 256 / 255.0 green:arc4random() % 256 / 255.0 blue:arc4random() % 256 / 255.0 alpha:0.5];    //3 提交並執行動畫    [UIView commitAnimations];}//Block動畫- (IBAction)pressBlockAnimation:(id)sender {    //只有一行代碼 Block動畫實質是對UIView動畫的封裝    //參數1:動畫時間長度 參數2:Block: 設定要修改的View屬性    /*    [UIView animateWithDuration:2 animations:^{        self.changeView.backgroundColor = [UIColor orangeColor];    }];     */    //第二種Block    /*    //參數1:動畫時間長度 參數2:Block: 設定要修改的View屬性 參數3: 動畫完成時調用    [UIView animateWithDuration:2 animations:^{        self.changeView.backgroundColor = [UIColor orangeColor];    } completion:^(BOOL finished) {        //finished判斷動畫是否完成        if (finished) {            NSLog(@"finished");        }    }];    */    //第三種Block    /*    [UIView animateWithDuration:2 delay:1 options:UIViewAnimationOptionCurveEaseInOut animations:^{//        設定要修改的View屬性        self.changeView.backgroundColor = [UIColor orangeColor];    } completion:^(BOOL finished) {        //finished判斷動畫是否完成        if (finished) {            NSLog(@"finished");        }    }];     */    //對過度動畫的封裝    //參數1: 改變的View 參數2:動畫時間長度 參數3:動畫類型 參數4 Block: 設定要修改的View屬性 參數5:完成後的操作    [UIView transitionWithView:self.changeView duration:2 options:UIViewAnimationOptionTransitionFlipFromLeft animations:^{        self.changeView.backgroundColor = [UIColor orangeColor];    } completion:^(BOOL finished) {        //finished判斷動畫是否完成        if (finished) {            NSLog(@"finished");        }    }];}#pragma mark - AnimationDelegate//動畫將要開始時調用- (void)animationWillStart:(NSString *)animationID context:(void *)context{    NSLog(@"start: %@, %@", animationID, context);}//動畫結束時調用- (void)animationDidStop:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context{    NSLog(@"stop: %@, %@", animationID, context);}- (void)startAnimation{    NSLog(@"self");}- (void)dealloc {    [_changeView release];    [super dealloc];}@end////  SecondVC.m//  LessonAnimation////  Created by lanouhn on 14-9-17.//  Copyright (c) 2014年 vaercly@163.com 陳聰雷. All rights reserved.//#import "SecondVC.h"@interface SecondVC ()@end@implementation SecondVC- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil{    self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];    if (self) {        // Custom initialization    }    return self;}- (void)viewDidLoad{    [super viewDidLoad];    // Do any additional setup after loading the view from its nib.    NSLog(@"%@", NSStringFromCGRect(self.changeView.frame));    NSLog(@"%f", CGRectGetWidth(self.changeView.frame));    //UIView和CALayer的關係    //UIView負責互動, frame以及顯示CALayer    //CALayer負責渲染, 並且它是UIView的一個readonly屬性    /*    self.changeView.layer.cornerRadius = 100;//設定圓角, 參數是內切圓的半徑, 若想畫一個圓, 前提是view必須是正方形, 參數應該是view邊長的一半    self.changeView.layer.borderWidth = 1;//設定描邊的寬度    self.changeView.layer.borderColor = [UIColor orangeColor].CGColor;//設定描邊的顏色(UIView上的顏色使用的是UIColor, CALayer上使用的顏色是CGColor)    self.changeView.layer.shadowOffset = CGSizeMake(50, 100);//設定陰影的位移量 width影響水平位移(正右負左), height影響垂直位移(正下負上)    self.changeView.layer.shadowColor = [UIColor grayColor].CGColor;//陰影的位移的顏色    self.changeView.layer.shadowOpacity = 1;//陰影的不透明度, 取值範圍(0 ~ 1), 預設是0, 就是透明的     *///    CAAnimation抽象類別, 使用必須要使用其具體的子類//    CAPropertyAnimation抽象子類, 需要子類化//    CABasicAnimation//    CAKeyframeAnimation}- (void)didReceiveMemoryWarning{    [super didReceiveMemoryWarning];    // Dispose of any resources that can be recreated.}- (void)dealloc {    [_changeView release];    [super dealloc];}//CABasicAnimation基本動畫 沒有真正的修改屬性值- (IBAction)pressBasicAnimation:(id)sender {    //1 建立並指定要修改的屬性//    KeyPath:CAlayer的屬性名稱, 不是所有的屬性都可以, 只有在標頭檔中出現animatable的屬性才可以, 可以修改屬性的屬性, 例如:bounds.size//    CALayer    CABasicAnimation *basic = [CABasicAnimation animationWithKeyPath:@"bounds"];    [basic setDuration:2];    //2 修改屬性值    basic.fromValue = [NSValue valueWithCGRect:CGRectMake(0, 0, self.changeView.bounds.size.width, self.changeView.bounds.size.height)];    basic.toValue = [NSValue valueWithCGRect:CGRectMake(0, 0, 300, 300)];//    basic.byValue =     //3 添加動畫    //key做區分動畫用    [self.changeView.layer addAnimation:basic forKey:@"changColor"];}//CAKeyframeAnimation主要畫面格動畫- (IBAction)pressKeyFrameAnimation:(id)sender {    /*    //1 建立動畫    CAKeyframeAnimation *keyFrame = [CAKeyframeAnimation animationWithKeyPath:@"bounds"];    [keyFrame setDuration:2];    //2 修改屬性    keyFrame.values = @[[NSValue valueWithCGRect:CGRectMake(0, 0, self.changeView.bounds.size.width, self.changeView.bounds.size.height)], [NSValue valueWithCGRect:CGRectMake(0, 0, 250, 250)], [NSValue valueWithCGRect:CGRectMake(0, 0, 300, 300)]];//    keyTimes:值代表了出現動畫的時刻, 值得範圍是0~1, 值必須是遞增的, keyTimes和values是一一對應的    keyFrame.keyTimes = @[@(0.4), @(0.6), @(1)];    //3 添加動畫    [self.changeView.layer addAnimation:keyFrame forKey:@"keyFrame"];    */    CAKeyframeAnimation *keyFrame = [CAKeyframeAnimation animationWithKeyPath:@"backgroundColor"];    [keyFrame setDuration:10];    keyFrame.values = @[(id)[UIColor redColor].CGColor, (id)[UIColor orangeColor].CGColor, (id)[UIColor yellowColor].CGColor, (id)[UIColor greenColor].CGColor, (id)[UIColor blueColor].CGColor];    //keyTimes中的第一個值是0, 不能修改    keyFrame.keyTimes = @[@(0.3), @(0.5), @(0.6), @(0.7), @(0.9)];    [self.changeView.layer addAnimation:keyFrame forKey:nil];}//    CATransaction 過度動畫- (IBAction)pressTransition:(id)sender {    //1 建立    CATransition *transition = [CATransition animation];    [transition setDuration:2];    //2 設定過度樣式    transition.type = kCATransitionReveal;//控制樣式    transition.subtype = kCATransitionFromTop;//控制方向    //添加動畫    [self.changeView.layer addAnimation:transition forKey:nil];}//    CAAnimationGroup 組動畫- (IBAction)pressAnimationGroup:(id)sender {        //1 建立並指定要修改的屬性    //    KeyPath:CAlayer的屬性名稱, 不是所有的屬性都可以, 只有在標頭檔中出現animatable的屬性才可以, 可以修改屬性的屬性, 例如:bounds.size    //    CALayer    CABasicAnimation *basic = [CABasicAnimation animationWithKeyPath:@"bounds"];    [basic setDuration:2];    //2 修改屬性值    basic.fromValue = [NSValue valueWithCGRect:CGRectMake(0, 0, self.changeView.bounds.size.width, self.changeView.bounds.size.height)];    basic.toValue = [NSValue valueWithCGRect:CGRectMake(0, 0, 300, 300)];        CAKeyframeAnimation *keyFrame = [CAKeyframeAnimation animationWithKeyPath:@"backgroundColor"];    [keyFrame setDuration:5];    keyFrame.values = @[(id)[UIColor redColor].CGColor, (id)[UIColor orangeColor].CGColor, (id)[UIColor yellowColor].CGColor, (id)[UIColor greenColor].CGColor, (id)[UIColor blueColor].CGColor];    //keyTimes中的第一個值是0, 不能修改    keyFrame.keyTimes = @[@(0.3), @(0.5), @(0.6), @(0.7), @(0.9)];                // 建立    //當group動畫的時間長度 > 組中所有動畫的最長時間長度, 動畫的時間長度以組中最長的時間長度為準    //當group動畫的時間長度 < 組中所有動畫的最長時間長度, 動畫的時間長度以group的時間長度為準    //最合適: group的時間長度 = 組中所有動畫的最長時間長度    CAAnimationGroup *group = [CAAnimationGroup animation];    [group setDuration:10];    //設定組動畫    group.animations = @[basic, keyFrame];    //添加動畫    [self.changeView.layer addAnimation:group forKey:nil];}@end