Kinjan Bhavsar
Kinjan Bhavsar

Reputation: 1449

Extended splash screen in Windows 10 UWP?

I have created an extended splash screen for Windows 10 UWP app using following XAML and C# Code.

XAML Code

<Grid Background="#036E55">
    <Canvas>
        <Image x:Name="extendedSplashImage" Source="Assets/620.scale-200.png"/>
    </Canvas>

    <ProgressRing Name="splashProgressRing" 
                  IsActive="True" 
                  Width="20" 
                  Height="20"
                  HorizontalAlignment="Center"
                  VerticalAlignment="Bottom"
                  Foreground="White"
                  Margin="20">
    </ProgressRing>
</Grid>

C# Code

internal Rect splashImageRect;
    private SplashScreen splash;
    internal bool dismissed = true;
    internal Frame rootFrame;
    private double ScaleFactor;
    ApplicationDataContainer userSettings = ApplicationData.Current.LocalSettings;
    JsonDataHandler dataHandler;
    //bool isZipUpdateInProgress = false;

    public ExtendedSplashScreen(SplashScreen splashscreen, bool loadState)
    {
        this.InitializeComponent();
        Window.Current.SizeChanged += new WindowSizeChangedEventHandler(ExtendedSplash_OnResize);
        ScaleFactor = (double)DisplayInformation.GetForCurrentView().ResolutionScale/100;
        //System.Diagnostics.Debug.WriteLine("ScaleFactor - " + ScaleFactor + "/n");
        splash = splashscreen;
        if (splash != null)
        {
            splash.Dismissed += new TypedEventHandler<SplashScreen, Object>(DismissedEventHandler);

            splashImageRect = splash.ImageLocation;
            PositionImage();
            //PositionRing();
        }
        rootFrame = new Frame();
    }

    void PositionImage()
    {
        extendedSplashImage.SetValue(Canvas.LeftProperty, splashImageRect.X);
        extendedSplashImage.SetValue(Canvas.TopProperty, splashImageRect.Y);
        extendedSplashImage.Height = splashImageRect.Height / ScaleFactor;
        extendedSplashImage.Width = splashImageRect.Width / ScaleFactor;

    }


    void PositionRing()
    {
        splashProgressRing.SetValue(Canvas.LeftProperty, splashImageRect.X + (splashImageRect.Width * 0.5) - (splashProgressRing.Width * 0.5));
        splashProgressRing.SetValue(Canvas.TopProperty, (splashImageRect.Y + splashImageRect.Height + splashImageRect.Height * 0.1));
    }

void ExtendedSplash_OnResize(Object sender, WindowSizeChangedEventArgs e)
    {
        // Safely update the extended splash screen image coordinates. This function will be executed when a user resizes the window.
        if (splash != null)
        {
            // Update the coordinates of the splash screen image.
            splashImageRect = splash.ImageLocation;
            PositionImage();

            // If applicable, include a method for positioning a progress control.
            PositionRing();
        }
    }

Now, it works fine if I keep rotation mode on, but when I switch it off, and if I rotate the screen to landscape mode then the logo differs. I am using 620x300 image.

Upvotes: 1

Views: 1173

Answers (1)

JigsK
JigsK

Reputation: 81

You can try with this code it might help you to get result as you want, First remove all positioning image code and only try with this

<Grid Background="#036E55">
        <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
            <Image Source="Assets/620.scale-200.png" Stretch="None"/>
            <ProgressRing IsActive="True" Height="30" Width="30" Margin="0,10,0,0" Foreground="White"/>
       </StackPanel>
</Grid>

Image and ProgressRing will manage by StackPanel in center of screen and also Image will not differ. Hope it will help you.

Upvotes: 3

Related Questions