Windows UWP Immagine di splash screen estesa non visualizzata correttamente sul cellulare

Question

Ho creato una schermata iniziale estesa per l'applicazione uwp di Windows. Ho seguito il codice di esempio incluso il codice XAML per lo schermo spash esteso da questa pagina

Display a splash screen for more time

Rende correttamente sulla finestra del desktop, si è centrata perfettamente e allineati esattamente l'immagine iniziale splash screen con, tuttavia quando provo un emulatore mobile, (ho provato uno schermo da 5 pollici a 720p) l'immagine della pagina dello splash screen estesa sembra troppo grande (sembra quasi due o tre volte più grande), e appare tagliata in basso a destra della pagina, sono supponendo che l'anello di avanzamento si trovi sotto l'immagine e si trovi oltre il limite della pagina, non è visibile.

Ecco come appare sul cellulare, l'immagine a sinistra è la schermata iniziale iniziale e quella a destra è la pagina iniziale estesa.

mio XAMLfor la splash page esteso è come questo

<Page 
    x:Class="MyApp_Win10.ExtendedSplash" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="using:MyApp_Win10" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d"> 

    <Grid Background="#FF000012" > 
     <Canvas> 
     <Image x:Name="extendedSplashImage" Source="Assets/SplashScreen/SplashScreenImage3.png"/> 
     <ProgressRing Name="splashProgressRing" IsActive="True" Width="60" Height="60" HorizontalAlignment="Center"></ProgressRing> 
     </Canvas> 
    </Grid> 
</Page> 

E il mio package.appmanifest simile a questa. (V'è un'immagine nelle Attività forlder che è stato creato come SplashScreenImage3.scale-200.PNG con dimensioni 1240 lx 600 h)

EDIT: ho aggiunto un'immagine il rimanente 3 scale 150, 125 e 100 al pacchetto.appmanifest ma non ha fatto alcuna differenza. Dal momento che la pagina iniziale estesa non è la stessa della pagina iniziale iniziale, penso che stia scegliendo il file immagine esatto che scrivo in XAML, che è la dimensione piena della dimensione 1240 x 600 ore.

Anche nel codebehind per Splash esteso, queste sono le coordinate della schermata iniziale

EDIT: mio positionImage() e PositionRing() Funzioni

void PositionImage() 
{ 
    extendedSplashImage.SetValue(Canvas.LeftProperty, splashImageRect.X); 
    extendedSplashImage.SetValue(Canvas.TopProperty, splashImageRect.Y); 

    extendedSplashImage.Height = splashImageRect.Height; 
    extendedSplashImage.Width = splashImageRect.Width; 

} 

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)); 

} 

Answer 1

Assicurarsi che nella vostra positionImage() e PositionRing() funzioni che gestire il caso in cui il dispositivo è un telefono come segue

void PositionImage() 
{ 
    extendedSplashImage.SetValue(Canvas.LeftProperty, splashImageRect.X); 
    extendedSplashImage.SetValue(Canvas.TopProperty, splashImageRect.Y); 

    if (Windows.Foundation.Metadata.ApiInformation.IsTypePresent("Windows.Phone.UI.Input.HardwareButtons")) 
    { 
     extendedSplashImage.Height = splashImageRect.Height/ScaleFactor; 
     extendedSplashImage.Width = splashImageRect.Width/ScaleFactor; 
    } 
    else 
    { 
     extendedSplashImage.Height = splashImageRect.Height; 
     extendedSplashImage.Width = splashImageRect.Width; 
    } 
} 

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)); 

    if (Windows.Foundation.Metadata.ApiInformation.IsTypePresent("Windows.Phone.UI.Input.HardwareButtons")) 
    { 
     splashProgressRing.Height = splashProgressRing.Height/ScaleFactor; 
     splashProgressRing.Width = splashProgressRing.Width/ScaleFactor; 
    } 
} 

e

//Variable to hold the device scale factor (use to determine phone screen resolution) 
private double ScaleFactor = DisplayInformation.GetForCurrentView().RawPixelsPerViewPixel; 

Answer 2

Perché non hai impostato altre dimensioni di scala?
Basta aggiungerli e riprovare.
Sembra che il telefono non si ha in scala 200

Answer 3

Ho lo stesso problema. In effetti l'altezza e la larghezza della schermata di avvio restituite sono errate sul cellulare. Restituisce invece la dimensione dello schermo !!!! vedi immagine sopra (altezza = 1280 larghezza = 720, quando lo splashscreen attuale ha una larghezza maggiore dell'altezza. Ho provato a ricalcolare la dimensione dello splashscreen usando la larghezza dello schermo e indovinando la dimensione dello splashscreen usato e dividendolo per il fattore scle, ma c'è una piccola differenza di dimensioni a causa di una marce o qualcosa del genere .... Sarebbe bello se qualcuno conosce un modo migliore per calcolare la dimensione corretta al posto del tipo di indovinare ....

if (Windows.Foundation.Metadata.ApiInformation.IsTypePresent("Windows.Phone.UI.Input.HardwareButtons")) 
{ 
    ScaleFactor = DisplayInformation.GetForCurrentView().RawPixelsPerViewPixel; 
    double screenwidth = _splashImageRect.Width; 
    if (screenwidth <= 1240) 
    { 
     // small screen will use the splashscreen scale 100 - 620x300 
     ExtendedSplashImage.Height = 300/ScaleFactor; 
     ExtendedSplashImage.Width = 620/ScaleFactor; 
    } 
    else if (screenwidth > 1240 && screenwidth <= 2480) 
    { 
     // medium screen will use the splashscreen scale 200 - 1240x600 
     ExtendedSplashImage.Height = (600/ScaleFactor); 
     ExtendedSplashImage.Width = (1240/ScaleFactor); 
    } 
    else if (screenwidth > 2480) 
    { 
     // big screen will use the splashscreen scale 400 - 2480x1200 
     ExtendedSplashImage.Height = 1200/ScaleFactor; 
     ExtendedSplashImage.Width = 2480/ScaleFactor; 
    } 
} 
else 
{ 
    ExtendedSplashImage.Height = splashImageRect.Height; 
    ExtendedSplashImage.Width = splashImageRect.Width; 
} 

Answer 4

ho trovato la soluzione per la telefonia mobile e se si tenta di condividere la vostra applicazione con un altro app:

proprietà

private void PositionImage() 
{  
    if(Windows.Foundation.Metadata.ApiInformation.IsTypePresent("Windows.Phone.UI.Input.HardwareButtons"))    
    { 
     double screenWidth = _splashImageRect.Width; 
     ExtendedSplashImage.Width = screenWidth/ ScaleFactor; 
     // use the ratio of your splashscreen to calculate the height 
     ExtendedSplashImage.Height = ((screenWidth/ScaleFactor) * 600)/1240; 
    } 
    else 
    { 
     // if the app is shared with another app the _splashImageRect is not returns properly too 
     if (_splashImageRect.Width > windowContext.VisibleBounds.Width || _splashImageRect.Width < 1) 
     { 
      ExtendedSplashImage.Width = windowContext.VisibleBounds.Width; 
      // use the ratio of your splashscreen to calculate the height 
      ExtendedSplashImage.Height = ((windowContext.VisibleBounds.Width) * 600)/1240; 
     } 
     else 
     { 
      ExtendedSplashImage.Height = _splashImageRect.Height; 
      ExtendedSplashImage.Width = _splashImageRect.Width; 
     } 
    } 

    Double left = windowContext.VisibleBounds.Width/2 - ExtendedSplashImage.ActualWidth/2; 
    Double top = windowContext.VisibleBounds.Height/2 - ExtendedSplashImage.ActualHeight/2; 
    ExtendedSplashImage.SetValue(Canvas.LeftProperty, left); 
    ExtendedSplashImage.SetValue(Canvas.TopProperty, top); 

    ProgressRing.SetValue(Canvas.LeftProperty, left + ExtendedSplashImage.ActualWidth/2 - ProgressRing.Width/2); 
    ProgressRing.SetValue(Canvas.TopProperty, top + ExtendedSplashImage.ActualHeight); 

}