方法 : 要素のスピンを設定する
この例では、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-D 変換のサンプルを参照してください。