ObservableCollectionをリストボックス内のグリッドにバインドする

Question

今、リストボックス内にスクロールビューアとスタックパネルが配置され、データリストがビューリストのコレクションにバインドされています。

私はフォトリストクラスを持っています。このクラスはイメージのパスとパスを保持し、リストボックスにバインドしています。

<Style TargetType="{x:Type ListBox}"> 
    <Setter Property="Foreground" Value="White" /> 
    <Setter Property="Margin" Value="100"/> 
    <Setter Property="Template"> 
    <Setter.Value> 
     <ControlTemplate TargetType="{x:Type ListBox}" > 
      <ScrollViewer> 
      <StackPanel IsItemsHost="True" Orientation="Horizontal" HorizontalAlignment="Center"/> 
      </ScrollViewer> 
     </ControlTemplate> 
    </Setter.Value> 
    </Setter> 
</Style> 

上記のコードは、複数の画像をホストするスクロールバーとスタックパネルでリストボックスを正しく表示しています。

ここでは、画像が行列形式のように配置されるように、スクロールビューアとスタックパネルの代わりにグリッドを持つようにリストボックスを変更したいと思います。

フォトリストをグリッドにバインドするコードスニペットを入力してください（リストボックス内にあるスクロールビューア内）。

ご協力いただければ幸いです。

Answer 1

あなたはWrapPanelを使用して試みることができる、あなたはすべての細胞が必要な場合は、同じサイズは、ここからの回答を使用する：WPF WrapPanel - all items should have the same width

Answer 2

あなたはWrapPanelを使用するために、あなたのスタイルを変更する必要があります。

<Style TargetType="{x:Type ListBox}"> 
    <Setter Property="Foreground" Value="White" /> 
    <Setter Property="Margin" Value="100"/> 
    <Setter Property="ItemTemplate"> 
     <Setter.Value> 
      <DataTemplate> 
       <Border BorderThickness="1" Margin="6"> 
        <Image Source="{Binding Path=ImageUri}" Stretch="Fill" Width="100" Height="120" /> 
       </Border> 
      </DataTemplate> 
     </Setter.Value> 
    </Setter> 
    <Setter Property="ItemsPanel"> 
     <Setter.Value> 
      <ItemsPanelTemplate> 
       <WrapPanel /> 
      </ItemsPanelTemplate> 
     </Setter.Value> 
    </Setter> 
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" /> 
</Style>