开通了园里的博客，总得写点东西，不然感觉对不起园主和园友了。呵呵。
好了，今天来个Silerlight动画相册的实例，希望对初学者有点帮助。
废话就不多说了，打开你的Vs2008，新建一个Silerlight应用程序，具体怎么新建，你可以去参考一下资料。
下一步，我们该做什么呢？
恩。先弄个界面出来吧。打开MainPage.XAML 当然，这里不一定是MainPage.XAML。具体视你的项目了。我这里初始页面是MainPage.XAML。
首先，我们先弄个布局。
用Grid布局吧，Silerlight下最灵活的布局方式.
放上这么一句话
< Grid x:Name = " LayoutRoot " Background = " White " Clip = " M0.5,0.5 L639.5,0.5 L639.5,479.5 L0.5,479.5 z " > </ Grid >
这段意思，我想大家都很清楚。要不是不清楚的话，可能是Grid的Clip这个属性吧。这个表示名字叫"LayoutRoot"的Grid的剪切区域，你也可以利用Blend 3来做布局。
好了，下面我该放一张图片了。做相册，怎么能没有图片呢？
完成后是这样的。
Code <Grid x:Name="LayoutRoot" Background="White" Clip="M0.5,0.5 L639.5,0.5 L639.5,479.5 L0.5,479.5 z"> <Image x:Name="Image1" Margin="0,0,0,0" Source="/Photo/Photo01_640480.JPG" Stretch="Fill" /></Grid> 好了，是不是感觉还少了点什么？来点提示文字吧 ，或是来点音乐也行啊。没问题，看下面，我们加入一个TextBlock和一个MediaElement进来。
最终效果：
Code <UserControl x:Class="Silverlight.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480"> <Grid x:Name="LayoutRoot" Background="White" Clip="M0.5,0.5 L639.5,0.5 L639.5,479.5 L0.5,479.5 z"> <!-- 相册的图片 --> <Image x:Name="Image1" Margin="0,0,0,0" Source="/Photo/Photo01_640480.JPG" Stretch="Fill" /> <!-- 相册的提示文字 --> <TextBlock Height="21.75" Margin="93,0,74,0" VerticalAlignment="Bottom" Text="照片的介绍文字" TextWrapping="Wrap" FontSize="16" Foreground="#FF323ECC" TextAlignment="Center" x:Name="labelText" FontWeight="Bold" FontFamily="Arial"/> <!-- 播放背景音乐 --> <MediaElement Source="/Media/title.wma" AutoPlay="True" Volume="1" HorizontalAlignment="Right" VerticalAlignment="Bottom" Width="25" Margin="0,0,34,8" Height="11" MediaEnded="MediaElement1_MediaEnded" x:Name="MediaElement1" /> </Grid></UserControl> 我说明一下：Silerlight应用程序页面都是在XAML文件表示，当然你也可以利用我们上面说Microsoft Expression Blend 3 可视化的来制作界面
MediaElement标签下，我们定义了一个MediaElement.MediaEnded 事件：MediaEnded="MediaElement1_MediaEnded"，表示当播放完成后要做什么。
Ok ，我们的界面做好了。先预览一下吧。
恩，感觉好不错。有图片了，有音乐了。
下面，我们就让它动起来。打开MainPage.xmal.cs文件，我们来代码实现动画。就是今天的主题了。
首先我们写一个让图片动起来的方法如下：
Code // 宣告一个动画型别的变数。 Storyboard sb; // 建立一个用来储存照片相对路径的阵列。 string[] photoArray = new string[12]; // 建立一个用来储存照片说明文字的阵列。 string[] photoToolTipArray = new string[12]; // 建立一个变数来代表目前所要显示之照片的索引。 int photoIndex = 0; private void LoadPhotos() { } 接下来，具体实现这个方法：
Code private void LoadPhotos() { // 将各张照片的相对路径存入阵列中。 photoArray[0] = "/Photo/Photo01_640480.JPG"; photoArray[1] = "/Photo/Photo02_640480.JPG"; photoArray[2] = "/Photo/Photo03_640480.JPG"; photoArray[3] = "/Photo/Photo04_640480.JPG"; photoArray[4] = "/Photo/Photo05_640480.JPG"; photoArray[5] = "/Photo/Photo06_640480.JPG"; photoArray[6] = "/Photo/Photo07_640480.JPG"; photoArray[7] = "/Photo/Photo08_640480.JPG"; photoArray[8] = "/Photo/Photo09_640480.JPG"; photoArray[9] = "/Photo/Photo10_640480.JPG"; photoArray[10] = "/Photo/Photo11_640480.JPG"; photoArray[11] = "/Photo/Photo12_640480.JPG"; // 将各张照片的说明文字存入阵列中。 photoToolTipArray[0] = "图片1
"; photoToolTipArray[1] = "图片2"; photoToolTipArray[2] = "图片3"; photoToolTipArray[3] = "图片4"; photoToolTipArray[4] = "图片5"; photoToolTipArray[5] = "图片6"; photoToolTipArray[6] = "图片7"; photoToolTipArray[7] = "图片8"; photoToolTipArray[8] = "图片9"; photoToolTipArray[9] = "图片10"; photoToolTipArray[10] = "图片11"; photoToolTipArray[11] = "图片12"; // 显示照片的介绍文字。 labelText.Text = (photoIndex + 1) + "∕" + photoArray.Count() + "－" + photoToolTipArray[photoIndex]; // 建立转换群组。 TransformGroup tg = new TransformGroup(); // 建立 ScaleTransform 物件。 ScaleTransform st = new ScaleTransform() { ScaleX = 1, ScaleY = 1 }; // 将 ScaleTransform 物件加入转换群组中。 tg.Children.Add(st); // 将转换群组指派给 Image 控制项的 RenderTransform 属性，以便套用转换。 Image1.RenderTransform = tg; // 设定 Image 控制项之转换的中心点。 Image1.RenderTransformOrigin = new Point(0.5, 0.5); // 建立动画物件。 sb = new Storyboard(); // 设定当动画播放完成时所要执行的事件处理常式。 sb.Completed += new EventHandler(sb_Completed); // 建立 DoubleAnimation 类型的动画。 DoubleAnimation animationScaleX = new DoubleAnimation(); DoubleAnimation animationScaleY = new DoubleAnimation(); // 设定开始时间。 animationScaleX.BeginTime = animationScaleY.BeginTime = new TimeSpan(0, 0, 0, 0, 0); // 设定动画的时间长短。 animationScaleX.Duration = animationScaleY.Duration = new Duration(TimeSpan.FromMilliseconds(3500)); sb.Children.Add(animationScaleX); sb.Children.Add(animationScaleY); // 以 Image 控制项做为动画的目标物件。 Storyboard.SetTarget(animationScaleX, Image1); Storyboard.SetTarget(animationScaleY, Image1); // 设定动画的目标属性。 Storyboard.SetTargetProperty(animationScaleX, new PropertyPath("(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)")); Storyboard.SetTargetProperty(animationScaleY, new PropertyPath("(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)")); // 设定目标属性的目标值，也就是放大的比例。 animationScaleX.To = 2; animationScaleY.To = 2; // 播放动画。 sb.Begin(); } //动画完成后的事件 private void sb_Completed(object sender, EventArgs e) { sb.Stop(); photoIndex++; if (photoIndex > photoArray.Count() - 1) { photoIndex = 0; } // 变换照片。 Image1.Source = new BitmapImage(new Uri(photoArray[photoIndex], UriKind.Relative)); // 变换介绍文字。 labelText.Text = (photoIndex + 1) + "∕" + photoArray.Count() + "－" + photoToolTipArray[photoIndex]; // 再次播放动画来形成循环的效果。 sb.Begin(); } Ok，我们还差一点东西，那就是程序启动时，让它动起来。
加上这么一段代码：
public MainPage() { InitializeComponent(); // 开始动画啦。。呵呵 LoadPhotos(); }
万事OK，现在来看下。美哉。动画出来了，还有音乐。呵呵。
希望和大家多多交流。
参考资料：章立民的《大事讲堂Silerlight 2.0 开发技术精粹C#版》