Silverlight加載界面實(shí)現(xiàn)方法解析
Silverlight加載界面的實(shí)現(xiàn)方法在這篇文章中將會(huì)為大家詳細(xì)介紹。希望對(duì)一些又需要的朋友men有些幫助。在一個(gè)解決方案中,有SplashScreenSourceweb和SplashScreenSource兩個(gè)項(xiàng)目。#t#
要往silverlight中加入自定義裝載界面,需要加入到SplashScreenSourceweb項(xiàng)目中,這樣,自定義裝載界面就不會(huì)和其它xaml文件一起打包到silverlight程序包中。
Silverlight加載界面步驟如下:
1.右擊silverlightapplicationweb項(xiàng)目,選擇屬性,選擇啟動(dòng)選項(xiàng),把SplashScreenSourceTestPage.html設(shè)為啟動(dòng)頁(yè)面。
2.右擊silverlightapplicationweb項(xiàng)目,選擇添加新項(xiàng),選擇添加一個(gè)Silverlight JScript 頁(yè),命名為SplashScreen.xaml。
3.打開(kāi)SplashScreen.xaml,換成如下代碼:
- < Canvas
- xmlns="http://schemas.microsoft.
com/client/2007"- xmlns:x="http://schemas.
microsoft.com/winfx/2006/xaml"- x:Name="parentCanvas"
- Width="850"
- Height="600"
- Background="OldLace"
- >
- < Canvas Canvas.Top="228.834"
Canvas.Left="246.329" Width="357"
Height="31.379">- < Rectangle Width="27.545"
Height="1" x:Name="uxProgress"
Canvas.Top="29.545" Canvas.Left="1.4">- < Rectangle.RenderTransform>
- < TransformGroup>
- < ScaleTransform x:Name="uxProgressBar"
ScaleX="1" ScaleY="0"/>- < SkewTransform AngleX="0" AngleY="0"/>
- < RotateTransform Angle="270"/>
- < TranslateTransform X="0" Y="0"/>
- < /TransformGroup>
- < /Rectangle.RenderTransform>
- < Rectangle.Fill>
- < LinearGradientBrush EndPoint=
"1,0.5" StartPoint="0,0.5">- < GradientStop Color="#FFFFFFFF"
Offset="1"/>- < GradientStop Color="#FFFFFFFF"
Offset="0"/>- < GradientStop Color="#FF2975D0"
Offset="0.28"/>- < GradientStop Color="#FF2975D0"
Offset="0.72"/>- < /LinearGradientBrush>
- < /Rectangle.Fill>
- < /Rectangle>
- < TextBlock x:Name="uxStatus" Height="25"
Canvas.Left="125" Text="Loading..."
TextWrapping="Wrap" Canvas.Top="4.16"/>- < Path Width="356.85" Height="1"
Fill="#FF3A3A3A" Stretch="Fill"
Stroke="#FF000000" Canvas.Top="0"
Data="M0,170.5 L356.84209,170.5"
Opacity="0.35"/>- < Path Width="1.662" Height="29.03"
Fill="#FF3A3A3A" Stretch="Fill"
Stroke="#FF000000" Canvas.Top="0.48"
Canvas.Left="0.2" Data="M360,168 L360,0"
Opacity="0.35" />- < Path Width="357.84" Height="1"
Fill="#FF3A3A3A" Stretch="Fill"
Stroke="#FF000000" Canvas.Top="29"
Data="M0,170.5 L356.84209,170.5" Opacity="0.35"/>- < Path Width="358.85" Height="1" Fill="#FFA2A2A2"
Stretch="Fill" Stroke="#FF000000" Canvas.Top="30"
Data="M0,170.5 L356.84209,170.5" Opacity="0.25"/>- < Path Width="1.662" Height="30" Fill="#FF3A3A3A"
Stretch="Fill" Stroke="#FF000000"
Canvas.Left="356.01" Data="M360,168 L360,0"
Opacity="0.35" Canvas.Top="-0.498"/>- < Path Width="1" Height="31" Fill="#FFA2A2A2"
Stretch="Fill" Stroke="#FF000000"
Canvas.Left="357.333" Data="M360,168 L360,0"
Opacity="0.245" Canvas.Top="-0.498" />- < /Canvas>
- < /Canvas>
Silverlight加載界面4.打開(kāi)SplashScreenSourceTestPage.html,把代碼
- < param name="source"
value="ClientBin/Splash
ScreenSource.xap"/>
改成
- < param name="source"
value="SplashScreenSource.xap"/>
5.在解決方案資源管理器中,把ClientBin目錄下的SplashScreenSource.xap拖到SplashScreenSourceWeb根目錄下。
6.打開(kāi)SplashScreenSourceTestPage.html,加入如下代碼:
- < param name="splashscreensource"
value="SplashScreen.xaml"/>- < param name="onSourceDownload
ProgressChanged" value=
"onSourceDownloadProgressChanged" />
Silverlight加載界面7.打開(kāi)SplashScreen.js,輸入以下代碼:
- function onSourceDownload
ProgressChanged(sender, eventArgs)- {
- sender.findName("uxStatus").
Text = "Loading: " + Math.
round((eventArgs.progress *
1000)) / 10 + "%";- sender.findName("uxProgressBar").
ScaleY = eventArgs.progress * 356;- }
8.打開(kāi)SplashScreenSourceTestPage.html,加入以下代碼:
- < script type="text/javascript"
src="splashscreen.js">< /script>
9.運(yùn)行Silverlight加載界面!