[UWP] Cross Platform (Universal 8.1 & Windows 10) Extended Splash Screen? RRS feed

  • Question

  • I discovered this fantastic guide to writing an extended splash screen for Windows 8: http://blog.jerrynixon.com/2013/05/walkthrough-windows-8-extended-splash.html

    this appears to work okay for 8.1 as well, but I couldn't find any information on how to reuse this for the associated windows phone 8.1 project, because the splash screen for that device is full screen, not positioned like it is for desktop. reusing the same code from the win8 project makes the splash screen push over to the left (similar to the way the store app did on the win 10 mobile preview, guess they're dealing with the same problem :) )

    To make things worse, while on Phone 8.1, the splash screen fills the entire screen (including the system tray status bar), running the same windows phone 8.1 app on a Windows 10 Mobile device, the splash screen does NOT fill the WHOLE screen, but rather starts below the system tray status bar.

    As a result, I'm finding it impossible to find a way for a Universal 8.1 app to correctly transition from the native OS driven splash screen to my extended splash screen in a way so that my splash screen image exactly aligns with the splash.

    I attempted to play with the margins and/or hide the status bar on my splash screen but I'm still getting inconsistent results, especially given than windows 10 doesn't overlay the status bar.

    is there any documented strategy to do this correctly and consistently regardless of BOTH the OS and the device resolution?

    • Edited by Fred Bao Wednesday, February 24, 2016 2:27 AM add the tag
    Tuesday, February 23, 2016 5:35 AM


  • Hello SelAromDotNet,

    >>To make things worse, while on Phone 8.1, the splash screen fills the entire screen (including the…

    This should be an expected behavior because as we can see the windows phone screen would be smaller than a windows screen.

    For reusing your code between a windows store app and a windows phone app. You would need to adjust the image height and width. For example, write code like below in the ExtendedSplash class:

    void PositionImage()
                extendedSplashImage.SetValue(Canvas.LeftProperty, splashImageRect.Lef);
                extendedSplashImage.SetValue(Canvas.TopProperty, splashImageRect.Top);
                extendedSplashImage.Height = splashImageRect.Height / ScaleFactor;
                extendedSplashImage.Width = splashImageRect.Width / ScaleFactor;
                extendedSplashImage.Height = splashImageRect.Height;
                extendedSplashImage.Width = splashImageRect.Width;

    When this code is running on a phone environment, it would set its height and width to be half of when it is running on the windows machine.

    If you run the UWP splash screen sample, you could see it uses a similar measure to deal this business.


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place. <br/> Click <a href="http://support.microsoft.com/common/survey.aspx?showpage=1&scid=sw%3Ben%3B3559&theme=tech"> HERE</a> to participate the survey.

    • Edited by Fred Bao Wednesday, February 24, 2016 3:33 AM
    • Proposed as answer by Fred Bao Wednesday, March 2, 2016 9:45 AM
    • Marked as answer by Fred Bao Thursday, March 3, 2016 5:46 AM
    Wednesday, February 24, 2016 3:32 AM