ホームページ  >  記事  >  ウェブフロントエンド  >  CoreAnimationアニメーションについて(前編)_html/css_WEB-ITnose

CoreAnimationアニメーションについて(前編)_html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-24 11:34:26941ブラウズ

Core Animation アニメーションについて (パート 1)

1. UIView と CALayer

UIView と CALayer については誰もがよく知っているはずです。通常、UIView はビュー ツリーの構造によって構成されていると理解します。実際、UIView は別のレイヤー ツリー (つまり、CALayer ツリー) を管理および維持します。実際に画面上に表示され、アニメーション化されるのは CALayer オブジェクトです。

CALayer が View の内部実装の詳細である場合、なぜ Apple は UIView の別の層をカプセル化するのでしょうか? UIView と CALayer の違いは何ですか? UIView と CALayer の最大の違いは、UIView がユーザー操作を処理できることです (クリック イベントとして)、CALayer は特定のレスポンダー チェーンを認識しないため、イベントに応答できません。
応答イベントを UIView に抽象化する理由は、基礎となるコードのセット (つまりレイヤー) を Mac OS と共有するためです。 Mac OS には NSView クラスがあり、iOS とは異なる一部のユーザー イベント (キーボードやマウスなど) を処理するために使用されます。

ほとんどの単純なシーンでは、UIView が要件を満たすことができます。では、CALayer を勉強することに何の意味があるのでしょうか? CALayer は UIView のようなタッチ イベントを処理できないことを以前に学びました。 UIView には、公開されていない CALayer 関数もいくつかあります。

  • シャド​​ウ、丸い角、境界線

  • 3D 変換 (UIView は 2D 変換のみ)

    を取得できます。 view.layer を通して。

  • CALayer には、さまざまな効果を実現できる特別なサブクラスが多数あります。CALayer の特定のサブクラスを見てみましょう。 UIView の CALayer カテゴリを変更することも、別の CALayer インスタンスをそれに追加することもできます。この章では主にアニメーションに焦点を当てますので、今のところはあまり詳しく説明しません。
  • 2. 暗黙的アニメーション

  • CALayer と UIView を理解すると、暗黙的アニメーションを見て、システムがどのような状況でアニメーションを自動的に生成するかを理解できます。どのような状況で自分でアニメーションを追加する必要がありますか。
  • 暗黙的なアニメーションは実際にモノによって生成されます。 まずモノの概念を見てみましょう:

  • 2.1 トランザクション
  • トランザクションは実際には、一連の属性アニメーション コレクション、CALayer Changes の属性を含めるためにコア アニメーションによって使用されるメカニズムです。はすぐには発生しませんが、トランザクションがコミットされた後にアニメーションを使用して新しい値に移行します。

    コア アニメーションは、実行ループ サイクルごとに新しいトランザクションを自動的に開始します。実行ループ サイクル内の
  • プロパティ
  • への変更は集中して、0.25 秒間アニメーション化されます。

    たとえば、ビューに新しいレイヤーを追加し、その backGroundColor を変更すると、色は即座には変化せず、0.25 秒 (アニメーションのデフォルトの継続時間) かけて徐々に変化することがわかります。

    //CALayer的隐式动画- (void)viewDidLoad {    [super viewDidLoad];        //创建一个红色的layer    _layer = [CALayer layer];    _layer.frame = self.view.bounds;    _layer.backgroundColor = [UIColor redColor].CGColor;    [self.view.layer addSublayer:_layer];}- (IBAction)changeColor:(id)sender {    //修改layer的颜色为黄色   此时,颜色是由红色渐变到黄色的    _layer.backgroundColor = [UIColor yellowColor].CGColor;}
    上記は、暗黙的なアニメーションが実行されるたびにデフォルトでトランザクションを開始し、CALayer のプライバシー アニメーションを完了する理由です。 UIView に関連付けられたレイヤーでは暗黙的なアニメーションが無効になっていることに注意してください。現時点では、アニメーションを自分たちで実装する必要があります:
  • CATransaction の +begin および +commit を通じて、新しいトランザクションをスタックにプッシュまたはポップできます (+beginAnimations:context: や +beginAnimations:context: などの UIView のいくつかのショートカット メソッドを使用することもできます)。 +animateWithDuration:アニメーション:、それらは本質的に同じです)、
新しいトランザクションでは、アニメーションの持続時間など、アニメーション関連の設定を変更できます。これらの設定は現在のトランザクションに対してのみ有効であり、次のトランザクションには影響しません。デフォルトの実行ループ。

//对View做动画,需要包含在事物中[CATransaction begin];self.view.backgroundColor = [UIColor yellowColor];     //改变view颜色[CATransaction setAnimationDuration:1];             //修改本次事务的动画时间[CATransaction setCompletionBlock:^{                   //动画结束后回调    NSLog(@"animation completed");}];[CATransaction commit];  //提交动画
2.2 modelLayer とpresentationLayer
上記の部分から、CALayer のプロパティが変更されると、アニメーション期間を通じて徐々に更新されることがわかり、backColor の開始値と終了値を設定するだけです (赤から黄色)。それでは、アニメーションの中間状態の backColor を取得する方法はあるのでしょうか?

答えは「はい」です。modelLayer とpresentationLayer という 2 つの概念を理解する必要があります。

ほとんどの場合、作成する CALayer インスタンスは、modelLayer (データ レイヤーと呼ぶこともできます) を参照します。レイヤ オブジェクトに対して -modelLayer を呼び出すと、通常は -self が返されます。レイヤーのプロパティが変更されると、modelLayer のプロパティ値がすぐに変更されます (アニメーションが開始される前に)。上記の例では、modelLayer の値が赤から黄色にすぐに変更されます。

presentationLayer はプレゼンテーション レイヤーと呼ばれ、実際には modelLayer のコピーであり、常に画面に表示されるレイヤーの実際の値を表します。つまり、アニメーション処理中のレイヤーの中間状態の属性値は、presentationLayer を通じて取得できます。

presentationLayer は、レイヤーが初めて画面に表示されるときにのみ作成されることに注意してください。それ以前は、presentationLayer は nil を返します。

要約すると


CAlayer は UIView の基礎となる実装であり、UIView は一部のユーザー タッチ イベントを処理できるのに対し、CALayer はより豊富な基礎となる機能を提供することがわかりました。

  • CALayer プロパティの変更では、runloop には暗黙的なアニメーション用のデフォルトのものがあり、UIView ではプライベート アニメーションが無効になっていますが、新しいアニメーション効果を送信することで、UIView に制御可能なプロパティの変更を与えることができます。

  • modelLayer のプロパティは変更直後に最終値に変更されるのに対し、presentationLayer は段階的な変更プロセスを受けることがわかりました。これは一部のインタラクティブ アニメーションに非常に役立ちます。

  • 表示アニメーション、レンダリング ツリーなど、将来的に他のコア アニメーションのことについて話す可能性があります。

    転載する場合は出典を明記してください、私のブログ: luoyibu

    声明:
    この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。