Silverlight 网格布局定义中的“*”和“Auto”有什么区别

Question

试图理解以下内容：

<Grid Name="Root">
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="Auto" />
    </Grid.ColumnDefinitions>
</Grid>

谁能帮我解释一下上面 sn-p 中 * 和 Auto 之间的区别？

谢谢

Answer 1

Auto 表示为该列/行指定包含项目的大小。

* 表示与同样指定* 的其他列/行共享剩余的可用空间。

实际上* 等价于1*。可以为宽度或高度指定2*、3* ... N*。 Silverlight 使用的算法是使用* 对所有行的所有 N 值求和，然后为每一行分配适当的可用空间份额。例如：-

<Grid.RowDefinitions>
    <RowDefinition Height="*" />
    <RowDefinition Height="2*" />
    <RowDefinition Height="3*" />
    <RowDefinition Height="Auto" />
</Grid.Definitions>

这将首先从其内容中确定第四行需要多高，然后从完整的可用高度中减去该高度。剩余的高度将在* 行之间进行划分。第一个得到 1/6，第二个得到 1/3，第三个得到可用高度的 1/2。

Answer 2

Auto 将调整每个列的大小，以便它可以容纳其中包含的任何内容。

* 将使用最大的可用空间。当您有一个“剩余”列并且您想将其大小调整为剩余的任何内容时，最好使用它。

宽度未定义的示例网格。

场景 1：

Column 1  | Column 2  | Column 3
----------------------------------
100 Width | Auto      | 200 Width

在这种情况下，第 2 列可以是介于 1 和放入其中的内容所需的任何内容以及网格宽度可用的最大空间之间的任何值。如果将第 2 列更改为 * 并在整个网格上定义一个宽度，它将填充剩余的空间以实现网格的宽度。如果您将两列设置为*，并定义了网格宽度，那么它们将竞争剩余空间并将其拆分。

如果我有一个设置为动态大小的控件，我通常只使用* 最多一列（尽管这不是规则），以便该列将填充其他列留下的任何空间.如果您希望动态大小的控件具有特定大小的列，并且希望某些列保持固定并定义一列以展开以填充控件的其余部分，那就太好了。 Auto 不会对实际上不会填充剩余空间的空列或内容低的列执行此操作。

场景 2（列 3 包含宽度为 100 的内容，网格的总宽度为 800）：

Column 1  | Column 2  | Column 3  | Column 4
--------------------------------------------
100 Width | 200 Width | Auto      | *

然后，第 3 列的宽度将仅为 100。第 4 列将调整为 400 宽以填充剩余空间。

Answer 3

This page（诚然来自 Silverlight 2，但它仍然有效）有一些使用网格的示例，解释如下：

对于 Grid 中的每一行，我们都有一个 RowDefinition 元素。所有行定义都包含在 Grid.RowDefinitions 元素中。我们的前两行是 50 像素高，第三行的高度设置为“*”。这表明该行将占据 Grid 中其他行未占据的整个位置。

和：

另一个选项是将宽度和/或高度设置为“自动”。这样，每列/行都会更改其大小，以匹配其中控件的宽度/高度。例如：