8

赤から白にブレンドするカラーアニメーションがあります。現在、これは線形フェードです。StoryboardクラスのBeginTimeなどで遊ぶことができることはわかっていますが、それは単にアニメーション全体の開始を遅らせるだけです。物事のイーズイン/イーズアウトの側面も調べましたが、どちらも機能していないようです。

具体的には、赤の値を1秒間保持してから、次の時間に赤から白にフェードします。それは純粋なXAMLで実行できますか？そうでない場合は、ストーリーボードを手動で設定するコードビハインドで実行できますか？...または、2つの別々のストーリーボードを使用して、それらを順番に再生する必要がありますか？

4

2 に答える 2

20

これを行うためのいくつかの方法。

キーフレーム付き：

<Storyboard>
    <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="Background.Color">
        <DiscreteColorKeyFrame Value="Red" KeyTime="0:0:0" />
        <DiscreteColorKeyFrame Value="Red" KeyTime="0:0:1" />
        <LinearColorKeyFrame Value="White" KeyTime="0:0:2" />
    </ColorAnimationUsingKeyFrames>
</Storyboard>

2つのアニメーションを順番に使用：

<Storyboard>
    <ColorAnimation Storyboard.TargetProperty="Background.Color"
                    From="Red" To="Red" Duration="0:0:1" />
    <ColorAnimation Storyboard.TargetProperty="Background.Color"
                    To="White" BeginTime="0:0:1" Duration="0:0:1" />
</Storyboard>

カスタムイージング機能付き：

<Storyboard>
    <ColorAnimation Storyboard.TargetProperty="Background.Color"
                    From="Red" To="White" Duration="0:0:2">
        <ColorAnimation.EasingFunction>
            <local:CustomEasingFunction />
        </ColorAnimation.EasingFunction>
    </ColorAnimation>
</Storyboard>

この場合、期間の前半の遷移を示し、後半の値を保持する関数。デフォルトのEasingModeはEaseOutであるため、この関数は逆方向に「再生」されます。

public class CustomEasingFunction : EasingFunctionBase
{
    public CustomEasingFunction() : base()
    { }

    protected override double EaseInCore(double normalizedTime)
    {
        return (normalizedTime < 0.5)
            ? normalizedTime * 2
            : 1;
    }

    protected override Freezable CreateInstanceCore()
    {
        return new CustomEasingFunction();
    }
}
于 2012-05-18T00:30:45.570 に答える
1

アニメーションの作成方法によっては、「赤」から「赤」へのトランジションを追加するだけで、最初に1秒かかります。つまり、技術的にはアニメーションは実行されていますが、何も実行されていません。これは、純粋なXAMLで実行できます。

于 2012-05-17T20:57:30.123 に答える