概述

Silverlight 2 Beta 1版本發(fā)布了，無論從Runtime還是Tools都給我們帶來了很多的驚喜，如支持框架語言Visual Basic, Visual C#, IronRuby, Ironpython，對JSON、Web Service、WCF以及Sockets的支持等一系列新的特性。《一步一步學(xué)Silverlight 2系列》文章將從Silverlight 2基礎(chǔ)知識、數(shù)據(jù)與通信、自定義控件、動畫、圖形圖像等幾個方面帶您快速進(jìn)入Silverlight 2開發(fā)。

本文我們再實現(xiàn)一個圖形圖像實例——圖片播放，并利用Storyboard實現(xiàn)一些動畫效果。

今天我也當(dāng)一回“標(biāo)題當(dāng)”:)，其實就是實現(xiàn)一個簡單的圖片播放器，跟“功夫之王”劇照半點關(guān)系也沒有，只不過我上網(wǎng)找了幾張即將播出的的電影《功夫之王》的劇照，作為我們的示例圖片。

實現(xiàn)效果

最終我們實現(xiàn)的效果如下，初始界面

點擊左邊或者右邊小圖片播放

再來一張播放中的

主要實現(xiàn)

在單擊時動態(tài)改變圖片的Source屬性：

void Play() {currentImg.Source = new BitmapImage(new Uri(index.ToString() + ".png", UriKind.Relative));int left = index == MIN ? MAX : index - 1;leftImg.Source = new BitmapImage(new Uri(left.ToString() + ".png", UriKind.Relative));int right = index == MAX ? MIN : index + 1;rightImg.Source = new BitmapImage(new Uri(right.ToString() + ".png", UriKind.Relative)); }

并通過Storyboard來改變Transform的一些值實現(xiàn)動畫效果：

<Canvas.Resources><Storyboard x:Name="myStoryboard"><DoubleAnimationStoryboard.TargetName="myTransform"Storyboard.TargetProperty="AngleY"From="0" To="180" Duration="0:0:5" RepeatBehavior="1x"/><DoubleAnimationStoryboard.TargetName="leftScaleTransform"Storyboard.TargetProperty="ScaleX"From="0" To="1" Duration="0:0:5" RepeatBehavior="1x"/><DoubleAnimationStoryboard.TargetName="leftScaleTransform"Storyboard.TargetProperty="ScaleY"From="0" To="1" Duration="0:0:5" RepeatBehavior="1x"/><DoubleAnimationStoryboard.TargetName="rightScaleTransform"Storyboard.TargetProperty="ScaleX"From="0" To="1" Duration="0:0:5" RepeatBehavior="1x"/><DoubleAnimationStoryboard.TargetName="rightScaleTransform"Storyboard.TargetProperty="ScaleY"From="0" To="1" Duration="0:0:5" RepeatBehavior="1x"/></Storyboard> </Canvas.Resources

大家可以從這里下載完整示例代碼。

結(jié)束語

本文實現(xiàn)了一個簡單的圖片播放器，并利用Storyboard實現(xiàn)一些動畫效果。

?

?

轉(zhuǎn)載出處聲明：

作者：TerryLee
出處：http://terrylee.cnblogs.com
原文鏈接：http://www.cnblogs.com/Terrylee/archive/2008/03/21/Silverlight2-step-by-step-part32.html

轉(zhuǎn)載于:https://www.cnblogs.com/ZhangHuaning/archive/2010/04/20/1716292.html

總結(jié)

以上是生活随笔為你收集整理的一步一步学Silverlight 2系列（32）：图形图像综合实例—“功夫之王”剧照播放_转载...的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。