UWP 应用更快的图像加载？答案

【问题标题】：UWP app faster image loading?UWP 应用更快的图像加载？
【发布时间】：2017-01-03 06:54:04
【问题描述】：

我正在为通用 Windows 平台编写一个应用程序，我需要在其中加载一些图像以显示在列表中。现在我的问题是这个加载对用户来说太长了。我目前在XAML 中设置图像的来源，使用绑定，如下所示：{Binding Image}。

我只能访问全分辨率图像，所以我想知道是否有办法在将这些图像放在 UI 上之前使它们变小，因此只有较小的图像需要保留在内存中。有没有办法配置 Image UI 元素，以便它自己执行这种调整大小？

另外，有没有办法延迟加载这些图像，因为现在我的 UI 被这些图像的加载阻塞了。

编辑：我用来将本地图像加载到我的 Image 的代码（这是在 ListView.ItemTemplate 内）：

<Image
    Grid.Row="0"
    Source="{Binding Image}"
    Stretch="Uniform"
    VerticalAlignment="Center"/>

【问题讨论】：

不确定这是否有帮助 - 但也许不是显示整个图像，而是显示它们的缩略图？
你从哪里得到这些图像？本地还是在线？阻塞是发生在 ui 端，还是加载这些图像需要很长时间。如果加载图像需要很长时间，也许这会对您有所帮助：msdn.microsoft.com/en-us/windows/uwp/threading-async/…
你是在创建 BItmapImage 还是绑定图片 url？
@wuerzelchen 我正在加载本地图像（在其他地方下载，但是这部分工作并且完全在我的列表填充本地图像的 URI 之前发生），它们非常大（因为我需要它们高- res 其他地方），但在列表中我只显示小图像。我使用相同的图像，它会在这些大图像加载期间阻塞 UI。我将编辑我的问题
请贴出代码以便我们理解

标签： c# image performance win-universal-app

【解决方案1】：

您可以使用转换器延迟加载和调整图像大小。 In 是您可以使用的转换器的开始。有了这个，延迟加载就为你完成了。但是，我没有准备好调整大小的示例。

转换器代码

class LoadAttachmentAsyncConverter : IValueConverter
{
    public override object Convert(object value, Type targetType, object parameter, string language)
    {
        Task<BitmapImage> taskToExecute = GetImage(<some parameter>);
        //Possibly handle some other business logic
        return new NotifyTaskCompletion<BitmapImage>(taskToExecute);
    }

    public async Task<BitmapImage> GetImage(object someParameter) {
        BitmapImage image = new BitmapImage();
        //do (async stuff) to fill the image;
        return image;
    }
}

XAML 代码

<Image Source="{Binding Result}" DataContext="{Binding converterObjValue, Converter={StaticResource ConverterName}}"/>

要实现调整大小，您可以在此处找到信息：https://social.msdn.microsoft.com/Forums/en-US/490b9c01-db4b-434f-8aff-d5c495e67e55/how-to-crop-an-image-using-bitmaptransform?forum=winappswithcsharp

【讨论】：

XAML 中的converterObjValue 是什么？而且我可以将调整大小的代码放在“做异步的东西来填充图像”中，对吧？
converterObjValue 是传入转换器的对象。我已经使用这种方法来传递用户信息，这样我就可以从互联网上检索缩略图。您确实可以将调整大小的代码放在那里是的
这将像普通绑定一样与 DataContext 绑定，对吧？（这个绑定的东西我不是很流利）
是的。它将做的是将数据上下文绑定到将要返回的任务。这样可以将源绑定到该任务的结果（加载的图像）
谢谢！我会试试这个，如果这解决了我的问题，我会接受:)

【解决方案2】：

您还可以在 VM 中进行延迟加载。

    // You can also use BitmapImage directly, if you'd like to make reloading faster and don't care memory usage.
    private WeakReference<BitmapImage> image;

    public BitmapImage Image
    {
        get
        {
            BitmapImage image;
            if(this.image != null && this.image.TryGetTarget(out image))
                return image;
            image = new BitmapImage();
            this.image = new WeakReference<BitmapImage>(image);
            var ignore = Task.Run(()=>
            {
                //Load image here.
                //Don't forget to use Dispatcher while calling SetSourceAsync() or setting Source.
            });
            return image;
        }
    }

【讨论】：