Data binding WP8.1 RT:数据绑定（远程）图像减速应用程序

背景：

我正在开发一个WP8.1/WP10移动应用程序，它可以与我这里的本地设备一起工作。此本地设备通过ASP.NET Web APi提供json和图像。我的应用程序通过网络电话获取信息并向用户显示信息。非常简单的设置

我的过程如下：用户启动应用程序。应用程序通过UPNP在网络上查找“webservice”。当它这样做时，它交换一个令牌，我们可以开始调用web服务。我正在抓取一个包含标题、副标题和图像的对象列表。图像如下所示：

192.168.1.x:8080/getImage/?uri=someremoteimageurihere.

我的设备将下载这些图像并将其返回到应用程序（我需要它以这种方式用于此设备的其他一些用途）

为了保持UI的流畅性，我在显示的列表上使用了虚拟化，用户可以在列表中滚动而没有任何延迟。到目前为止，一切顺利。只有一个问题：

我的问题

我的问题是listview模板中的图像。当用户界面响应迅速时，手机会不断下载图像，尤其是当用户从第300项滚动到第1项时。你会看到它从#299一直下载到#1。问题是用户正在查看列表中的#1，而下载所有图像需要一分钟左右的时间，从#299到#1

我想知道怎样才能更好地控制这些图像的加载。在下载这些图像时，我的应用程序似乎没有多少时间执行“其他”任务，例如，对web api的所有其他调用似乎都要等到屏幕上的图像加载完毕（这不会锁定ui线程！）。因此，基本上，如果我导航到“设置”弹出按钮，则设置将仅在加载一批图像后加载

我有没有办法在一个背景线程上加载这些图像？最终用户的延迟是可以接受的，只要图像的绑定没有优先于任何其他图像

这个问题不是关于：

• 在执行工作时锁定UI线程
• 帮助绑定数据
• 缓存策略

---

谢谢你的见解

您可以尝试直接绑定到下载的图像（作为ImageSource资源），而不是使用服务器Uri：因此，您可以在后台以自己的代码下载这些图像，并将它们作为图像集合在ViewModel中使用

您可以尝试以下代码：

public async void GetImage(Uri url) 
{ 
    HttpClient client = new HttpClient(); 
    HttpResponseMessage response = await client.GetAsync(url); 
    byte[] img = response.Content.ReadAsByteArray(); 
    InMemoryRandomAccessStream stream = new InMemoryRandomAccessStream(); 

    DataWriter writer = new DataWriter(stream.GetOutputStreamAt(0)); 
    writer.WriteBytes(img); 

    await writer.StoreAsync(); 

    BitmapImage bi = new BitmapImage(); 
    bi.SetSource(randomAccessStream);

    image1.Source = bi; 
}

---

如果有帮助，请标记为已回答：）

相位调整功能是否可以解决您的问题？ 阶段化是{x:Bind}的一项功能，它与从ListViewBase派生的控件一起工作，并增量处理数据绑定的项模板。渲染列表项时，ListViewBase会为视图中的所有项渲染一个阶段，然后再移动到下一阶段。渲染工作以时间切片批处理的方式执行，以便在滚动列表时，可以重新评估所需的工作，而不会对不再可见的项目执行。

---

您应该在listview上尝试随机数据访问数据虚拟化：

随机访问数据虚拟化允许从数据集中的任意点加载。使用随机访问数据虚拟化的ListView（用于查看一百万个项目的集合）可以加载100000–100050个项目。如果用户随后移动到列表的开头，则控件将加载项目1–50。滚动条的拇指始终表示ListView包含一百万个项目。滚动条拇指的位置相对于可见项在集合的整个数据集中的位置。这种类型的数据虚拟化可以显著减少集合的内存需求和加载时间。要启用它，您需要编写一个数据源类，该类根据需要获取数据，管理本地缓存并实现这些接口

---

您的webapi是否按照手机显示图像所需的大小提供图像，或者是否正在调整图像的大小？调整大小很慢。不，不是这样，我也没有办法这么做（那部分是第三方的）。所以，是的，所有的图像都是动态调整大小的，这是没有帮助的。我已经试过了，但这并不是解决我问题的办法。我的问题是，如果你从listview中的#1滚动到#300，它将从1-300下载所有图像，而我只需要下载屏幕上的图像。您的“getimage”方法只是设置映像源的另一种方法，这不是我的实际问题：）。您在listview中使用的是哪种虚拟化？增量访问还是随机访问？