c# - 在虚拟化列表框中延迟加载图像

Question

我正在尝试为列表框中的每个项目异步延迟加载缩略图。

<Image Source="{Binding Path=Thumbnail, TargetNullValue={StaticResource DefaultImage}}"/>

由于 Listbox 是虚拟化的，因此仅当项目位于显示端口或靠近显示端口时，才会调用 Thumbnail 属性的 getter。

public BitmapSource Thumbnail
{
    get
    {
        TriggerLoad();
        return _thumbnail;
    }
}

我正在等待在 TriggerLoad 函数中加载 Thumbail 的昂贵操作，但 UI 响应不是很好，尤其是当您尝试快速滚动大量项目列表时。

private async void TriggerLoad()
{
    if (!LoadTriggered)
    {
        LoadTriggered = true;
        var cacheItem = _cache[key] as CacheItem;

        if (cacheItem != null)
            await LoadBitmapFromCache(cacheItem); // returns a Task
        else
            await LoadBitmapFromService(Id); // returns a Task
    }
}

找到一个类似的问题here但它与将项目加载到列表框无关。有没有更好的方法来延迟加载您绑定(bind)到列表框的部分数据？

编辑:我尝试了 PriorityBinding 和 IsAsync 选项，滚动并不比我当前的解决方案好。

Answer 1

听起来虽然您的 UI 正在虚拟化，但它加载新图像的速度不够快，无法跟上用户的滚动。尝试将 VirtualizationMode 设置为 Recycling 并设置更长的 CacheLength。像这样:

<ListBox
    VirtualizingPanel.IsContainerVirtualizable="True"
    VirtualizingPanel.IsVirtualizing="True"
    VirtualizingPanel.VirtualizationMode="Recycling"
    VirtualizingPanel.CacheLengthUnit="Page"
    VirtualizingPanel.CacheLength="2,2"
    etc.../>

将 CacheLength 从“1,1”增加到“2,2”意味着两个“页面”(或项目的视口(viewport)值(value))将在页面显示给用户之前和之后加载到内存中。您的应用将消耗更多内存，但用户将能够在遇到未加载的图像之前滚动得更远、更快。