iOSコアアニメーション(一)CAAnimation


Core Animation
簡単な紹介
 1. Core Animation,         ,             API,               ,         。    ,                   。
 2. Core Animation     ,    Mac OS X iOS  。
 3. Core Animation               ,       。      ,                 (  )。

       ,Core Animation      CALayer  ,  UIView。
CAAnimation
  • CAAnimationのすべてのアニメーションの親、ベースクラス(直接使用できません).
  • CAPropertyAnimationプロパティアニメーションは、プロパティ値の変更によってアニメーション効果が発生します.ベースクラス(直接使用できません).
  • CABasicAnimationベースアニメーション->2つのポイント間でのみ変更できます.
  • CASpringAnimationスプリングアニメーション.
  • CAKeyframeAnimationキーフレームアニメーション->複数のポイントの変更を追加したり、パスを追加したりできます.
  • CAAnimationGroupアニメーショングループは、複数のアニメーションを同時に追加し、予想される効果を達成することができます.
  • CATransitionターンオーバーアニメーション->ビュー切り替え時にアニメーション効果を追加します.
  • CALayer画層(アニメーションはすべて画層に基づいている)はコンテンツしか表示できず、ユーザーと応答できず、変更が発生し、画層から変更は発生せず、属性値を変更すると、彼自身がアニメーション効果を持っており、このアニメーション効果は暗黙的なアニメーションよりも優れている.

  • CALayer共通プロパティ
  • bounds:国境範囲
  • position:中心点
  • zPosition:z軸中心点
  • anchorPoint:アンカーポイント
  • anchorPointZ:Z軸アンカーのデフォルトアンカーポイントは、中心点と重なるアンカーポイントの最小値が0、0の最大値が1、1です.既定値:0.5、0.5;ビューが変更されると、アンカーポイントを基準に変更されます.アンカーの値と位置:0,0=レイヤーの左上隅0,1左下隅1,0右上隅1,1右下隅アンカー値=ビュー上のアンカーの位置.x.y/ビューの幅
  • transform変換形態
  • frame NO.Animatable座標
  • hidden非表示
  • doubleSidedレイヤ背面に
  • が表示されているかどうか
  • geometryFlipped反転
  • masksToBounds国境
  • を裁断
  • contentsコンテンツ
  • opaque不透明度
  • opacity不透明度
  • allowsEdgeAntialiasing変形後のアンチエイリアシング
  • を使用するかどうか
  • backgroundColor背景色
  • borderWidthボーダー幅
  • borderColorボーダー色
  • shadowColorシャドウカラー
  • shadowOpacityシャドウ不透明度
  • rasterizationScale Retinaスクリーン画素化防止
  • shadowOffsetシャドウオフセット
  • -shadowRadiusシャドウの半径
    CALayerとUIViewの関係
        iOS  ,           UIVIew       ,UIView        ,      Core Graphics  ,       (        ),                 
       CALayer      UIView  ,                  ,           (   ,       ),        。                  。 UIView      CALayer        。CALayer          (iOS                   ),           ,                           。
           ,UIView  ,       ->rootLayer      
       CALayer                
       UIView ->rootLayer    ,         
       CALayer    ,           
    
    UIViewとCALayerの同級の存在意義
              ,            。 iOS Mac OS     ,               ,                         ,      iOS UIKit UIView,  Mac OS AppKit NSView   。        ,             。
         ,     ,        Mac             iPhone iPad     。                 Core Animation  ,      iOS Mac OS      ,        OS                         。
    
    CAAnimationサブクラス
  • CAPropertyAnimation:プロパティアニメーション.ベースクラスでもあり、直接使用することはできません.属性値の変更によってアニメーション効果が発生します.
  • CABaseAnimation:ベースアニメーション.2つのポイント間の変化(ビューを平行移動)しかありません.
  • CAKeyframeAnimation:キーフレームアニメーション.複数のポイントの変更またはパスを追加できます.
  • CAAnimationGRoup:アニメーショングループ.目的の効果を達成するために、複数のアニメーションを追加できます.
  • CATransition:ターンオーバーアニメーション.ビュー切り替え時にアニメーション効果を追加する
  • ベースアニメーション
    CABasicAnimation
    CAPropertyAnimationのサブクラス
    属性:
  • fromValue:keyPath対応する属性の初期値.
  • toValue:keyPath対応属性の終了値.
  • アニメーションが進むにつれて、keyPathの対応する属性の値はdurationの長さの持続時間内にfromValueから徐々にtoValueに変化する.FillMode=kCAFillModeForwardsとremovedOnCompletion=NOの場合、アニメーションの実行が完了すると、レイヤはアニメーションの実行後の状態を表示します.しかし、実質的には、レイヤのプロパティ値はアニメーション実行前の初期値であり、実際には変更されていません.例えば、CALayerのpositionの初期値は(0,0)、CABasicAnimationのfromValueは(10,10)、toValueは(100,100)、アニメーションの実行後はレイヤは(100,100)の位置に保たれているが、実質的にレイヤのpositionは(0,0)
  • である
    キーアニメーション(Key Animation)
    CAKeyframeAnimation
      CApropertyAnimation   ,     
       CABasicAnimation    :
      CABasicAnimation       (fromValue)       (toValue), CAKeyframeAnimation     NSArray       .
    
    属性:
  • values:NSArrayオブジェクト.中の要素は「キーフレーム」(keyframe)と呼ばれます.アニメーションオブジェクトは、指定した時間(duration)内にvalues配列の各キーを順次表示します.
  • path:CGPathRefCGMutablePathRefを設定し、レイヤをパスに従って移動させることができます.pathはCALayerのanchorPointとpositionにのみ機能します.パスを設定するとvaluesは無視されます.
  • keyTimes:対応するキーフレームに対応する時間点を指定することができ、その値範囲は0から1.0であり、keyTimesの各時間値はvaluesの各フレームに対応する.keyTimesが設定されていない場合、各キーフレームの時間は均等である.
  • CABasicAnimationは、最大2つのキーフレームしかないCAKeyframeAnimation
                      ,   calculationMode:    。                      ,    anchorPoint   position      。                  ,      ,              ,                      。 
    
  • と見なすことができる
    calculationModeでは、次のパターンが提供されています.
  • kCAAnimationLinear calculationModeのデフォルト値は、キーフレームが座標点である場合、キーフレーム間が直接直線的に接続されて補間計算されることを示します.
  • 
kCAAnimationDiscreteが離散しているのは、補間計算を行わず、すべてのキーを直接1つずつ表示することです.
  • 
kCAAnimationPacedは、keyTimesによって設定された時間またはキーフレームによって時間を分割するのではなく、アニメーションを均一に行うため、keyTimesとtimingFunctionsは無効です.
  • kCAAnimationCubicは、キーフレームが座標点であるキーフレームに対して円滑な曲線接続後の補間計算を行い、ここでの主な目的は、動作する軌跡を円滑にすることである.

  • kCAAnimationCubicPacedこの名前を見るとkCAAnimationCubicと一定のつながりがあることがわかりますが、実はkCAAnimationCubicに基づいてアニメーションを均一に動作させることで、システム時間内の動きの距離が同じで、このときkeyTimesやtimingFunctionsも無効になります.

  • アニメーショングループ
    CAAnimationGroup
      CAAnimation   ,          , CAAnimationGroup      ,                .
    
    属性:
  • animations:アニメーションオブジェクトのセットを保存するNSArray.既定では、アニメーションオブジェクトのセットは同時に実行されます.アニメーションオブジェクトのbeginTimeプロパティを設定することで、アニメーションの開始時間を変更することもできます.
  • 回転アニメーション
    CATransition
  • CAAnimationのサブクラスで、画面を移動したり画面に移動したりするアニメーション効果をレイヤに与えることができます.iOSはMac OS Xよりも回転アニメーションの効果が少ない.
  • UInavigationControllerは、CATransitionによってコントローラのビューをスクリーンに押し込むアニメーション効果を実現する.
    属性:
  • type:アニメーション遷移タイプ
  • subtype:アニメーション遷移方向
  • startProgress:アニメーションの開始点(アニメーション全体のパーセント)
  • endProgress:アニメーションの終点(アニメーション全体のパーセント)
  • 
    #import "ViewController.h"
    #define Angle(a) (a)*M_PI/180
    #define sAngle 6 //       :sAngle*N *M_PI/180
    @interface ViewController (){
        CALayer *layer;
    
    }
    @property (nonatomic,strong)CALayer *pointLayer;
    
    @end
    
    @implementation ViewController
    - (void)viewDidLoad {
        [super viewDidLoad];
    //    CAlayer
        layer = [CALayer layer];
        layer.frame = CGRectMake(100, 100, 100, 100);
    //       
        layer.cornerRadius = 100/2;
        layer.backgroundColor =[UIColor brownColor].CGColor;
    //       
        [self.view.layer addSublayer:layer];
    
    // NSLog(@"%@",self.pointLayer);
    
        _pointLayer.anchorPoint =CGPointMake(0, 0.5);
    //       
    
    //          (CGColorRef)   (CGImageRef)    ,  UI
    
        _pointLayer.contents =(id)[UIImage imageNamed:@"shizhen.png"].CGImage;
        self.pointLayer.anchorPoint = CGPointMake(0.5, 0.9);
        [self star];
        [NSTimer scheduledTimerWithTimeInterval:1
                                         target:self selector:@selector(star) userInfo:nil repeats:YES];
    }
    
    -(void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
    
    //         
        layer.position =[[touches anyObject] locationInView:self.view];
        CGFloat width =CGRectGetWidth(layer.bounds)!=100?100:50;
    //            
        layer.bounds =CGRectMake(0, 0, width, width);
    //     
        CGColorRef color = [UIColor brownColor].CGColor != layer.backgroundColor ?
        [UIColor brownColor].CGColor:
        [UIColor colorWithRed:0.863
                        green:0.634
                         blue:0.490
                        alpha:1.000].CGColor;
        layer.backgroundColor = color;
    //     
        layer.cornerRadius =width!=100?0:width/2;
    //      
        layer.opacity = 0.3;
    
    
    //     ,    1,    0
     // _pointLayer.transform = CATransform3DMakeRotation(/*  */Angle(60),0 , 0, 1);
    
    
    
    }
    -(void)touchesEnded:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
        layer.opacity = 1.0;
    //   
      // _pointLayer.transform = CATransform3DIdentity;
    }
    
    //          layer
    -(CALayer *)pointLayer{
        if (_pointLayer) {
            return _pointLayer;
        }
        _pointLayer = [CALayer layer];
        _pointLayer.bounds =CGRectMake(0, 0, 18, 220);
        //     
        _pointLayer.position =self.view.center;
        _pointLayer.backgroundColor =
        [UIColor colorWithRed:1.000
                        green:0.392
                         blue:0.929
                        alpha:1.000].CGColor;
        [self.view.layer addSublayer:_pointLayer];
        return _pointLayer;
    }
    
    -(void)star{
    // NSCalendar   ;           ,  NSCalendar    
    // NSDateComponents
    //       
        NSCalendar *calender =[NSCalendar currentCalendar];
        NSDateComponents *componest =[calender components:
                                      NSCalendarUnitHour|
                                      NSCalendarUnitMinute|
                                      NSCalendarUnitSecond fromDate:[NSDate date]];
        float s = componest.second * sAngle;
        _pointLayer.transform = CATransform3DMakeRotation(/*  */Angle(s),0 , 0, 1);
    }
    
    
    @end