Question

我正在尝试创建一个具有相当强大的DataTemplate的ListBox。问题是，性能难以想象地缓慢。在我的家用电脑上 - 大约2.5岁，绑定80行大约需要4-6秒。在我的工作计算机（64位/双核）上，时间减少到大约2.5秒，但仍然 - 似乎非常慢（150行需要大约4-5秒）

所有数据都是纯POCO，随机生成数据。此应用程序中的任何地方都没有任何服务（尚未）。数据的随机生成根本没有花费任何时间 - 我（粗略地）在创建数据之后，在ObservableCollection更新之前执行MessageBox.Show。（我甚至尝试绑定到一个普通的旧列表 - 甚至更慢）。另外，我在Chrome和IE上都试过了。

好的，这是代码，如果我遗漏了什么，请告诉我。就像我说的，它是一个强大的DataTemplate，但我认为这是SL / WPF的重点 - 他们可以做这样的酷事。我当然希望我做错了什么 - 这些是我通过的儿童大小的数据。

编辑 - 只是为了把答案放在首位，你没有理由告诉ListBox使用StackPanel作为ItemsPanelTemplate - 它默认显示垂直堆叠的项目，但是，不仅要指定像这样多余的StackPanel，它也完全破坏了性能。我删除了ItemsPanelTemplate，它工作得很漂亮。

<ListBox ItemsSource="{Binding Path=BookSource_oc}" ItemTemplate="{StaticResource BookDataTemplateMedium}" ScrollViewer.HorizontalScrollBarVisibility="Disabled" HorizontalAlignment="Stretch">
       <ListBox.ItemsPanel>
           <ItemsPanelTemplate>
               <StackPanel Margin="2" HorizontalAlignment="Stretch" x:Name="stackPanelItemsPanel">
               </StackPanel>
            </ItemsPanelTemplate>
       </ListBox.ItemsPanel>
</ListBox>

来自app.XAML的

：

    <DataTemplate x:Key="BookDataTemplateMedium">
        <Border CornerRadius="3" BorderThickness="2" BorderBrush="Black" Background="White">
            <Grid Margin="3">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="140"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <!-- removing this just to be sure it's not cause of bad perf <Image Grid.Column="0" Stretch="None" VerticalAlignment="Center" HorizontalAlignment="Left" Source="{Binding MediumImgURI}" Margin="7,0,0,0"/>-->
                <StackPanel HorizontalAlignment="Left" Grid.Column="1" Margin="5,0,10,0">
                    <TextBlock FontWeight="Bold" TextTrimming="WordEllipsis" Foreground="Black" ToolTipService.ToolTip="{Binding CurrentBook.Title}" Text="{Binding CurrentBook.Title}"/>
                    <Grid Margin="0,10,0,0">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="200"></ColumnDefinition>
                            <ColumnDefinition Width="270"></ColumnDefinition>
                            <ColumnDefinition Width="270"></ColumnDefinition>
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="150"></RowDefinition>
                        </Grid.RowDefinitions>
                        <StackPanel Grid.Column="0">
                            <local:vwAmazonReviewsRightToLeft></local:vwAmazonReviewsRightToLeft>
                            <local:vwPublisherInfoWithDateLeftToRight Margin="0,5,0,0"></local:vwPublisherInfoWithDateLeftToRight>
                            <local:vwPagesInfo></local:vwPagesInfo>
                            <StackPanel Orientation="Horizontal">
                                <TextBlock>Is Read </TextBlock>
                                <Image Margin="8,0,0,0" Stretch="None" Source="{Binding IsReadImgUri, Mode=OneWay}"></Image>
                            </StackPanel>
                            <HyperlinkButton Margin="0,5,0,0" NavigateUri="http://www.google.com" Content="View at Amazon"/>
                        </StackPanel>

                        <ListBox Grid.Column="1" Margin="0,2,0,0" ScrollViewer.HorizontalScrollBarVisibility="Disabled" VerticalAlignment="Top" BorderThickness="0" ItemsSource="{Binding CurrentBook.Subjects}" ItemTemplate="{StaticResource dataTemplateSubjectsLB}" />
                        <ListBox Grid.Column="2" Margin="10,2,0,0" ScrollViewer.HorizontalScrollBarVisibility="Disabled" VerticalAlignment="Top" BorderThickness="0" ItemsSource="{Binding CurrentBook.Authors}" ItemTemplate="{StaticResource dataTemplateAuthorsLB}" />
                    </Grid>
                </StackPanel>
            </Grid>
        </Border>
    </DataTemplate>

    <DataTemplate x:Key="dataTemplateSubjectsLB">
        <StackPanel>
            <StackPanel Orientation="Horizontal">
                <Image Source="Img/Bullets/Bullet_Purple.png"></Image>
                <TextBlock ToolTipService.ToolTip="{Binding Name}" Text="{Binding Name}"></TextBlock>
            </StackPanel>
        </StackPanel>
    </DataTemplate>

    <DataTemplate x:Key="dataTemplateAuthorsLB">
        <StackPanel>
            <StackPanel Orientation="Horizontal">
                <Image Source="Img/Bullets/Bullet_Red.png"/>
                <TextBlock ToolTipService.ToolTip="{Binding Name}" Text="{Binding Name}"/>
            </StackPanel>
        </StackPanel>
    </DataTemplate>

Answer 1

您已将默认VirtualPanel更改为StackPanel。为了获得更好的性能，我建议使用默认的ItemsPanel。

Answer 2

这是表现不佳的两个最常见原因：

难以计算的布局（在您的示例中很可能就是这种情况）。尝试设置固定的宽度和高度，避免伸展。
图形效果，如DropShadow，在软件中呈现：也许像Amazon-View这样的组件使用它们

您始终可以使用Wpf Performance Suite中的Perforator等Performance-Tools来深入研究问题。它肯定会帮助你找到瓶颈！

可怕的Silverlight性能 - ListBox

2 个答案: