核心動畫二

6> CoreAnimation

  • Core Animation是直接作用在CALayer上的,并非UIView。
    Core Animation,中文翻譯為核心動畫,它是一組非常強大的動畫處理API,使用它能做出非常炫麗的動畫效果,而且往往是事半功倍。也就是說,使用少量的代碼就可以實現非常強大的功能。
    Core Animation可以用在Mac OS X和iOS平臺。
    Core Animation的動畫執行過程都是在后臺操作的,不會阻塞主線程。
    要注意的是,Core Animation是直接作用在CALayer上的,并非UIView。
  • Core Animation結構
  • Core Animation 使用步驟
    如果不是xcode5之后的版本,使用它需要先添加QuartzCore.framework和引入對應的框架<QuartzCore/QuartzCore.h>
    開發步驟:
    1.首先得有CALayer
    2.初始化一個CAAnimation對象,并設置一些動畫相關屬性
    3.通過調用CALayer的addAnimation:forKey:方法,增加CAAnimation對象到CALayer中,這樣就能開始執行動畫了
    4.通過調用CALayer的removeAnimationForKey:方法可以停止CALayer中的動畫
  • 創建CALayer
  • touchBegin,點擊屏幕,做動畫
  • 創建動畫,添加動畫到CALayer
  • 怎樣執行動畫?執行動畫的本質是改變圖層的屬性。
  • 告訴動畫執行怎樣的動畫?設置動畫屬性(position)
  • 告訴動畫屬性怎么改變?設置動畫屬性值改變 toValue fromValue
  • duration:動畫時長
  • 動畫有反彈?取消反彈
    1> 執行動畫完畢不要移除
    2> 設置動畫填充模式,保持最新的位置。
  • rotation:
    三維旋轉:transform
    二維旋轉:transform.rotation
  • scale
  • 設置圖層內容(心)
  • tovalue:@0.5
    //創建動畫對象
    CABasicAnimation *anim = [CABasicAnimation animation];
    //設置屬性值.
    anim.keyPath = @"transform.rotation";
    anim.toValue = @(M_PI);
    //動畫完成時會自動的刪除動畫.
    //動畫完成時要不要刪除動畫
    anim.removedOnCompletion = NO;
    //讓動畫始終保存最前面的效果.
    anim.fillMode = @"forwards" 
    //添加動畫
    [self.redView.layer addAnimation:anim forKey:nil];
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{
  //添加動畫
    CABasicAnimation *anim = [CABasicAnimation animation];
    //設置屬性值.
    anim.keyPath = @"transform.scale";
    anim.toValue = @0;
  //想要動畫執行多次
    anim.repeatCount = MAXFLOAT;
 //設置動畫的執行時長
    anim.duration = 0.5;
  //反轉,怎么去的,怎么樣回來.
    anim.autoreverses = YES;
//添加動畫
    [self.imageV.layer addAnimation:anim forKey:nil];    
}
    //創建動畫對象
    CABasicAnimation *anim = [CABasicAnimation animation];
    //設置屬性值.
    anim.keyPath = @"transform.rotation";
    anim.toValue = @(M_PI);
    //動畫完成時會自動的刪除動畫.
    //動畫完成時要不要刪除動畫
    anim.removedOnCompletion = NO;
  //讓動畫始終保存最前面的效果.
    anim.fillMode = @"forwards";
   //添加動畫
    [self.redView.layer addAnimation:anim forKey:nil];
* 總結CABasicAnimation只能在兩個值之間做動畫,怎么多個值做動畫,用CAKeyframeAnimation

7> CAKeyframeAnimation

  • 面向view開發,拖一個view
  • values:能多個值之間做動畫,按照順序做。
  //添加抖動的動畫.
    CAKeyframeAnimation *anim = [CAKeyframeAnimation animation];
    //設置屬性值.
    anim.keyPath = @"transform.rotation";
    anim.values = @[@(angle2Rad(-5)),@(angle2Rad(5))];
   anim.autoreverses = YES;
   //動畫一直重復執行.
    anim.repeatCount = MAXFLOAT;
 anim.duration = 0.5;
 //添加動畫
    [self.iconView.layer addAnimation:anim forKey:nil];
  • path
   //添加抖動的動畫.
    CAKeyframeAnimation *anim = [CAKeyframeAnimation animation];
    //設置屬性值.
    anim.keyPath = @"position";
    
  //根據路徑做動畫
//    UIBezierPath *path = [UIBezierPath bezierPath];
//    [path moveToPoint:CGPointMake(50, 50)];
//    [path addLineToPoint:CGPointMake(200, 400)];
    UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(50, 50, 300, 300)];
    anim.path = path.CGPath;    
//    anim.autoreverses = YES;
    //動畫一直重復執行.
    anim.repeatCount = MAXFLOAT;
  anim.duration = 0.5;
  //添加動畫
    [self.iconView.layer addAnimation:anim forKey:nil];
  • 動畫節奏(timingFunction)

8> * 圖標抖動

  • PPT分析,左邊旋轉右邊旋轉 -> keyPath(transform.rotation) -> values -> 有點瘸 -> PPT分析 -> values添加一個值

9> * CATransition
過度動畫又叫轉場動畫 -> type(轉場類型) -> subtype(方向) -> 動畫進度
注意:轉場動畫必須和過度代碼放在一塊,否則沒有效果

static int _i = 1;
   //轉場代碼必須得要和轉場動畫在同一個方法當中.,并沒有要求他們的上下順序.
    //轉場代碼.
    _i++;
    if (_i > 3) {
        _i = 1;
    }
    NSString *imageName = [NSString stringWithFormat:@"%d",_i];
    self.imageV.image = [UIImage imageNamed:imageName];  
    //添加轉場動畫
    CATransition *anim = [CATransition animation]; 
    anim.duration = 1;
    //動畫從哪個點開始.
    anim.startProgress = 0.3;
    //動畫從哪個點結束.
    anim.endProgress = 0.5;  
    //轉場類型.
    anim.type = @"pageCurl";  
    [self.imageV.layer addAnimation:anim forKey:nil];

10> * CAAnimationGroup
同時進行多種動畫 -> 平移,旋轉,縮放 -> 取消反彈

-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{ 
    CAAnimationGroup *animGroup = [CAAnimationGroup animation];
    //animations數組當中存入的都是animation對象
    //平移
    CABasicAnimation *anim = [CABasicAnimation animation];
    anim.keyPath = @"position.y";
    anim.toValue = @(400); 
    //縮放
    CABasicAnimation *anim2 = [CABasicAnimation animation];
    anim2.keyPath = @"transform.scale";
    anim2.toValue = @(0.5);
    //會自動執行數組當中所有的動畫對象.
    animGroup.animations = @[anim,anim2];
    //動畫完成不要刪除動畫
    animGroup.removedOnCompletion = NO;
    //始終保持最前面的效果
    animGroup.fillMode = kCAFillModeForwards;
    [self.redView.layer addAnimation:animGroup forKey:nil];   
}

11> * UIView封裝的動畫
單視圖

+ (void)transitionWithView:(UIView *)view duration:(NSTimeInterval)duration options:(UIViewAnimationOptions)options animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion;

參數說明:
duration:動畫的持續時間
view:需要進行轉場動畫的視圖
options:轉場動畫的類型
animations:將改變視圖屬性的代碼放在這個block中
completion:動畫結束后,會自動調用這個block
雙視圖
+ (void)transitionFromView:(UIView *)fromView toView:(UIView *)toView duration:(NSTimeInterval)duration options:(UIViewAnimationOptions)options completion:(void (^)(BOOL finished))completion;

參數說明:
duration:動畫的持續時間
options:轉場動畫的類型
animations:將改變視圖屬性的代碼放在這個block中
completion:動畫結束后,會自動調用這個block
* 什么時候用核心動畫,什么時候用UIView動畫
* 核心動畫的缺點:都是假象,不能真正改變圖層屬性的值
* 展示和真實的位置不同
* 如果改變位置就用UIView的動畫
* 轉場動畫就用核心動畫
* 為什么轉場用核心動畫?因為UIView的轉場動畫太少。
* 演示UIView的轉場動畫
* touchBegin,切換圖片

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容