WPFのシーン

著作権：帰属、紙ベースを作成するために他人を許可し、（同じライセンスで元のライセンス契約に基づいて用紙配布する必要がありますクリエイティブコモンズ）

シーン（ストーリーボード）、それはまた、彼らのコラボレーションのためのストーリーボードアニメーション要素における独立した組織の最初のグループ、物語はタイムラインの強化と呼ばれるバージョン、アレンジを持っており、アニメーションのどの要素UIを指定し、どのプロパティ（キーフレームアニメーションは、アニメーションシリアル実行の集合であり、シーンがアニメーションの並列実行の集合である）の完了のために責任があるだけでなく、アニメーションの再生を制御する能力を持っている-一時停止、停止位置と遊び。ストーリーボードのクラスは、特定の属性および特定の要素（TargetProperty属性及び追加属性は、属性TargetNameはある）にTargetProperty TargetNameは特性やポイントを使用することができる基本的な機能を提供します

XAML コード：

<Grid Margin="6">

        <!--页面布局-->

        <Grid.RowDefinitions>

            <RowDefinition Height="50"/>

            <RowDefinition Height="50"/>

            <RowDefinition Height="50"/>

        </Grid.RowDefinitions>

        <Grid.ColumnDefinitions>

            <ColumnDefinition />

            <ColumnDefinition Width="80"/>

        </Grid.ColumnDefinitions>

        <!--（红）-->

        <Border BorderBrush="Gray" BorderThickness="1" Grid.Row="0">

            <Ellipse x:Name="ballR" Height="36" Width="36" Fill="Red" HorizontalAlignment="Left">

                <Ellipse.RenderTransform>

                    <TranslateTransform x:Name="ttR"/>

                </Ellipse.RenderTransform>

            </Ellipse>

        </Border>

        <!--（绿）-->

        <Border BorderBrush="Gray" BorderThickness="1" Grid.Row="1">

            <Ellipse x:Name="ballG" Height="36" Width="36" Fill="Green" HorizontalAlignment="Left">

                <Ellipse.RenderTransform>

                    <TranslateTransform x:Name="ttG"/>

                </Ellipse.RenderTransform>

            </Ellipse>

        </Border>

        <!--（蓝）-->

        <Border BorderBrush="Gray" BorderThickness="1" Grid.Row="2">

            <Ellipse x:Name="ballB" Height="36" Width="36" Fill="Blue" HorizontalAlignment="Left">

                <Ellipse.RenderTransform>

                    <TranslateTransform x:Name="ttB"/>

                </Ellipse.RenderTransform>

            </Ellipse>

        </Border>

        <Button Content="点击" Grid.Column="1" Grid.RowSpan="3" Height="153" VerticalAlignment="Top" Click="Button_Click"/>

</Grid>

C＃の背後にあるコード：

 private void Button_Click(object sender, RoutedEventArgs e)

 {

      Duration duration = new Duration(TimeSpan.FromMilliseconds(600));



      //红色小球匀速移动

      DoubleAnimation daRx = new DoubleAnimation();

      daRx.Duration = duration;

      daRx.To = 400;



      //绿色小球变速运动

      DoubleAnimationUsingKeyFrames dakGx = new DoubleAnimationUsingKeyFrames();

      dakGx.Duration = duration;

      SplineDoubleKeyFrame keyFrameG = new SplineDoubleKeyFrame(400, KeyTime.FromPercent(1.0));

      keyFrameG.KeySpline = new KeySpline(1, 0, 0, 1);

      dakGx.KeyFrames.Add(keyFrameG);



      //蓝色小球变速运动

      DoubleAnimationUsingKeyFrames dakBx = new DoubleAnimationUsingKeyFrames();

      dakBx.Duration = duration;

      SplineDoubleKeyFrame kfB = new SplineDoubleKeyFrame(400, KeyTime.FromPercent(1.0));

      kfB.KeySpline = new KeySpline(0, 1, 1, 0);

      dakBx.KeyFrames.Add(kfB);



      //创建场景

      Storyboard storyboard = new Storyboard();

      Storyboard.SetTargetName(daRx, "ttR");

      Storyboard.SetTargetProperty(daRx, new PropertyPath(TranslateTransform.XProperty));

      Storyboard.SetTargetName(dakGx, "ttG");

      Storyboard.SetTargetProperty(dakGx, new PropertyPath(TranslateTransform.XProperty));

      Storyboard.SetTargetName(dakBx, "ttB");

      Storyboard.SetTargetProperty(dakBx, new PropertyPath(TranslateTransform.XProperty));



      storyboard.Duration = duration;

      storyboard.Children.Add(daRx);

      storyboard.Children.Add(dakGx);

      storyboard.Children.Add(dakBx);



      storyboard.Begin(this);

      storyboard.Completed += (a, b) => { MessageBox.Show(ttR.X.ToString()); };

}

イベントのトリガ：イベントトリガーは、いくつかの場所で定義することができます。

スタイル（Style.Triggersコレクション）で。
データテンプレート（DataTemplate.Triggersコレクション）で。
コントロールテンプレートで（のControlTemplate。トリガコレクション）。
要素（FrameworkElement.Triggersコレクション）で直接定義されたイベントのトリガ。

プロパティ、データトリガーが起動し、そのイベントがトリガされます。そこWPFトリガの3つの基本タイプがあります。トリガーの最も一般的な使用は、アニメーションと関連しています

XAML コード：

<Button Width="200" Height="80" Content="事件触发器" FontSize="20">

        <!--元素触发器-->

        <Button.Triggers>

            <!--定义事件触发器-->

            <EventTrigger RoutedEvent="Button.Click">

                <!--执行一个动作-->

                <EventTrigger.Actions>

                    <!--开始故事版-->

                    <BeginStoryboard>

                        <!--创建一个故事版-->

                        <Storyboard>

                            <!--创建一个-->

                            <DoubleAnimation Storyboard.TargetProperty="Width" To="350" RepeatBehavior="Forever" Duration="0:0:3"/>

                        </Storyboard>

                    </BeginStoryboard>

                </EventTrigger.Actions>

            </EventTrigger>

        </Button.Triggers>

</Button>

<!--点击按钮“事件触发器”的时候便开始动画，宽度变成350，然后一直循环动画-->

制御シナリオカテゴリ：

- PauseStoryboard：アニメーションを停止し、現在の位置を維持
- ResumeStoryboard：履歴書仮死
- StopStoryboard：開始位置にアニメーションとアニメーションクロックリセットを停止
- SeekStoryboard：アニメーションタイムラインは、現在のアニメーションが一時停止している場合は、あなたが中断したまま、現在のムービーが再生されている場合、それは新しい位置から再生を継続し、特定の位置にジャンプします。
- SetStoryboardSpeedRatio：速度比は、シーン全体の属性値を変更しました。
- SkipStoryboardToFill：シーンは、タイムラインの最後に移動されます。HoldEndにFillBehaviorプロパティは、アニメーションが最終値のまま。
- RemoveStoryboard：すべてのアニメーションが実行を停止し、元の値、最後のセットにプロパティを返すために、シーンを削除します。

これらのアクションの実装を成功させるためのアクションがトリガされた場合、すべてのトリガーは、同じトリガーコレクションに定義する必要があり、別のコレクションの中に置かれPauseStoryboard BeginStoryboardアクショントリガーは、PauseStoryboardアクションは動作しません。

シーンのイベント：

完了：アニメーションは終わりに達しました
CurrentGlobalSpeedInvalidated：速度の変更、またはアニメーションが一時停止され、停止するか、新しい場所に移動し、再開しました。
CurrentStateInvalidated：運動が開始または終了しました。
CurrentTimeInvalidated：アニメーションクロックは、ステップを前方に移動アニメーションを変更することがありました。アニメーションが開始すると、停止、またはイベントの終わりにつながります。
RemoveRequested：アニメーションは削除されています。

おすすめ