다음을 통해 공유

방법: AnimationClock을 사용하여 속성에 애니메이션 효과 적용

  • 아티클

이 예제에서는 Clock 개체를 사용하여 속성에 애니메이션 효과를 적용하는 방법을 보여 줍니다.

다음과 같은 세 가지 방법으로 종속성 속성에 애니메이션 효과를 적용할 수 있습니다.

Storyboard 개체와 BeginAnimation 메서드를 사용하면 시계를 직접 만들어 배포하지 않고도 속성에 애니메이션 효과를 적용할 수 있습니다. 시계는 자동으로 만들어져 배포됩니다. 예제를 보려면 방법: Storyboard를 사용하여 속성에 애니메이션 효과 주기 및 방법: Storyboard를 사용하지 않고 속성에 애니메이션 효과 주기를 참조하십시오.

예제

다음 예제에서는 AnimationClock을 만들어서 두 개의 비슷한 속성에 적용하는 방법을 보여 줍니다.

'
'    This example shows how to create and apply
'    an AnimationClock.
'


Imports System
Imports System.Windows
Imports System.Windows.Controls
Imports System.Windows.Media
Imports System.Windows.Shapes
Imports System.Windows.Media.Animation


Namespace Microsoft.Samples.Animation.TimingBehaviors
    Public Class AnimationClockExample
        Inherits Page

        Private myScaleTransform As ScaleTransform

        Public Sub New()

            Me.WindowTitle = "Opacity Animation Example"
            Me.Background = Brushes.White
            Dim myStackPanel As New StackPanel()
            myStackPanel.Margin = New Thickness(20)

            ' Create a button that with a ScaleTransform.
            ' The ScaleTransform will animate when the
            ' button is clicked.
            Dim myButton As New Button()
            myButton.Margin = New Thickness(50)
            myButton.HorizontalAlignment = HorizontalAlignment.Left
            myButton.Content = "Click Me"
            myScaleTransform = New ScaleTransform(1,1)
            myButton.RenderTransform = myScaleTransform


            ' Associate an event handler with the
            ' button's Click event.
            AddHandler myButton.Click, AddressOf myButton_Clicked

            myStackPanel.Children.Add(myButton)
            Me.Content = myStackPanel
        End Sub

        ' Create and apply and animation when the button is clicked.
        Private Sub myButton_Clicked(ByVal sender As Object, ByVal e As RoutedEventArgs)

            ' Create a DoubleAnimation to animate the
            ' ScaleTransform.
            Dim myAnimation As New DoubleAnimation(1, 5, New Duration(TimeSpan.FromSeconds(5))) ' "To" value -  "From" value
            myAnimation.AutoReverse = True

            ' Create a clock the for the animation.
            Dim myClock As AnimationClock = myAnimation.CreateClock()

            ' Associate the clock the ScaleX and
            ' ScaleY properties of the button's
            ' ScaleTransform.
            myScaleTransform.ApplyAnimationClock(ScaleTransform.ScaleXProperty, myClock)
            myScaleTransform.ApplyAnimationClock(ScaleTransform.ScaleYProperty, myClock)
        End Sub
    End Class
End Namespace

/*
    This example shows how to create and apply
    an AnimationClock.
*/

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


namespace Microsoft.Samples.Animation.TimingBehaviors
{
    public class AnimationClockExample : Page
    {

        ScaleTransform myScaleTransform;

        public AnimationClockExample()
        {

            this.WindowTitle = "Opacity Animation Example";
            this.Background = Brushes.White;
            StackPanel myStackPanel = new StackPanel();
            myStackPanel.Margin = new Thickness(20);

            // Create a button that with a ScaleTransform.
            // The ScaleTransform will animate when the
            // button is clicked.
            Button myButton = new Button();
            myButton.Margin = new Thickness(50);
            myButton.HorizontalAlignment = HorizontalAlignment.Left;
            myButton.Content = "Click Me";           
            myScaleTransform = new ScaleTransform(1,1);
            myButton.RenderTransform = myScaleTransform;


            // Associate an event handler with the
            // button's Click event.
            myButton.Click += new RoutedEventHandler(myButton_Clicked);

            myStackPanel.Children.Add(myButton);
            this.Content = myStackPanel;
        }

        // Create and apply and animation when the button is clicked.
        private void myButton_Clicked(object sender, RoutedEventArgs e)
        {

            // Create a DoubleAnimation to animate the
            // ScaleTransform.
            DoubleAnimation myAnimation = 
                new DoubleAnimation(
                    1, // "From" value
                    5, // "To" value 
                    new Duration(TimeSpan.FromSeconds(5))
                );
            myAnimation.AutoReverse = true;

            // Create a clock the for the animation.
            AnimationClock myClock = myAnimation.CreateClock();            

            // Associate the clock the ScaleX and
            // ScaleY properties of the button's
            // ScaleTransform.
            myScaleTransform.ApplyAnimationClock(
                ScaleTransform.ScaleXProperty, myClock);
            myScaleTransform.ApplyAnimationClock(
                ScaleTransform.ScaleYProperty, myClock);
        }
    }
}

Clock이 시작된 후 이를 대화식으로 제어하는 방법을 보여 주는 예제는 방법: 대화형으로 Clock 제어를 참조하십시오.

참고 항목

작업

방법: Storyboard를 사용하여 속성에 애니메이션 효과 주기

방법: Storyboard를 사용하지 않고 속성에 애니메이션 효과 주기

개념

속성 애니메이션 기술 개요