방법: 현재 위치에서 요소가 회전하도록 만들기
업데이트: 2007년 11월
이 예제에서는 RotateTransform 및 DoubleAnimation을 사용하여 요소를 회전하는 방법을 보여 줍니다.
다음 예제에서는 요소의 RenderTransform 속성에 RotateTransform을 적용합니다. 이 예제에서는 DoubleAnimation을 사용하여 RotateTransform의 Angle에 애니메이션 효과를 줍니다. 이 예제에서는 현재 위치에서 요소를 회전하기 위해 요소의 RenderTransformOrigin 속성을 (0.5, 0.5) 지점으로 설정합니다.
예제
<!-- RotateAboutCenterExample.xaml
This example shows how to make an element spin
about its center. -->
<Page
xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
x:Class="Microsoft.Samples.Animation.RotateAboutCenterExample"
WindowTitle="Rotate About Center Example">
<StackPanel Margin="50">
<Button
RenderTransformOrigin="0.5,0.5"
HorizontalAlignment="Left">
Hello,World
<Button.RenderTransform>
<RotateTransform x:Name="MyAnimatedTransform" Angle="0" />
</Button.RenderTransform>
<Button.Triggers>
<EventTrigger RoutedEvent="Button.Click">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="MyAnimatedTransform"
Storyboard.TargetProperty="(RotateTransform.Angle)"
From="0.0" To="360" Duration="0:0:1" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Button.Triggers>
</Button>
</StackPanel>
</Page>
추가 변환 예제를 비롯하여 전체 샘플을 보려면 2차원 변환 샘플을 참조하십시오.