[C#/WPF] ObjectAnimationUsingKeyFrames 엘리먼트 : 키 프레임을 사용해 객체에 애니메이션 효과 주기

■ ObjectAnimationUsingKeyFrames 엘리먼트에서 키 프레임을 사용해 객체에 애니메이션 효과를 주는 방법을 보여준다.

▶ MainWindow.xaml


<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="TestProject"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <Window.Triggers>
        <EventTrigger RoutedEvent="Page.Loaded">
            <BeginStoryboard>
                <Storyboard>
                    <ObjectAnimationUsingKeyFrames
                        Storyboard.TargetProperty="Background"
                        Duration="00:00:04"
                        RepeatBehavior="Forever">
                        <ObjectAnimationUsingKeyFrames.KeyFrames>
                            <DiscreteObjectKeyFrame KeyTime="00:00:01">
                                <DiscreteObjectKeyFrame.Value>
                                    <LinearGradientBrush>
                                        <LinearGradientBrush.GradientStops>
                                            <GradientStop Offset="0.0" Color="Yellow" />
                                            <GradientStop Offset="0.5" Color="Orange" />
                                            <GradientStop Offset="1.0" Color="Red"    />
                                        </LinearGradientBrush.GradientStops>
                                    </LinearGradientBrush>
                                </DiscreteObjectKeyFrame.Value>
                            </DiscreteObjectKeyFrame>
                            <DiscreteObjectKeyFrame KeyTime="00:00:02">
                                <DiscreteObjectKeyFrame.Value>
                                    <RadialGradientBrush GradientOrigin="0.75 0.25">
                                        <RadialGradientBrush.GradientStops>
                                            <GradientStop Offset="0.0" Color="White"      />
                                            <GradientStop Offset="0.5" Color="MediumBlue" />
                                            <GradientStop Offset="1.0" Color="Black"      />
                                        </RadialGradientBrush.GradientStops>
                                    </RadialGradientBrush>
                                </DiscreteObjectKeyFrame.Value>
                            </DiscreteObjectKeyFrame>
                            <DiscreteObjectKeyFrame KeyTime="00:00:03">
                                <DiscreteObjectKeyFrame.Value>
                                    <DrawingBrush
                                        Viewport="0 0 0.25 0.25"
                                        TileMode="Tile">
                                        <DrawingBrush.Drawing>
                                            <DrawingGroup>
                                                <DrawingGroup.Children>
                                                    <GeometryDrawing Brush="White">
                                                        <GeometryDrawing.Geometry>
                                                            <RectangleGeometry Rect="0 0 1 1" />
                                                        </GeometryDrawing.Geometry>
                                                    </GeometryDrawing>
                                                    <GeometryDrawing
                                                        Brush="Black"
                                                        Geometry="M 0 0 L 0 0.5 0.5 0.5 0.5 1 1 1 1 0.5 0.5 0.5 0.5 0" />
                                                </DrawingGroup.Children>
                                            </DrawingGroup>
                                        </DrawingBrush.Drawing>
                                    </DrawingBrush>
                                </DiscreteObjectKeyFrame.Value>
                            </DiscreteObjectKeyFrame>
                        </ObjectAnimationUsingKeyFrames.KeyFrames>
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Window.Triggers>
</Window>

<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="TestProject"

FontFamily="나눔고딕코딩"

FontSize="16">

<Window.Triggers>

<ObjectAnimationUsingKeyFrames

Storyboard.TargetProperty="Background"

Duration="00:00:04"

RepeatBehavior="Forever">

<ObjectAnimationUsingKeyFrames.KeyFrames>

<DiscreteObjectKeyFrame.Value>

<LinearGradientBrush.GradientStops>

</LinearGradientBrush.GradientStops>

</LinearGradientBrush>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

<DiscreteObjectKeyFrame.Value>

<RadialGradientBrush.GradientStops>

</RadialGradientBrush.GradientStops>

</RadialGradientBrush>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

<DiscreteObjectKeyFrame.Value>

<DrawingBrush

Viewport="0 0 0.25 0.25"

TileMode="Tile">

<DrawingBrush.Drawing>

<DrawingGroup.Children>

<GeometryDrawing.Geometry>

</GeometryDrawing.Geometry>

</GeometryDrawing>

<GeometryDrawing

Brush="Black"

Geometry="M 0 0 L 0 0.5 0.5 0.5 0.5 1 1 1 1 0.5 0.5 0.5 0.5 0" />

</DrawingGroup.Children>

</DrawingGroup>

</DrawingBrush.Drawing>

</DrawingBrush>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames.KeyFrames>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</BeginStoryboard>

</EventTrigger>

</Window.Triggers>

</Window>

TestProject.zip

.NETFRAMEWORK 2D ANIMATION C# GRAPHICS MICROSOFT WPF

icodebroker

[C#/WPF] ObjectAnimationUsingKeyFrames 엘리먼트 : 키 프레임을 사용해 객체에 애니메이션 효과 주기