Customizing Splash Screen in Silverlight
Customizing Splash Screen (a screen that loads before the Silverlight application loads) requires some development effort in the host application (could be HTML/ASPX/any other application).
Creating SplashScreen.xaml
First, we create a XAML file - say SplashScreen.xaml file which displays two things - a progress bar and a textblock that displays '% completed'
[sourcecode language='xml']
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
[/sourcecode]
Here, we have a baseBackground (that forms background) that is Black in color and small bar that will move 'movementBar' which is Gray in color.
As the page downloads the data, movementBarTransform needs to be changed, so that the movementBar appears as if it is increasing. And simultaneously, progressText should display the % downloaded.
Modifying host file
Now let's modify the host file that loads the Silverlight Application.
[sourcecode language='xml']
[/sourcecode]
The most important line that calls a JS function 'onSourceDownloadProgressChanged' when some part (bytes) of the XAP is downloaded is:
[sourcecode language='xml']
[/sourcecode]
Adding JS in hosting file
[sourcecode language='js']
function onSourceDownloadProgressChanged(sender, eventArgs)
{
sender.findName("progressText").Text = Math.round((eventArgs.progress * 100)) + "% downloaded ...";
sender.findName("movementBarTransform").ScaleX = eventArgs.progress;
}
[/sourcecode]
This code snippet calculates the percentage of XAP file downloaded and displays it in the textbox. It also increases the ScaleX property of ScaleTransform of movementBar as per the progress.
Testing the Splash Screen
Now, add some heavy sized ZIP file in the Silverlight application so that your XAP file becomes atleast 5 MB and try to execute the application.
What you would see is a new custom Splash Screen
