提高将图像加载到ComboBox的性能

Question

我正在使用WPF ComboBox填充国家/地区列表，如下所示：

在ComboBox内部我有一个包含图像和TextBlock的VirtualizingStackPanel：

<ComboBox.ItemTemplate>
                <DataTemplate>
                    <VirtualizingStackPanel Orientation="Horizontal">
                        <Image Width="30" Height="30" Margin="0" Source="{Binding code, Converter={StaticResource ImageComboBoxConverter}}" VerticalAlignment="Center"/>
                        <TextBlock Margin="5" Text="{Binding country_Text}"/>
                    </VirtualizingStackPanel>
                </DataTemplate>
            </ComboBox.ItemTemplate>

我正在使用一个简单的DataBinding转换器来检索我的标志文件。

问题是，列表需要大约3-4秒才能填充。我可以应用某种缓冲或缓存技术来加载图像吗？

Answer 1

您需要虚拟化ComboBox.ItemsPanel，而不是.ItemTemplate。 ItemsPanel是用于显示所有控件的面板，而ItemTemplate用于显示每个控件。

所有Virtualized StackPanel都不是不可见的渲染项。相反，它只渲染可见项（加上滚动缓冲区的一些额外内容），并在滚动时替换每个项后面的数据。因此，使用它来显示每个单独的项目是没用的，您需要将其用作面板来显示所有项目。

您的代码可能看起来像这样：

<ComboBox ItemsSource="{Binding Countries}">
    <ComboBox.ItemsPanel>
        <ItemsPanelTemplate>
            <VirtualizingStackPanel />
        </ItemsPanelTemplate>
    </ComboBox.ItemsPanel>

    <ComboBox.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <Image Width="30" Height="30" Margin="0" Source="{Binding code, Converter={StaticResource ImageComboBoxConverter}}" VerticalAlignment="Center"/>
                <TextBlock Margin="5" Text="{Binding country_Text}"/>
            </StackPanel >
        </DataTemplate>
    </ComboBox.ItemTemplate>
</ComboBox>

您可能还需要将一个或所有这些属性添加到<ComboBox>标记中。

<ComboBox VirtualizingStackPanel.IsVirtualizing="True"           
          VirtualizingStackPanel.VirtualizationMode="Recycling"
          ScrollViewer.CanContentScroll="True" ...>