Floating FB popout byF5debug

Splash Screens in Windows Store Application - Day 9

 

imageIn this article we are going to see what are Splash Screens in a Windows Store Application development. Splash Screens in Windows Store or a Windows Phone application development is a screen which will be displayed for fraction of seconds immediately as soon as Windows loads your application or we can say as soon as the user launches the application. This way at the background it provides space for Windows to load the necessary resources that can be initialized and once the app is ready for interaction we can see Windows dismisses the splash screen and shows the app directly. Splash screen is basically a combination of an image (which we can decide out, may be a logo of the app) and a background color.     [more]

Microsoft suggests from its design perspective to have the color combined so that it will have a better user experience. In our previous article we have see how to make use of the Package API class to get the information about the package and the application location programmatically. This article will provide the insight of using the Splash Screen effectively from the different design principles and also we are going to see how to achieve this from the code.


So how to effectively use Splash Screen?

Microsoft has some of the design principles which can be followed in order to have a better user experience for the application, some of the design principles include

  • Splash Screen image should clearly showcase the end user what the app is all about.
  • Splash Screen image should use a transparent PNG so that it suits well with the background image, if not the image and background will be disjointed which will end up with bad user experience.
  • Splash Screen image should be kept ready with 3 different sizes basically for different devices, the sizes include (In Pixel) 620x300, 868x420, 1116x540.
  • Splash Screen can be extended keeping in mind the extended version has the same background color and image as the Windows Splash Screen.
  • If we wish to show the extended splash screen for few more minutes then we need to add a progress ring at the right place so that the users know that the app is still loading.

While we decided our splash screen with the exact background color and image to be shown as the logo, we also should decide how we are going to make the exact changes to the application. We have 2 options to change the splash screen,

First option is directly by going in to the Package.appxmanifest file and add the Image which is of 620x300 which will reflect in the application splash while loading as shown in the screen below.

image

Second option is to have more control over the process by adding the code, we can extend the splash screen using the SplashScreen API Class which has a list of properties and events that provides a dismissal event trigger and image location information for the application splash screen to locate and use it. To use the extended splash screen we need to override the OnLaunched method for the application with the below code.

Code:

[code:c#]

if (args.PreviousExecutionState != ApplicationExecutionState.Running)
    {
        bool loadState = (args.PreviousExecutionState == ApplicationExecutionState.Terminated);
        ExtendedSplash extendedSplash = new ExtendedSplash(args.SplashScreen, loadState);
        Window.Current.Content = extendedSplash;
    }

    Window.Current.Activate();

[/code]

ExtendedSplash is the class which has the detailed design on the changes that the splash screen should host out like it has the customized properties like Height, Width, Location etc. Once we are done with the change we can see the splash screen in action with an extended logo and options as shown in the screen below.

image

 

Conclusion:

So in this article we have seen the different design principles and the points on how to use the Splash Screen effectively in the Windows Store application development. Also we have seen how programmatically we can extend the splash screen to support few additional stuffs for the application development.

About Author: Karthikeyan Anbarasan, Microsoft MVP (Most Valuable Professional) in ASP.NET/IIS Architecture. He is the Founder and Chief Editor of the www.f5debug.net website and has authored books on Windows Phone and Business Intelligence(SSIS). He is also a Passionate Speaker and a Blogger on Microsoft Technologies.

You can Join Me On: Facebook, Twitter, Google Plus, LinkedIn

Add comment

  Country flag

biuquote
  • Comment
  • Preview
Loading

Recent Posts

Random Posts

Most Viewed

URL Shortner

Create your own short urls!!!

Site Counter

free counters

Disclaimer

This is a personal weblog. The opinions expressed here represent my own and not those of my employer. For accuracy and official reference refer to MSDN/ TechNet. I have documented my personal experience on this blog.

Protected by Copyscape Web Plagiarism Finder

Site Meter