スクロール中のWPF複数列リストボックスのパフォーマンス

Question

どのようにして、パフォーマンスの良いWPFで複数列ListView/ListBoxを作成できますか。私はWrapPanelでそれを行う方法を知っています。リストボックスには、約70〜150アイテムがあり、スクロールは遅すぎる/流暢ではありません（VirtualStackPanelのように）。あなたはこの問題を解決する方法を知っていますか？ ありがとうここ

は、リストボックスの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プロパティを使用して、イメージのバインディングを非同期にすることができます。

もう1つの方法は、品質を追求しているため、オプションではない視覚ツリーを減らすことです。レイアウトをDataTemplateから専用のUserControlに移動し、コントロールが表示されているとき（VisibilityChangedイベントまたは四角形が交差している場合）にのみイメージを読み込むことができます。