이 설명서는 보관되지만 유지 되지 않습니다.

SplinePointKeyFrame 클래스

업데이트: 2007년 11월

이전 키 프레임의 Point 값에서 자체 Value까지 스플라인 보간을 사용하여 애니메이션을 적용합니다.

네임스페이스:  System.Windows.Media.Animation
어셈블리:  PresentationCore(PresentationCore.dll)
XAML의 XMLNS: http://schemas.microsoft.com/winfx/xaml/presentation

public class SplinePointKeyFrame : PointKeyFrame
public class SplinePointKeyFrame extends PointKeyFrame
public class SplinePointKeyFrame extends PointKeyFrame
<SplinePointKeyFrame .../>

이 클래스는 PointAnimationUsingKeyFrames와 함께 PointKeyFrameCollection의 일부로 사용되어 키 프레임 집합에 대해 Point 속성 값에 애니메이션을 적용합니다.

키 프레임은 자신이 속한 PointAnimationUsingKeyFrames의 세그먼트를 정의합니다. 각 키 프레임에는 대상 ValueKeyTime이 있습니다. KeyTime은 키 프레임의 Value에 도달해야 하는 시간을 지정합니다. 키 프레임에는 이전 키 프레임의 대상 값에서 자체 대상 값까지 애니메이션이 적용됩니다. 애니메이션은 이전 키 프레임이 끝나면 시작되고 자체 키 프레임에 도달하면 종료됩니다.

SplinePointKeyFrame 같은 스플라인 키 프레임은 값 간에 KeySpline 속성에 의해 결정되는 가변 전환을 만듭니다. 스플라인 보간을 사용하면 가속이나 감속 등 보다 현실적인 타이밍 효과를 적용할 수 있습니다.

이 예제에서는 PointAnimationUsingKeyFrames 클래스를 사용하여 Point에 애니메이션 효과를 주는 방법을 보여 줍니다.

다음 예제에서는 삼각형 경로를 따라 타원을 이동합니다. 예제에서는 PointAnimationUsingKeyFrames 클래스를 사용하여 EllipseGeometryCenter 속성에 애니메이션 효과를 줍니다. 이 애니메이션에서는 다음과 같은 방식으로 세 가지 키 프레임을 사용합니다.

  1. 처음 0.5초 동안에는 LinearPointKeyFrame 클래스의 인스턴스를 사용하여 시작 위치부터 일정한 속도로 경로를 따라 타원을 이동합니다. LinearPointKeyFrame과 같은 선형 키 프레임은 값 사이에 부드러운 선형 보간을 생성합니다.

  2. 다음 0.5초가 끝날 무렵에는 DiscretePointKeyFrame 클래스의 인스턴스를 사용하여 경로를 따라 타원을 급격하게 다음 위치로 이동합니다. DiscretePointKeyFrame과 같은 불연속 키 프레임을 사용하면 값 간에 급격한 점프가 생성됩니다.

  3. 마지막 2초 동안은 SplinePointKeyFrame 클래스의 인스턴스를 사용하여 타원을 원래 시작 위치로 이동합니다. SplinePointKeyFrame 같은 스플라인 키 프레임은 KeySpline 속성 값에 따라 값 사이의 가변 전환을 만듭니다. 이 예제의 경우 애니메이션이 처음에는 서서히 시작되다가 시간 세그먼트의 끝 부분으로 갈수록 빠르게 진행됩니다.

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

namespace Microsoft.Samples.KeyFrameExamples
{
    /// <summary>
    /// This example shows how to use the PointAnimationUsingKeyFrames class
    /// to animate the position of an object.
    /// </summary>
    public class PointAnimationUsingKeyFramesExample : Page
    {
        public PointAnimationUsingKeyFramesExample()
        {
            Title = "PointAnimationUsingKeyFrames Example";
            Background = Brushes.White;
            Margin = new Thickness(20);

            // Create a NameScope for this page so that
            // Storyboards can be used.
            NameScope.SetNameScope(this, new NameScope());

            // Create an EllipseGeometry.
            EllipseGeometry myAnimatedEllipseGeometry =
                new EllipseGeometry(new Point(200,100), 15, 15);

            // Assign the EllipseGeometry a name so that
            // it can be targeted by a Storyboard.
            this.RegisterName(
                "MyAnimatedEllipseGeometry", myAnimatedEllipseGeometry);

            // Create a Path element to display the geometry.
            Path aPath = new Path();   
            aPath.Fill = Brushes.Blue;
            aPath.Data = myAnimatedEllipseGeometry;

            // Create a Canvas to contain the path.
            Canvas containerCanvas = new Canvas();
            containerCanvas.Width = 500;
            containerCanvas.Height = 400;
            containerCanvas.Children.Add(aPath);

            // Create a PointAnimationUsingKeyFrames to
            // animate the EllipseGeometry.
            PointAnimationUsingKeyFrames centerPointAnimation
                = new PointAnimationUsingKeyFrames();
            centerPointAnimation.Duration = TimeSpan.FromSeconds(5);

            // Animate from the starting position to (100,300)
            // over the first half-second using linear
            // interpolation.
            centerPointAnimation.KeyFrames.Add(
                new LinearPointKeyFrame(
                    new Point(100, 300), // Target value (KeyValue)
                    KeyTime.FromTimeSpan(TimeSpan.FromSeconds(0.5))) // KeyTime
                );

            // Animate from (100,300) (the value of the previous key frame) 
            // to (400,300) at 1 second using discrete interpolation.
            // Because the interpolation is discrete, the ellipse will appear
            // to "jump" to (400,300) at 1 second.
            centerPointAnimation.KeyFrames.Add(
                new DiscretePointKeyFrame(
                    new Point(400, 300), // Target value (KeyValue)
                    KeyTime.FromTimeSpan(TimeSpan.FromSeconds(1))) // KeyTime
                );

            // Animate from (400,300) (the value of the previous key frame) to (200,100)
            // over two seconds, starting at 1 second (the key time of the
            // last key frame) and ending at 3 seconds.
            centerPointAnimation.KeyFrames.Add(
                new SplinePointKeyFrame(
                    new Point(200, 100), // Target value (KeyValue)
                    KeyTime.FromTimeSpan(TimeSpan.FromSeconds(3)), // KeyTime
                    new KeySpline(0.6, 0.0, 0.9, 0.0) // KeySpline
                    )
                );

            // Set the animation to repeat forever. 
            centerPointAnimation.RepeatBehavior = RepeatBehavior.Forever;

            // Set the animation to target the Center property
            // of the object named "MyAnimatedEllipseGeometry".
            Storyboard.SetTargetName(centerPointAnimation, "MyAnimatedEllipseGeometry");
            Storyboard.SetTargetProperty(
                centerPointAnimation, new PropertyPath(EllipseGeometry.CenterProperty));

            // Create a storyboard to apply the animation.
            Storyboard ellipseStoryboard = new Storyboard();
            ellipseStoryboard.Children.Add(centerPointAnimation);

            // Start the storyboard when the Path loads.
            aPath.Loaded += delegate(object sender, RoutedEventArgs e)
            {
                ellipseStoryboard.Begin(this);
            };

            Content = containerCanvas;
        }

    }
}


<Page 
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  Background="White" Margin="20">
  <Canvas Width="400" Height="400">
    <Path Fill="Blue">
      <Path.Data>

        <!-- Describes an ellipse. -->
        <EllipseGeometry x:Name="MyAnimatedEllipseGeometry"
          Center="200,100" RadiusX="15" RadiusY="15" />
      </Path.Data>
      <Path.Triggers>
        <EventTrigger RoutedEvent="Path.Loaded">
          <BeginStoryboard>
            <Storyboard>

              <!-- Animating the Center property uses 3 KeyFrames, which animate
                   the ellipse allong a triangular path. -->
              <PointAnimationUsingKeyFrames
                Storyboard.TargetProperty="Center"
                Storyboard.TargetName="MyAnimatedEllipseGeometry"
                Duration="0:0:5" RepeatBehavior="Forever">

                <!-- Over the first half second, Using a LinearPointKeyFrame, the ellipse 
                     moves steadily from its starting position along the first line of the 
                     trianglar path.  -->
                <LinearPointKeyFrame 
                  KeyTime="0:0:0.5"
                  Value="100,300" />

                <!-- Using a DiscretePointKeyFrame, the ellipse suddenly changes position
                     after the first second of the animation. -->
                <DiscretePointKeyFrame 
                  KeyTime="0:0:1"
                  Value="400,300" />

                <!-- Using a SplinePointKeyFrame, the ellipse moves back to its starting
                     position. It moves slowly at first and then speeds up. This key frame 
                     takes 2 seconds to complete. -->
                <SplinePointKeyFrame 
                  KeySpline="0.6,0.0 0.9,0.00" 
                  KeyTime="0:0:3"
                  Value="200,100" />
              </PointAnimationUsingKeyFrames>
            </Storyboard>
          </BeginStoryboard>
        </EventTrigger>
      </Path.Triggers>
    </Path>
  </Canvas>
</Page>


전체 샘플을 보려면 KeyFrame 애니메이션 샘플을 참조하십시오.

다른 애니메이션 예제와의 일관성을 위해 이 예제의 코드 버전에서는 Storyboard 개체를 사용하여 PointAnimationUsingKeyFrames를 적용합니다. 하지만 코드에 단일 애니메이션을 적용하는 경우 Storyboard를 사용하는 대신 BeginAnimation 메서드를 사용하면 더 간편합니다. 예제를 보려면 방법: Storyboard를 사용하지 않고 속성에 애니메이션 효과 주기를 참조하십시오.

이 형식의 모든 공용 static(Visual Basic의 경우 Shared) 멤버는 스레드로부터 안전합니다. 인터페이스 멤버는 스레드로부터 안전하지 않습니다.

Windows Vista

.NET Framework 및 .NET Compact Framework에서 모든 플랫폼의 전체 버전을 지원하지는 않습니다. 지원되는 버전의 목록을 보려면 .NET Framework 시스템 요구 사항을 참조하십시오.

.NET Framework

3.5, 3.0에서 지원
표시: