UWP Bilder nicht sofort auf Seite

Question

Ich lerne gerade UWP und Xaml und habe festgestellt, dass mein Interesse geweckt hat.

Wenn ich eine Seite mit einem Hintergrundbild von 50 KB erstellen, das ein Raster mit 7 anderen Bildern von jeweils 500 Bytes enthält, wird die Seite geladen, aber am Anfang werden die Bilder noch nicht angezeigt und einige Sekunden angezeigt nach (wie 1-1,5 Sekunde).

Ist es in gewisser Weise möglich, die Bildnavigation oder die Navigation zu bestimmen, um mit dem Öffnen der Seite zu warten, bis alle Bilder geladen sind? Oder müssen Sie die Bilder beim Start auf eine Art vorab laden?

- Update -

Ich möchte einen Fortschrittsdialog oder wie die Bilder zu vermeiden, wird wesentlicher Teil des Bildschirms werden und ein Laden nur für das zeigt, ist auch ein bisschen komisch User Experience als Sie sehen zunächst einen weißen Hintergrund und dann plötzlich den Hintergrund mit den Bildern.

Wenn ich die 7 Bilder aus dem Raster lasse, wird das Hintergrundbild fast augenblicklich (in ein paar Millisekunden) angezeigt, aber wenn sie eingeschlossen sind, werden alle Bilder angezeigt, wenn alle geladen sind und einen Flimmereffekt hinterlassen. Darüber hinaus passiert es nur beim ersten Mal, wenn sie geladen werden, beim Navigieren weg von der Seite und dann zurück werden die Bilder unmittelbar danach angezeigt.

Beispiel:

    <Page 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 
     <Page.Background> 
      <ImageBrush ImageSource="/Assets/Background/Scherm1.jpg"/> 
     </Page.Background> 
     <Grid> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="*"/> 
       <ColumnDefinition Width="*"/> 
       <ColumnDefinition Width="*"/> 
       <ColumnDefinition Width="*"/> 
       <ColumnDefinition Width="*"/> 
       <ColumnDefinition Width="*"/> 
       <ColumnDefinition Width="*"/> 
      </Grid.ColumnDefinitions> 
      <Image Grid.Column="0" Opacity="0" Source="ms-appx:///Assets/Image1.png"/> 
      <Image Grid.Column="1" Opacity="0" Source="ms-appx:///Assets/Image2.png"/> 
      <Image Grid.Column="2" Opacity="0" Source="ms-appx:///Assets/Image3.png"/> 
      <Image Grid.Column="3" Opacity="0" Source="ms-appx:///Assets/Image4.png"/> 
      <Image Grid.Column="4" Opacity="0" Source="ms-appx:///Assets/Image5.png"/> 
      <Image Grid.Column="5" Opacity="0" Source="ms-appx:///Assets/Image6.png"/> 
      <Image Grid.Column="6" Opacity="0" Source="ms-appx:///Assets/Image7.png"/> 
     </Grid> 
    </Page> 

Answer 1

Sie könnten eine unbestimmte ProgressBar gesetzt, wo Ihr Bild geladen. Etwas wie folgt aus:

<BitmapImage ImageOpened="Banner_ImageOpened"/> 
<ProgressBar x:Name="BannerProgressBar" IsIndeterminate="True"/> 

Und in Ihrem Code hinter:

private void Banner_ImageOpened(object sender, RoutedEventArgs e) 
     { 
      BannerProgressBar.Visibility = Visibility.Collapsed; 
     }