■ DoubleAnimationUsingKeyFrames 엘리먼트 : 뉴턴의 요람(Newton's Cradle) 만들기

----------------------------------------------------------------------------------------------------

 

<Window

    x:Class="TestProject.MainWindow"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    Width="800"

    Height="600"

    Title="뉴턴의 요람(Newton's Cradle) 만들기">

    <Canvas>

        <Canvas.Resources>

            <Style TargetType="{x:Type Path}">

                <Setter Property="Fill"            Value="Silver" />

                <Setter Property="Stroke"          Value="Black" />

                <Setter Property="StrokeThickness" Value="3"      />

                <Setter Property="Data"            Value="M 0 0 V 300 A 25 25 0 1 1 0 350 A 25 25 0 1 1 0 300" />

            </Style>

        </Canvas.Resources>

        <Path>

            <Path.RenderTransform>

                <TransformGroup>

                    <RotateTransform x:Name="rotateTransform1" Angle="30" />

                    <TranslateTransform X="200" />

                </TransformGroup>

            </Path.RenderTransform>

        </Path>

        <Path>

            <Path.RenderTransform>

                <TransformGroup>

                    <RotateTransform x:Name="rotateTransform2" Angle="30" />

                    <TranslateTransform X="252" />

                </TransformGroup>

            </Path.RenderTransform>

        </Path>

        <Path>

            <Path.RenderTransform>

                <TransformGroup>

                    <RotateTransform x:Name="rotateTransform3" Angle="30" />

                    <TranslateTransform X="304" />

                </TransformGroup>

            </Path.RenderTransform>

        </Path>

        <Path>

            <Path.RenderTransform>

                <TransformGroup>

                    <RotateTransform x:Name="rotateTransform4" />

                    <TranslateTransform X="356" />

                </TransformGroup>

            </Path.RenderTransform>

        </Path>

        <Path>

            <Path.RenderTransform>

                <TransformGroup>

                    <RotateTransform x:Name="rotateTransform5" />

                    <TranslateTransform X="408" />

                </TransformGroup>

            </Path.RenderTransform>

        </Path>

        <Canvas.Triggers>

            <EventTrigger

                RoutedEvent="Page.Loaded">

                <BeginStoryboard>

                    <Storyboard

                        TargetProperty="Angle"

                        RepeatBehavior="Forever">

                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="rotateTransform1">

                            <DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="30"                             />

                            <SplineDoubleKeyFrame   KeyTime="0:0:1" Value="0"  KeySpline="0.25 0, 0.6 0.2" />

                            <DiscreteDoubleKeyFrame KeyTime="0:0:3" Value="0"                              />

                            <SplineDoubleKeyFrame   KeyTime="0:0:4" Value="30" KeySpline="0.75 1, 0.4 0.8" />

                        </DoubleAnimationUsingKeyFrames>

                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="rotateTransform2">

                            <DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="30"                             />

                            <SplineDoubleKeyFrame   KeyTime="0:0:1" Value="0" KeySpline="0.25 0, 0.6 0.2" />

                            <DiscreteDoubleKeyFrame KeyTime="0:0:3" Value="0"                              />

                            <SplineDoubleKeyFrame   KeyTime="0:0:4" Value="30" KeySpline="0.75 1, 0.4 0.8" />

                        </DoubleAnimationUsingKeyFrames>

                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="rotateTransform3">

                            <DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="30"                              />

                            <SplineDoubleKeyFrame   KeyTime="0:0:1" Value="0"   KeySpline="0.25 0, 0.6 0.2" />

                            <SplineDoubleKeyFrame   KeyTime="0:0:2" Value="-30" KeySpline="0.75 1, 0.4 0.8" />

                            <SplineDoubleKeyFrame   KeyTime="0:0:3" Value="0"   KeySpline="0.25 0, 0.6 0.2" />

                            <SplineDoubleKeyFrame   KeyTime="0:0:4" Value="30"  KeySpline="0.75 1, 0.4 0.8" />

                        </DoubleAnimationUsingKeyFrames>

                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="rotateTransform4">

                            <DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="0"                               />

                            <DiscreteDoubleKeyFrame KeyTime="0:0:1" Value="0"                               />

                            <SplineDoubleKeyFrame   KeyTime="0:0:2" Value="-30" KeySpline="0.75 1, 0.4 0.8" />

                            <SplineDoubleKeyFrame   KeyTime="0:0:3" Value="0"   KeySpline="0.25 0, 0.6 0.2" />

                        </DoubleAnimationUsingKeyFrames>

                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="rotateTransform5">

                            <DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="0"                               />

                            <DiscreteDoubleKeyFrame KeyTime="0:0:1" Value="0"                               />

                            <SplineDoubleKeyFrame   KeyTime="0:0:2" Value="-30" KeySpline="0.75 1, 0.4 0.8" />

                            <SplineDoubleKeyFrame   KeyTime="0:0:3" Value="0"   KeySpline="0.25 0, 0.6 0.2" />

                        </DoubleAnimationUsingKeyFrames>

                    </Storyboard>

                </BeginStoryboard>

            </EventTrigger>

        </Canvas.Triggers>

    </Canvas>

</Window>

----------------------------------------------------------------------------------------------------

Posted by 사용자 icodebroker