c# - 具有动态原始数据和列的 ListView

Question

我正在开发一个 WPF 应用程序。

有一个用户控件列表

   <Grid >
        <ListView ItemsSource="{Binding MyList}"  HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" >
            <ListView.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapPanel Orientation="Vertical" ItemWidth="{Binding (ListView.View).ItemWidth, RelativeSource={RelativeSource AncestorType=ListView}}"
                   MinWidth="{Binding ItemWidth, RelativeSource={RelativeSource Self}}"
                   ItemHeight="{Binding (ListView.View).ItemHeight, RelativeSource={RelativeSource AncestorType=ListView}}"/>
                </ItemsPanelTemplate>
            </ListView.ItemsPanel>
            <ListView.ItemTemplate >
                <DataTemplate >
                    <Views:MyUserControl Height="auto" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" SnapsToDevicePixels="True"/>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </Grid>

MyUserControl 有另一个用户控件列表“DetailUserControl”：

<UserControl x:Class="MyUserControl"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" 
         d:DesignHeight="300"  d:DesignWidth="300" >

<Grid >
    <Grid.RowDefinitions>
        <RowDefinition Height="45" />
        <RowDefinition  />
    </Grid.RowDefinitions>
    <Border Grid.RowSpan="2" >
        <StackPanel VerticalAlignment="Top" Orientation="Horizontal" HorizontalAlignment="Center" >
            <TextBlock  VerticalAlignment="Center" HorizontalAlignment="Center" Margin="10"   Text="{Binding Title}" />
        </StackPanel>
    </Border>
    <Border Grid.Row="1" Style="{StaticResource SummaryInnerFill}" >
        <ItemsControl ItemsSource="{Binding DetailUserControls}"  >
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapPanel />
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>

        </ItemsControl>

    </Border>

</Grid>

我使用换行面板使所有用户控件从左到右依次排列。

我希望优化布局并尽可能多地使用第一行，然后它才会移动到第二行。

这是一个例子（对不起我的绘画技巧:)）

我有以下布局：

如果我更改图块内的顺序，我可以具有以下布局（包含相同的图块但不浪费空间，并且更有条理）：

有没有我可以使用的面板来处理它？

Answer 1

您可以使用统一控制网格。您可以指定行和列属性。控件按照声明的顺序添加到网格中。其子控件组织成行和列的表格结构。与 Grid 控件不同，您没有对布局的细粒度控制。

例子，

 <UniformGrid Name="uniformGrid1"
             Rows="2"
             Columns="3">
    <Button Content="blah"
             Margin="2" />
    <Button Content="blah1"
             Margin="2" />
    <Button Content="blah2"
            Margin="2" />
</UniformGrid>

统一网格