32

CGPath を含む CAShapeLayer があります。iOS の組み込みアニメーションを使用すると、アニメーションを使用してこのパスを別のパスに簡単に変形できます。

    CABasicAnimation *morph = [CABasicAnimation animationWithKeyPath:@"path"];
    morph.fromValue = (id)myLayer.path;
    mayLayer.path = [self getNewPath];
    morph.toValue = (id)myLayer.path;
    morph.duration = 0.3;
    [myLayer addAnimation:morph forKey:nil];

それは完璧に機能します。

ただし、ドラッグ操作中にこれらのパス間で徐々にモーフィングしたいと思います。これを行うには、ドラッグ中の任意の時点で補間されたパスを取得できる必要があります。これをiOSに要求する方法はありますか？

4

1 に答える 1

86

これは実際には、最初に考えるよりもはるかに単純であり、「速度なし」(一時停止) のアニメーションを使用します。一時停止したアニメーションがレイヤーに追加されたので、時間オフセットを変更して、アニメーション内の特定の時間にジャンプできます。

アニメーションを単独で実行する予定がない場合 (つまり、手動でのみ制御する場合)、アニメーションの継続時間を 1 に変更することをお勧めします。これは、0% から100%。期間が 0.3 の場合 (例のように)、タイム オフセットを 0 から 0.3 の間の値に設定します。

実装

上で述べたように、この小さなトリックに関係するコードはほとんどありません。

  1. (オプション) 期間を 1.0 に設定します。
  2. レイヤーの を設定しspeedます (はい、それらは に準拠していますCAMediaTiming) またはアニメーションを 0.0 に設定します
  3. ドラッグ ジェスチャまたはスライダ (私の例のように) 中timeOffsetに、レイヤーまたはアニメーションの を設定します (ステップ 2 で何をしたかによって異なります)。

これは、アニメーション+シェイプレイヤーを構成した方法です

CABasicAnimation *morph = [CABasicAnimation animationWithKeyPath:@"path"];
morph.duration  = 1.; // Step 1
morph.fromValue = (__bridge id)fromPath;
morph.toValue   = (__bridge id)toPath;
[self.shapeLayer addAnimation:morph forKey:@"morph shape back and forth"];

self.shapeLayer.speed = 0.0; // Step 2

そしてスライダーアクション：

- (IBAction)sliderChanged:(UISlider *)sender {
    self.shapeLayer.timeOffset = sender.value; // Step 3
}

以下の最終結果を見ることができます。ハッピーコーディング！

ここに画像の説明を入力

于 2013-09-08T12:47:09.713 に答える