動畫Storyboard

DoubleAnimation是“Double兼容類型(Double、Float、int等)值從**變爲**”的動畫,Storyboard.TargetName屬性爲動畫作用的控件名,Storyboard.TargetProperty爲作用的控件屬性名,From爲變化的起始值,To爲變化的結束值。

DoubleAnimation其他屬性,AutoReverse自動反向播放;

RepeatBehavior=“Forever”永遠重複播放(在不需要的時候儘快停止,否則可能會導致計算機無法進入省電模式),如果想重複三次則設置爲“3x”;

Duration:動畫在From、To值之間變化時的持續時長

<pre name="code" class="html"><Page.Resources>
	<Storyboard x:Name="sb1">
		<DoubleAnimation Storyboard.TargetName="st1" Storyboard.TargetProperty="ScaleX" From="0" To="3" AutoReverse="True"></DoubleAnimation>
	</Storyboard>
	<Storyboard x:Name="sb2">
		<DoubleAnimation Storyboard.TargetName="pp1" Storyboard.TargetProperty="RotationY" From="0" To="360" Duration="00:00:03"></DoubleAnimation>
	</Storyboard>
</Page.Resources>
<Grid>
	<Button>
		<Button.RenderTransform>
			<ScaleTansform x:Name="st1"></ScaleTansform >
		</Button.RenderTransform>
		<Button.Projection>
			<ScaleTansform x:Name="pp1" RotationY="30"></ScaleTansform >
		</Button.Projection>
	</Button>
</Grid>

sb1.Begin();

除了DoubleAnimation之外,還有很多其他動畫,這些動畫都從TimeLine類繼承,都有的屬性:AutoReserve、RepeatBehavior、Duration、Completed事件(播放完成)、BeginTime(延遲播放,不是立即播放)。

指定EasingFunction屬性可以設定動畫的緩動曲線,BounceEase效果等。

圖片翻轉代碼:

<pre name="code" class="html"><Page.Resources>
	<Storyboard x:Name="sbpp1">
		<DoubleAnimation Storyboard.TargetName="ppImg" Storyboard.TargetProperty="RotationX" From="0" To="90"></DoubleAnimation>
	</Storyboard>
	<Storyboard x:Name="sbpp2">
		<DoubleAnimation Storyboard.TargetName="ppImg" Storyboard.TargetProperty="RotationX" From="90" To="0"></DoubleAnimation>
	</Storyboard>
</Page.Resources>
<Grid>
	<Image Name="imgMM" Source="ms-appx:///Images/1.jpg">
		<Image.Projection>
			<PlaneProjection x:Name="ppImg"></PlaneProjection>
		</Image.Projection>
	</Image>
</Grid>


private void sbpp1_Completed(object sender, object e)
{
	imgMM.Source=new BitmapImage(new Uri("ms-appx:///Images/2.jpg"));
	sbpp2.Begin();
}
private void imgMM_Tapped(object sender, object e)
{
	sbpp1.Begin();
}



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章