Windows 8 for C# Developers: Intro and Splash Screen

Now that the Windows 8 Consumer Preview is out, I’m starting a series of blog posts on creating WinRT / Metro applications using C# and XAML.  As with other series I have done in the past, early on, these posts are my raw notes as I work to understand the new developer APIs and libraries.

Like most of you, I’m starting from ground zero learning WinRT. I’ve been running the Windows 8 Developer Preview since the //build/ conference, and I’m finally getting enough time to explore the developer APIs.  In time, this series should provide a quick and handy notebook toward finding how to solve specific problems using the WinRT platform. In this series, I’m looking at each of the samples you can download here. http://code.msdn.microsoft.com/windowsapps/Windows-8-Modern-Style-App-Samples Specifically, I’ll discuss what you can learn from each of the samples. In this first post, I’ll disect the Splash Screen Sample.

Why have a Splash Screen Sample at all?

This sample shows a few important rules for Metro apps.  All Metro apps can specify a splash screen resource. The Windows runtime will display that splash screen when the app starts. That’s all you need to do if you want the system defined splash screen behavior. Open the package.AppXManifest file in Solution Explorer and define the image to use as the splash screen.

The Application configured Splash Screen will display for a system-defined period of time. Your application should be ready to display its main UI once the splash screen is dismisssed.

There are two important techniques to learn from this sample: How to display an extended splash screen, and how to avoid the need for an extended splash screen.

To display an extended splash screen, your application’s startup code must created the extended splash screen, giving it the same coordinates as the system SplashScreen.

SplashScreen splashScreen = args.SplashScreen;

ExtendedSplash eSplash = new ExtendedSplash(splashScreen, false);

public ExtendedSplash(SplashScreen splashScreen, bool dismissed)

{    

    InitializeComponent();             

    this.splashImageCoordinates = splashScreen.ImageLocation;             

    this.splash = splashScreen;             

    this.dismissed = dismissed;             

    // Position the extended splash screen image in the same location as the splash screen image.    

    this.extendedSplashImage.SetValue(Canvas.LeftProperty, this.splashImageCoordinates.X);             

    this.extendedSplashImage.SetValue(Canvas.TopProperty, this.splashImageCoordinates.Y);             

    this.extendedSplashImage.Height = this.splashImageCoordinates.Height;             

    this.extendedSplashImage.Width = this.splashImageCoordinates.Width;             

    LearnMoreButton.Click += new RoutedEventHandler(LearnMoreButton_Click);             

    Window.Current.SizeChanged += new WindowSizeChangedEventHandler(ExtendedSplash_OnResize);

}

Once the main splash screen is dismissed, the extended screen will be shown.

The second technique is to use the system SplashScreen’s dismissed event to delay some actions, to avoid the need for an extended splash screen at all.

In your application startup code, you register to receive the dismissed event for the splash screen. You can (and should) defer as much work as you can until this event is raised. That enables you to show your UI sooner, and your app will be more fast and fluid.