如何在网格上均匀分布一组列表框？

Question

我正在为应用程序设置视图，但我想将 12 个列表视图均匀分布在网格容器上。目前有些盒子与其他盒子相比间距不均匀，我也想在不使用边距的情况下这样做。

我已经使用 row/column 定义将按钮正确定位在中心，但不确定我将如何利用它来均匀分布列表框。

有谁知道如何使用网格和列设置而不是边距来设置它？

这是我目前在一个网格内设置网格的方式：

<Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="90*" />
            <RowDefinition Height="10*" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>

        <ListView x:Name="subjectOneBtn"
                  Grid.ColumnSpan="2"
                  Width="211"
                  Height="48"
                  Margin="10,42,0,0"
                  HorizontalAlignment="Left"
                  VerticalAlignment="Top" />
        <ListView x:Name="subjectTwoBtn"
                  Grid.ColumnSpan="2"
                  Width="211"
                  Height="48"
                  Margin="10,94,0,0"
                  HorizontalAlignment="Left"
                  VerticalAlignment="Top" />
        <ListView x:Name="subjectThreeBtn"
                  Grid.ColumnSpan="2"
                  Width="211"
                  Height="48"
                  Margin="10,171,0,0"
                  HorizontalAlignment="Left"
                  VerticalAlignment="Top" />
        <ListView x:Name="subjectFourBtn"
                  Grid.ColumnSpan="2"
                  Width="211"
                  Height="48"
                  Margin="10,223,0,0"
                  HorizontalAlignment="Left"
                  VerticalAlignment="Top" />
        <ListView x:Name="subjectFiveBtn"
                  Grid.ColumnSpan="2"
                  Width="211"
                  Height="48"
                  Margin="10,296,0,0"
                  HorizontalAlignment="Left"
                  VerticalAlignment="Top" />
        <ListView x:Name="subjectSixBtn"
                  Grid.ColumnSpan="2"
                  Width="211"
                  Height="48"
                  Margin="10,372,0,0"
                  HorizontalAlignment="Left"
                  VerticalAlignment="Top" />
        <ListView x:Name="gradeOneBtn"
                  Grid.Column="2"
                  Width="49"
                  Height="48"
                  Margin="9.333,42,0,0"
                  HorizontalAlignment="Left"
                  VerticalAlignment="Top" />
        <ListView x:Name="gradeTwoBtn"
                  Grid.Column="2"
                  Width="49"
                  Height="48"
                  Margin="9.333,94,0,0"
                  HorizontalAlignment="Left"
                  VerticalAlignment="Top" />
        <ListView x:Name="gradeThreeBtn"
                  Grid.Column="2"
                  Width="49"
                  Height="48"
                  Margin="9.333,171,0,0"
                  HorizontalAlignment="Left"
                  VerticalAlignment="Top" />
        <ListView x:Name="gradeFourBtn"
                  Grid.Column="2"
                  Width="49"
                  Height="48"
                  Margin="9.333,223,0,0"
                  HorizontalAlignment="Left"
                  VerticalAlignment="Top" />
        <ListView x:Name="gradeFiveBtn"
                  Grid.Column="2"
                  Width="49"
                  Height="48"
                  Margin="9.333,296,0,0"
                  HorizontalAlignment="Left"
                  VerticalAlignment="Top" />
        <ListView x:Name="gradeSixBtn"
                  Grid.Column="2"
                  Width="49"
                  Height="48"
                  Margin="9.333,372,0,0"
                  HorizontalAlignment="Left"
                  VerticalAlignment="Top" />
        <Button x:Name="calculateBtn"
                Grid.Row="1"
                Grid.Column="1"
                VerticalAlignment="Center"
                Content="Calculate" />
    </Grid>

Answer 1

您可以使用两个 StackPanel，其中一个带有 Orientation="Horizontal"。您只需要知道一行中有多少个元素。

<StackPanel>
    <StackPanel Orientation="Horizontal">
        <ListView.../>
        <ListView.../>
        <ListView.../>
        <ListView.../>
    </StackPanel>
    <StackPanel Orientation="Horizontal">
        <ListView.../>
        <ListView.../>
        <ListView.../>
        <ListView.../>
    </StackPanel>
    ...
</StackPanel>

如何在网格上均匀分布一组列表框？

How to evenly distribute a set of list boxes over a grid?

grid

listview

position

windows-phone-8.1