c# - WinRT 预加载图像

Question

我有一个 Windows 8.1 XAML 应用程序，我想在页面之间导航之前预加载图像。

我现在的原始代码是:

// Page1.xaml.cs
private void Button_Click(object sender, RoutedEventArgs e)
{
  Frame.Navigate(typeof(Page2));
}

在第二页:

// Page2.xaml.cs
this.image1.Source = new BitmapImage(new Uri("ms-appx:///Assets/image1.jpg"));
this.image2.Source = new BitmapImage(new Uri("ms-appx:///Assets/image2.jpg"));

现在，当我单击按钮进行导航时，我可以看到正在加载的图像并一次显示一个。我想在单击按钮时预加载图像，并且只在图像加载后导航。

不幸的是，仅仅创建 BitmapImage 对象并等待 ImageOpened 事件是行不通的。如果图像未呈现到屏幕上，则图像似乎未加载。

有没有一种方法可以在不将图像添加到可视化树的情况下强制从代码加载图像？

(注意:解决方法是以某种不可见的方式将所有图像实际添加到窗口，但我想尽可能避免这种情况)

---

最终解决方案:

这是我使用 SetSourceAsync 得出的结果，正如 Filip Skakun 所建议的:

// Page1.xaml.cs
private async void Button_Click(object sender, RoutedEventArgs e)
{
  bitmapImage1 = new BitmapImage();
  bitmapImage2 = new BitmapImage();

  // Load both images in parallel
  var task1 = loadImageAsync(bitmapImage1, "image1.jpg");
  var task2 = loadImageAsync(bitmapImage2, "image2.jpg");
  await Task.WhenAll(task1, task2);

  Frame.Navigate(typeof(Page2));
}

private Task loadImageAsync(BitmapImage bitmapImage, string path)
{
  var filePath = ApplicationData.Current.LocalFolder.Path + "\\" + path;
  var file = await StorageFile.GetFileFromPathAsync(filePath);
  var stream = await file.OpenAsync(FileAccessMode.Read);
  await bitmapImage.SetSourceAsync(stream);
}

// Page2.xaml.cs
this.image1.Source = bitmapImage1;
this.image2.Source = bitmapImage2;

Answer 1

WinRT XAML 工具包的 AlternativeFrame控制和 AlternativePage一个有一个 ShouldWaitForImagesToLoad 属性，当您设置为 true 并导航到页面时 - 只会在图像加载后显示页面。 AlternativePage 有一个 Preload() 方法，您也可以重写该方法以在显示页面之前添加更多要等待的内容。它的实现方式是首先将页面添加到可视化树中的一个不可见容器中，因此会触发那些BitmapImages 的加载。

另一种选择可能是使用 SetSourceAsync()您可以等待它，我认为它会在您使用 UI 中的 BitmapImage 之前开始加载，但随后您需要自己下载文件。