Silverlight图片公告栏正式版

Silverlight图片公告栏正式版2011-09-23 cnblogs Jerry Chin上星期贴出了个Silverlight图片公告控件，当时只是初步的实现了效果。今天抽空将它功能完善了并推出正式版。

正式版加入了切换图片动画效果，读取xml文件不再依赖WebService，数字按钮响应功能修正。这次重写了大部分代码，Silverlight的结构也做出了修改，并且对程序进行了“瘦身”，或许细心的人也发现了上次版本中，实现的功能只是很简单可是文件却有300k，经过“瘦身”后Silverlight程序只有8k了。

制作所需工具

Visual Studio 2008

Microsoft Expression Blend 2.5 March 2008 Preview

这次我就不制作视频了

改用WebClient来读取Xml文件

读取xml代码

//建立读取xml文件的WebClient
WebClient xmlClient = new WebClient （）;
xmlClient.DownloadStringCompleted += new DownloadStringCompletedEventHandler（xmlClient_DownloadStringCompleted）;
xmlClient.DownloadStringAsync（new Uri（HtmlPage.Document.DocumentUri, "XML/Placard.xml"））;

我们再看看Xaml结构上修改了什么。

Placard.xaml文件中Grid代码

<Grid x:Name="LayoutRoot" Background="White" Loaded="Placard_Loaded">
<Image x:Name="image" Cursor="Hand" Width="260" Height="195" OpacityMask="#FF000000"/>
<Canvas x:Name="temp" Margin="0,0,0,0" Width="260" Height="195"/>
<StackPanel Height="17" x:Name="Foot" VerticalAlignment="Bottom" Orientation="Horizontal">
<Rectangle Height="17" Width="0" x:Name="g_rect" Fill="#FF000000">
<Rectangle.OpacityMask>
<LinearGradientBrush EndPoint="0.688000023365021,0.474000006914139" StartPoint="0.0970000028610229,0.526000022888184">
<GradientStop Color="#00000000"/>
<GradientStop Color="#FF000000" Offset="1"/>
</LinearGradientBrush>
</Rectangle.OpacityMask>
</Rectangle>
<TextBlock Height="17" Width="20" Text="TextBlock" TextWrapping="Wrap" Foreground="#00000000" x:Name="mouseindex" Margin="-70,0,0,0"/>
<TextBlock Height="17" x:Name="currentindex" Width="20" Foreground="#00000000" Text="TextBlock" TextWrapping="Wrap" Margin="-110,0,0,0"/>
</StackPanel>
<！--Top用于捕获鼠标点击-->
<Rectangle HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Top" Fill="#00000000" Width="260" Height="178" x:Name="Top" Cursor="Hand" MouseEnter="Top_MouseEnter" MouseLeave="Top_MouseLeave" MouseLeftButtonUp="Top_MouseLeftButtonUp"/>
</Grid>