On this brief tutorial I want to demonstrate How you can change the splash screen of a Windows Phone Application that you are accessing to.
In this case I would like to demonstrate this functionality with a special purpose control.
Using the code
The first thing that you should do is download the control (or buy it, if you still did not) from here.
First, you create a Windows Phone project (Windows Phone Application) and name it: EjemploSplash.
When we created the example we have in the following way:
Remove the entire contents of the grid (
We proceed to add a picture to the grid by using the XAML code, an image previously added to the project by using Solution Explorer.
The image of the example is:
Write the following line in the XAML code in the MainPage.xaml file:
<Image Stretch="Fill" Source="/EjemploSplash;component/smoked.jpg" />
We pressed F5 and our emulator shows us the image filling the screen WOW!
Now we are focused into three basic steps to achieve the desired effect. The first one which is to show an arrow indicating that there is a "delay" when performing any action.
The first step is to delete the SplashScreenImage.jpg file and create a new file of type UserControl by calling it SplashScreen.xaml.
The code contained in the file is as follows below:
mc:Ignorable="d" d:DesignHeight="800" d:DesignWidth="480"
<ColumnDefinition Width="Auto" />
<RowDefinition Height="Auto" />
<ProgressBar HorizontalAlignment="Left" Margin="47,692,0,89"
Name="progressBar1" Width="383" IsIndeterminate="True" />
We must also work in the C# code and could place something like this:
public partial class SplashScreen : UserControl
new SolidColorBrush((Color)new PhoneApplicationPage().Resources["PhoneBackgroundColor"]);
this.progressBar1.Width = this.panelSplashScreen.Width =
With this file we have finished our interface to the famous stage of the loading emulation.
The second step is to use a class, which for me is very important, is called
BackgroundWorker and basically allows you to perform tasks in the background.
Where we do this task in the background? In the App.xaml.cs file, if we carefully review we will find the event
where we'll enter the following code:
private void Application_Launching(object sender, LaunchingEventArgs e)
Popup popup = new Popup();
SplashScreen splash = new SplashScreen();
popup.Child = splash;
popup.IsOpen = true;
BackgroundWorker bw = new BackgroundWorker();
bw.DoWork += (s, a) =>
bw.RunWorkerCompleted += (s, a) =>
popup.IsOpen = false;
The third and final step is to run the test application by pressing F5. When the application is being loaded we will have this user interface:
And when you are finished running the task in the background we see this interface (corresponding to the test application):
I hope this little tutorial can be very important to show the user a process being carried out either on the phone or any development project useful them.
Points of Interest
This is an interesting way to do splash screen, there are many ways to do it. But I try to demonstrate the easiest way to apply splash screen and
Hope it helps.
- 08/Jul/2012 - Article submitted.