Question

好的，我想做的事情很简单：

我正在获取一个图像列表（使用绑定），我试图以类似于表的网格显示（每行3个图像）
怎么办呢？

  <ListBox.ItemTemplate>
       <DataTemplate>

           <Image Height="100" Width="100" Margin="12,0,9,0" Source="{Binding AlbumArt}"/>

       </DataTemplate>
  </ListBox.ItemTemplate>

这样，图像是属性显示，但不是我想要的方式 - 它们显示在另一个之下而不是像：

A B C
D E F
G H I

如何做到这一点？有什么想法吗？

Answer 1

一个很好的解决方案是使用UniformGrid及其columns属性和ItemsControl。例如：

<ItemsControl ItemsSource="{Binding AlbumArt}">
 <ItemsControl.ItemsPanel>
   <ItemsPanelTemplate>
     <UniformGrid Columns="3"/>
   </ItemsPanelTemplate>
 </ItemsControl.ItemsPanel>
 <ItemsControl.ItemTemplate>
   <DataTemplate>
     <Image Height="100" Width="100" Margin="12,0,9,0" Source="{Binding}"/>
   </DataTemplate>
 </ItemsControl.ItemTemplate>
</ItemsControl>

这样您将获得所需的结果。在此处阅读有关UniformGrid的更多信息：MSDN 你的解决方案不起作用的原因是，Listbox面板将项目置于另一个之下，而UniformGrid将它们从左向右放置，直到有可用空间或达到列限制然后沿着行向下移动。

Answer 2

您可以使用两个StackPanel，一个具有垂直方向，另一个具有水平方向。这是您的代码编辑，包括它们：

<ListBox.ItemTemplate>
    <DataTemplate>
        <StackPanel Orientation="Verticle">
            <StackPanel Orientation="Horizontal">

                <Image Height="100" Width="100" Margin="12,0,9,0" Source="{Binding AlbumArt}"/>

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

Tile Grid with Bindings？

2 个答案: