Silverlight initial screen (from msdn)

1. Initial screen usage

A feature set that can be used to construct a Silverlight initial screen is designed to handle, but not limited to, the following situations:

• Show download progress

• Displays animations even if you do not need to use them to display the download progress.

• Provide the brand, which can include text, vector graphics, and even video

• Display product information, such as Disclaimer

2. default initial screen experience

The default experience defined for Silverlight under a managed API is that any load that exceeds a certain time threshold (about 0.5 seconds) will display a XAML-based animation in the content area. Displays that the default animation and the initialization sequence's XAML are hardcoded into the Silverlight plug-in. To replace the default initial screen, you provide a value for the splashscreensource parameter of the Silverlight plug-in that defines the object element in HTML.

3. ApplicationsProgramBasic initial screen in Project

Parameters	Description
Splashscreensource	Set the URI Of The XAML page that provides visual effects for the initial screen. This page is loaded as the initial Silverlight content under the javascript API.
Ourcedownloadprogresschanged	Set the name of the event handler called incrementally during source download.
Onsourcedownloadcomplete	Set the name of the event handler called immediately after the source download is complete.

4. Create a simple initial Screen

1) create a splashscreen. XAML file on the website hosting Silverlight. (Note: The splashscreen. js file will be created at the same time when this file is created)

<Canvas
Xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
Xmlns: x = "http://schemas.microsoft.com/winfx/2006/xaml"
X: Name = "parentcanvas"
Width = "850"
Height = "600"
Background = "oldlace"
>
<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" type = "parmname" text = "parmname"/>

<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" type = "parmname" text = "/parmname"/>
<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" type = "parmname" text = "/parmname"/>
</Canvas>
</Canvas>

2) add child elements to the object plug-in on the page

<Object Data = "data: Application/x-silverlight-2," type = "application/x-silverlight-2" width = "100%" Height = "100%">

<Param name = "splashscreensource" value = "splashscreen. XAML"/>

<Param name = "onsourcedownloadprogresschanged" value = "onsourcedownloadprogresschanged"/>

</Object>

3) Delete the original content in the splashscreen. js file and add the following content:

Function onsourcedownloadprogresschanged (sender, eventargs)

{

Sender. findname ("uxstatus"). Text = "loading:" + math. Round (eventargs. Progress * 1000)/10 + "% ";

Sender. findname ("uxprogressbar"). scaley = eventargs. Progress * 356;

}

4) Introduce splashscreen. js into the page

<SCRIPT type = "text/JavaScript" src = "splashscreen. js"> </SCRIPT>

 

5. Note:

1) Change the property of splashscreen. XAML to the content and output the XAML as the content.