这是我的场景:
我有一个显示从网络服务检索到的数据的 Gridview。数据的数量可能非常大。因此,VirtualizingStackPanel 用于显示内容。其中一些数据在渲染时可能需要检索图像(延迟加载)
我(非常有限)的理解是,VirtualStackPanel 将自动请求数据,因为网格需要呈现数据。如果需要渲染的元素是图像类型,我会发送一个占位符图像并提交一个异步网络调用来检索该图像。
但是,我注意到正在接收渲染所有元素的调用,因此发送了大量用于检索图像的网络调用(尤其是如果大多数项目都是图像类型)。
问题:我是否应该在代码(XAML 或 C#)中为 VirtualizingStackPanel 配置一些东西,或者应该去检测项目是否真的被显示然后发出网络调用?
这是我的 XAML。
<GridView
x:Name="itemGridView"
AutomationProperties.AutomationId="ItemGridView"
AutomationProperties.Name="Grouped Items"
Grid.RowSpan="3"
Padding="116,137,40,46"
ItemsSource="{Binding Source={StaticResource groupedItemsViewSource}}"
VirtualizingStackPanel.VirtualizationMode="Standard"
ItemTemplateSelector="{StaticResource CellStyleSelector}"
ItemClick="ItemView_ItemClick"
IsItemClickEnabled="True"
SelectionMode="None"
IsSwipeEnabled="false">
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</GridView.ItemsPanel>
这是绑定到 XAML 中的图像的项的属性
private ImageSource _image = null;
private String _imagePath = null;
public ImageSource ThumbImage
{
get
{
// Check if the image is already cached
if (this._image == null)
{
// Setup a placehoder image
this._imagePath = "Assets/metro_photo_55@2x.png";
this._image = new BitmapImage(new Uri(Defs.BaseUri, this._imagePath));
// Async call to download thumb image from server
this.getThumb();
}
return this._image;
}
private set
{
this.SetProperty(ref this._image, value);
}
}
这是下载拇指的异步调用
private async void getThumb()
{
// Get image and store
Network network = new Network();
// Since this is a bound property. this action updates the UI
this.ThumbImage = await network.getImage(this._rawData[Defs.PATH_KEY], true);
Debug.WriteLine(this._rawData[Defs.PATH_KEY] + " - Thumb retrieved!");
}