次の方法で共有

KeyFrameAnimation.Direction プロパティ

  • リファレンス

定義

名前空間:
Windows.UI.Composition
編集

アニメーションの再生方向。

Direction プロパティを使用すると、アニメーションに IterationCount が 1 より大きい場合に、アニメーションを開始から終了、開始、または開始と終了の間で切り替えて開始できます。 これにより、アニメーション定義を簡単にカスタマイズできます。

public:
 property AnimationDirection Direction { AnimationDirection get(); void set(AnimationDirection value); };
AnimationDirection Direction();

void Direction(AnimationDirection value);
public AnimationDirection Direction { get; set; }
var animationDirection = keyFrameAnimation.direction;
keyFrameAnimation.direction = animationDirection;
Public Property Direction As AnimationDirection

プロパティ値

AnimationDirection

アニメーションの再生方向。

Windows の要件

デバイス ファミリ
Windows 10 Anniversary Edition (10.0.14393.0 で導入)
API contract
Windows.Foundation.UniversalApiContract (v3.0 で導入)

例

AnimationDirection は標準です

class Direction 
{ 
  Direction(Compositor compositor, SpriteVisual heroVisual) 
  { 
    Vector3KeyFrameAnimation animation = compositor.CreateVector3KeyFrameAnimation(); 
    animation.InsertKeyFrame(0f, new Vector3(0f,0f,0f)); 
    animation.InsertKeyFrame(1f, new Vector3(20f,20f,0f)); 
    animation.Duration = TimeSpan.FromSeconds(0.25); 

    // Run animation for 4 times 
    animation.IterationCount = 4; 

    // Direction of animation is normal i.e. forward. 
    animation.Direction = AnimationDirection.Normal; 

    heroVisual.StartAnimation("Offset", animation); 
  } 
}

AnimationDirection が反転

class Direction 
{ 
  Direction(Compositor compositor, SpriteVisual heroVisual) 
  { 
    Vector3KeyFrameAnimation animation = compositor.CreateVector3KeyFrameAnimation(); 
    animation.InsertKeyFrame(0f, new Vector3(0f,0f,0f)); 
    animation.InsertKeyFrame(1f, new Vector3(20f,20f,0f)); 
    animation.Duration = TimeSpan.FromSeconds(0.25); 

    // Run animation for 4 times 
    animation.IterationCount = 4; 

    // Direction of animation is Reverse i.e. end to start. 
    animation.Direction = AnimationDirection.Reverse; 

    heroVisual.StartAnimation("Offset", animation); 
  } 
}

AnimationDirection は代替

class Direction 
{ 
  Direction(Compositor compositor, SpriteVisual heroVisual) 
  { 
    Vector3KeyFrameAnimation animation = compositor.CreateVector3KeyFrameAnimation(); 
    animation.InsertKeyFrame(0f, new Vector3(0f,0f,0f)); 
    animation.InsertKeyFrame(1f, new Vector3(20f,20f,0f)); 
    animation.Duration = TimeSpan.FromSeconds(0.25); 

    // Run animation for 4 times 
    animation.IterationCount = 4; 

    // Direction of animation is alternate i.e. start to end and then end to start and so on. 
    animation.Direction = AnimationDirection.Alternate; 

    heroVisual.StartAnimation("Offset", animation); 
  } 
}

AnimationDirection は AlternateReverse です

class Direction 
{ 
  Direction(Compositor compositor, SpriteVisual heroVisual) 
  { 
    Vector3KeyFrameAnimation animation = compositor.CreateVector3KeyFrameAnimation(); 
    animation.InsertKeyFrame(0f, new Vector3(0f,0f,0f)); 
    animation.InsertKeyFrame(1f, new Vector3(20f,20f,0f)); 
    animation.Duration = TimeSpan.FromSeconds(0.25); 

    // Run animation for 4 times 
    animation.IterationCount = 4; 

    // Direction of animation is alternate-reverse i.e. end to start and then start to end and so on. 
    animation.Direction = AnimationDirection.AlternateReverse; 

    heroVisual.StartAnimation("Offset", animation); 
  } 
}

注釈

反復回数が 3 で、キーフレーム 0 の場合は Vector3(5,5,5)、キーフレーム 1 の場合は Vector3(20,20,20) の値を持つ 2 つのキーフレーム (0、1) のオフセット アニメーションを指定すると、次の表に Direction の値が異なるアニメーション動作を示します。

Directionアニメーションの動作
標準アニメーションはオフセット値 Vector3(5,5,5) から開始され、Vector3(20,20,20) に移動し、常に (5,5,5) から 3 回繰り返されます。
Reverseアニメーションは反転とオフセット値 (20,20,20) で開始され、(20,20,20) から常に 3 回繰り返し (5,5,5) に移動します。
代替最初のイテレーションでは、アニメーションはオフセット値 (5,5,5) から開始され、 (20,20,20) に移動します。 2 番目の反復アニメーションでは、アニメーションはオフセット値 (20,20,20) から開始され、(5,5,5) に移動します。 3 番目と最後のイテレーションでは、アニメーションはオフセット (5,5,5) から開始され、(20,20,20) に移動します。
AlternateReverse最初のイテレーションでは、アニメーションはオフセット値 (20,20,20) から開始され、(5,5,5) に移動します。 2 番目のイテレーションでは、アニメーションはオフセット値 (5,5,5) から開始され、(20, 20, 20) に移動します。 3 番目と最後のイテレーションでは、アニメーションはオフセット (20、20、20) から開始され、(5,5,5) に移動します。

適用対象