Question

如何在WPF中创建具有良好性能的多列ListView / ListBox。我知道如何使用WrapPanel。在ListBox中，我有大约70-150个项目，滚动是滞后/不太流畅（像VirtualStackPanel一样）。你知道如何解决这个问题吗？谢谢

这是ListBox XAML

<ListBox x:Name="ListBoxSubtitles" VirtualizingStackPanel.IsVirtualizing="True"   Margin="0,0,0,0" ItemsSource="{Binding Subtitle,Mode=TwoWay}" Grid.Row="1" ScrollViewer.HorizontalScrollBarVisibility="Disabled" BorderBrush="{x:Null}" Background="#FFEEECEC"
                >
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapPanel Orientation="Horizontal" />
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>

                <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid Width="520" Height="150" Background="#FF424242" Margin="5,5,5,0">

                        <Grid.RowDefinitions>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>

                            <ColumnDefinition Width="85"/>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>
                        <Image Source="{Binding PosterImgUri,Mode=TwoWay}" Grid.ColumnSpan="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Stretch="UniformToFill">
                            <Image.Effect>
                                <BlurEffect Radius="40" />
                            </Image.Effect>
                        </Image>
                        <Image Width="75" Height="110" Grid.Column="0" Margin="2,2,2,2" VerticalAlignment="Top" HorizontalAlignment="Stretch" Source="{Binding PosterImgUri,Mode=TwoWay}" Stretch="Fill"/>

                        <Label Grid.Column="0" Content="86%" HorizontalAlignment="Center" Margin="0,0,0,0" VerticalAlignment="Bottom" Background="{x:Null}" Foreground="White" FontFamily="Segoe UI Semibold" FontSize="18" FontWeight="Bold"/>
                        <StackPanel Grid.Column="1">
                            <Label   HorizontalAlignment="Left" Margin="0,0,0,0" VerticalAlignment="Top" Background="{x:Null}" Foreground="White" FontFamily="Segoe UI Semibold" FontSize="25" FontWeight="Bold">
                                <TextBlock TextWrapping="Wrap" Text="{Binding SubtitleName,Mode=TwoWay}">
                                </TextBlock>
                            </Label>
                            <Grid>
                                <Label Content="Stažení:"  HorizontalAlignment="Left" Margin="0,-7,0,0" VerticalAlignment="Top" Background="{x:Null}" Foreground="White" FontFamily="Segoe UI Light" FontSize="18"/>
                                <Label Content="{Binding subtitleName,Mode=TwoWay}" HorizontalAlignment="Left" Margin="65,-7,0,0" VerticalAlignment="Top" Background="{x:Null}" Foreground="White" FontFamily="Segoe UI Light" FontSize="18"/>
                            </Grid>
                            <Grid Width="100" Height="20" Margin="0,0,0,0" HorizontalAlignment="Left">
                                <ProgressBar Value="50" HorizontalAlignment="Stretch" VerticalContentAlignment="Stretch" Margin="7,0,0,0"   Foreground="#FF84E60F" Background="White"/>
                                <Label Margin="0,-2,0,0" HorizontalAlignment="Center"  VerticalAlignment="Center" Content="50" FontSize="10" FontWeight="Bold"></Label>
                            </Grid>
                        </StackPanel>


                    </Grid>



    </DataTemplate>
    </ListBox.ItemTemplate>
    </ListBox>

另外我想问一下，当鼠标聚焦项目时如何删除这个蓝色选择。

Answer 1

您需要一个虚拟化包装面板。不幸的是，编写这样的面板并不容易，大多数好的实现要么不是免费的，要么不适用于任意复杂的数据模板。

您可以使用IsAsync属性使图像绑定异步。

另一种方法是减少视觉树，这不是一种选择，因为你追求质量。您可以将布局从DataTemplate移动到专用的UserControl中，并仅在控件可见时加载图像（VisibilityChanged事件或基于矩形交叉）。

滚动时WPF多列列表框性能

1 个答案: