让用户界面虚拟化在Silverlight中使用ItemsControl [英] Getting UI virtualization working with ItemsControl in Silverlight

问题描述

我正在尝试创建一个相当大的文本块的滚动列表。我希望有一个垂直滚动条来显示它们，如果它们溢出到一定大小，我希望它们显示一个省略号。事实上，我把这一切都做得很好。

我有以下Silverlight XAML：

<Grid x:Name="LayoutRoot" MaxWidth="500" MinWidth="100"
    MaxHeight="500" MinHeight="100">
    <Grid.DataContext>
        <app:MainPageViewModel/>
    </Grid.DataContext>
    <ScrollViewer>
    <ItemsControl ItemsSource="{Binding TextItems}" Margin="0,20,0,20">
        <ItemsControl.ItemTemplate><DataTemplate>
            <Border MaxHeight="175" Margin="0,0,0,18" CornerRadius="5">
                <TextBlock Margin="2" TextTrimming="WordEllipsis"
                     TextWrapping="Wrap" Text="{Binding}"/>
            </Border>
         </DataTemplate></ItemsControl.ItemTemplate>
    </ItemsControl>
    </ScrollViewer>
</Grid>

我的问题是，此布局不使用UI虚拟化，例如使用VirtualizingStackPanel。所以它是相当慢的。将用户界面虚拟化引入此布局的最佳方式是什么？我尝试了大约六种不同的方法，但都没有那么好的结果。

我设法在列表框中实现了这一点，因为它似乎支持开箱即用的虚拟化。但是，我更喜欢使用ItemsControl，因为我不希望这些内容是可选的，也不希望列表框附带的样式。

这是Silverlight 4中的功能。

推荐答案

要使此功能正常工作，您需要执行几项操作。

1. 为设置ItemsPanelTemplate 将ItemsControl设置为 VirtualizingStackPanel。
2. 将ScrollViewer合并到 您的控件模板 ItemsControl而不仅仅是 把它包在外面。
3. 确保ItemsControl具有固定高度，以便布局系统可以计算出需要填充视区的项数。(看起来您已经在通过将ItemsControl放在一个网格中来执行此操作-这将允许布局系统确定该控件的分配高度)

这是我能想到的最简单的工作示例：

    <ItemsControl ItemsSource="{Binding TextItems}">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <VirtualizingStackPanel />
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.Template>
            <ControlTemplate TargetType="ItemsControl">
                <Border>
                    <ScrollViewer>
                        <ItemsPresenter/>
                    </ScrollViewer>
                </Border>
            </ControlTemplate>
        </ItemsControl.Template>
    </ItemsControl>

这篇关于让用户界面虚拟化在Silverlight中使用ItemsControl的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！