[C#/WPF] DoubleAnimationUsingPath 클래스 : 경로를 따라 객체에 애니메이션 효과 주기

■ DoubleAnimationUsingPath 클래스를 사용해 경로를 따라 객체에 애니메이션 효과을 주는 방법을 보여준다.

▶ 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>

<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>

▶ MainWindow.xaml.cs


using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;

namespace TestProject
{
    /// <summary>
    /// 메인 윈도우
    /// </summary>
    public partial class MainWindow : Window
    {
        //////////////////////////////////////////////////////////////////////////////////////////////////// Constructor
        ////////////////////////////////////////////////////////////////////////////////////////// Public

        #region 생성자 - MainWindow()

        /// <summary>
        /// 생성자
        /// </summary>
        public MainWindow()
        {
            InitializeComponent();

            NameScope.SetNameScope(this, new NameScope());

            #region 이동 변환을 생성한다.

            TranslateTransform translateTransform = new TranslateTransform();

            RegisterName("translateTransform", translateTransform);

            #endregion
            #region 사각형을 생성한다.

            Rectangle rectangle = new Rectangle();

            rectangle.Width           = 30;
            rectangle.Height          = 30;
            rectangle.Fill            = Brushes.Blue;
            rectangle.RenderTransform = translateTransform;

            #endregion
            #region 캔버스를 생성한다.

            Canvas canvas = new Canvas();

            canvas.Width      = 400;
            canvas.Height     = 400;
            canvas.Background = Brushes.LightGray;

            canvas.Children.Add(rectangle);

            #endregion

            #region 폴리 베지어 세그먼트를 생성한다.

            PolyBezierSegment polyBezierSegment = new PolyBezierSegment();

            polyBezierSegment.Points.Add(new Point(35 , 0  ));
            polyBezierSegment.Points.Add(new Point(135, 0  ));
            polyBezierSegment.Points.Add(new Point(160, 100));
            polyBezierSegment.Points.Add(new Point(180, 190));
            polyBezierSegment.Points.Add(new Point(285, 200));
            polyBezierSegment.Points.Add(new Point(310, 100));

            #endregion
            #region 패스 피겨를 생성한다.

            PathFigure pathFigure = new PathFigure();

            pathFigure.StartPoint = new Point(10, 100);

            pathFigure.Segments.Add(polyBezierSegment);

            #endregion
            #region 패스 지오메트리를 생성한다.

            PathGeometry pathGeometry = new PathGeometry();

            pathGeometry.Figures.Add(pathFigure);

            pathGeometry.Freeze();

            #endregion
            #region 이동 X 애니메이션을 생성한다.

            DoubleAnimationUsingPath translateXAnimation = new DoubleAnimationUsingPath();

            translateXAnimation.PathGeometry = pathGeometry;
            translateXAnimation.Duration     = TimeSpan.FromSeconds(5);
            translateXAnimation.Source       = PathAnimationSource.X;

            Storyboard.SetTargetName(translateXAnimation, "translateTransform");
            Storyboard.SetTargetProperty(translateXAnimation, new PropertyPath(TranslateTransform.XProperty));

            #endregion
            #region 이동 Y 애니메이션을 생성한다.

            DoubleAnimationUsingPath translateYAnimation = new DoubleAnimationUsingPath();

            translateYAnimation.PathGeometry = pathGeometry;
            translateYAnimation.Duration     = TimeSpan.FromSeconds(5);
            translateYAnimation.Source       = PathAnimationSource.Y;

            Storyboard.SetTargetName(translateYAnimation, "translateTransform");
            Storyboard.SetTargetProperty(translateYAnimation, new PropertyPath(TranslateTransform.YProperty));

            #endregion
            #region 스토리보드를 생성한다.

            Storyboard storyboard = new Storyboard();

            storyboard.RepeatBehavior = RepeatBehavior.Forever;
            storyboard.AutoReverse    = true;

            storyboard.Children.Add(translateXAnimation);
            storyboard.Children.Add(translateYAnimation);

            #endregion

            Content = canvas;

            rectangle.Loaded += delegate(object sender, RoutedEventArgs e)
            {
                storyboard.Begin(this);
            };
        }

        #endregion
    }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

using System;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Media;

using System.Windows.Media.Animation;

using System.Windows.Shapes;

namespace TestProject

{

/// <summary>

/// 메인 윈도우

/// </summary>

public partial class MainWindow : Window

{

//////////////////////////////////////////////////////////////////////////////////////////////////// Constructor

////////////////////////////////////////////////////////////////////////////////////////// Public

#region 생성자 - MainWindow()

/// <summary>

/// 생성자

/// </summary>

public MainWindow()

{

InitializeComponent();

NameScope.SetNameScope(this, new NameScope());

#region 이동 변환을 생성한다.

TranslateTransform translateTransform = new TranslateTransform();

RegisterName("translateTransform", translateTransform);

#endregion

#region 사각형을 생성한다.

Rectangle rectangle = new Rectangle();

rectangle.Width = 30;

rectangle.Height = 30;

rectangle.Fill = Brushes.Blue;

rectangle.RenderTransform = translateTransform;

#endregion

#region 캔버스를 생성한다.

Canvas canvas = new Canvas();

canvas.Width = 400;

canvas.Height = 400;

canvas.Background = Brushes.LightGray;

canvas.Children.Add(rectangle);

#endregion

#region 폴리 베지어 세그먼트를 생성한다.

PolyBezierSegment polyBezierSegment = new PolyBezierSegment();

polyBezierSegment.Points.Add(new Point(35 , 0 ));

polyBezierSegment.Points.Add(new Point(135, 0 ));

polyBezierSegment.Points.Add(new Point(160, 100));

polyBezierSegment.Points.Add(new Point(180, 190));

polyBezierSegment.Points.Add(new Point(285, 200));

polyBezierSegment.Points.Add(new Point(310, 100));

#endregion

#region 패스 피겨를 생성한다.

PathFigure pathFigure = new PathFigure();

pathFigure.StartPoint = new Point(10, 100);

pathFigure.Segments.Add(polyBezierSegment);

#endregion

#region 패스 지오메트리를 생성한다.

PathGeometry pathGeometry = new PathGeometry();

pathGeometry.Figures.Add(pathFigure);

pathGeometry.Freeze();

#endregion

#region 이동 X 애니메이션을 생성한다.

DoubleAnimationUsingPath translateXAnimation = new DoubleAnimationUsingPath();

translateXAnimation.PathGeometry = pathGeometry;

translateXAnimation.Duration = TimeSpan.FromSeconds(5);

translateXAnimation.Source = PathAnimationSource.X;

Storyboard.SetTargetName(translateXAnimation, "translateTransform");

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

#endregion

#region 이동 Y 애니메이션을 생성한다.

DoubleAnimationUsingPath translateYAnimation = new DoubleAnimationUsingPath();

translateYAnimation.PathGeometry = pathGeometry;

translateYAnimation.Duration = TimeSpan.FromSeconds(5);

translateYAnimation.Source = PathAnimationSource.Y;

Storyboard.SetTargetName(translateYAnimation, "translateTransform");

Storyboard.SetTargetProperty(translateYAnimation, new PropertyPath(TranslateTransform.YProperty));

#endregion

#region 스토리보드를 생성한다.

Storyboard storyboard = new Storyboard();

storyboard.RepeatBehavior = RepeatBehavior.Forever;

storyboard.AutoReverse = true;

storyboard.Children.Add(translateXAnimation);

storyboard.Children.Add(translateYAnimation);

#endregion

Content = canvas;

rectangle.Loaded += delegate(object sender, RoutedEventArgs e)

{

storyboard.Begin(this);

};

}

#endregion

}

TestProject.zip