所謂旋轉動畫(RotateTransform)也就是一個元素以一個座標點為旋轉中心點旋轉,在使用旋轉動畫(RotateTransform)的時候需要注意的有兩點:旋轉中心點(Center)和旋轉角度(Angle)。
小例子設定了一個按照角度變化旋轉,一個按照時間變化來旋轉
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<TextBlock Grid.Row="0"
Text="Frame-Based"
FontSize="{StaticResource PhoneFontSizeLarge}"
HorizontalAlignment="Center"
VerticalAlignment="Center"
RenderTransformOrigin="0.5 0.5">
<TextBlock.RenderTransform>
<RotateTransform x:Name="rotate1" />
</TextBlock.RenderTransform>
</TextBlock>
<TextBlock Grid.Row="1"
Text="Time-Based"
FontSize="{StaticResource PhoneFontSizeLarge}"
HorizontalAlignment="Center"
VerticalAlignment="Center"
RenderTransformOrigin="0.5 0.5">
<TextBlock.RenderTransform>
<RotateTransform x:Name="rotate2" />
</TextBlock.RenderTransform>
</TextBlock>
<Button Grid.Row="2"
Content="暫停 5 秒"
HorizontalAlignment="Center"
Click="OnButtonClick" />
</Grid>
using System;
using System.Threading;
using System.Windows;
using System.Windows.Media;
using Microsoft.Phone.Controls;
namespace FrameBasedVsTimeBased
{
public partial class MainPage : PhoneApplicationPage
{
DateTime startTime;
public MainPage()
{
InitializeComponent();
startTime = DateTime.Now;
CompositionTarget.Rendering += OnCompositionTargetRendering;
//當此事件發生時,表示存在一個可視架構可用於呈現到 Silverlight 內容圖面。
//然後,可以在處理常式中一幀一幀地修改應用程式的可視對象或任何其他方面的內容
}
void OnCompositionTargetRendering(object sender, EventArgs args)
{
// Frame-based
rotate1.Angle = (rotate1.Angle + 0.2) % 360;//設定順時針旋轉角度
// Time-based
TimeSpan elapsedTime = DateTime.Now - startTime;
rotate2.Angle = (elapsedTime.TotalMinutes * 360) % 360;
}
//暫停5秒
void OnButtonClick(object sender, RoutedEventArgs args)
{
Thread.Sleep(5000);
}
}
}