StackPanel中的网格:为什么auto和*表现得很奇怪？

Question

我的google和stackoverflow search-fu让我失望了,所以我向社区提出了这个问题.

(这是使用VS2010和.NET 4.0生成的,在一个空白的默认WPF解决方案中)

考虑以下XAML:

<StackPanel Orientation="Horizontal">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="20"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

        <Border Name="aborder" Grid.Column="0" Grid.ColumnSpan="2" 
                    Background="Red" Width="200"/>
        <Border Name="aborder2" Background="Green"/>

    </Grid>
</StackPanel>

你会预测"aborder2"的宽度是多少？

如果你猜到"20像素",你就错了.正确的答案是110像素.

考虑一下这个XAML:

    <StackPanel Orientation="Horizontal">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="20"/>
            <ColumnDefinition Width="Auto"/>
        </Grid.ColumnDefinitions>

        <Border Name="aborder" Grid.Column="0" Grid.ColumnSpan="2" 
                    Background="Red" Width="200"/>
        <Border Name="aborder2" Background="Green"/>

    </Grid>
</StackPanel>

你会预测"aborder2"的宽度是多少？

如果你猜到20像素或110像素,你就错了.正确答案是200像素.

我无法弄明白这一点,这让我感到疯狂.似乎答案应该是显而易见的; 显然,自动填充网格列和堆栈面板之间存在一些相互作用,导致网格发生故障.但它似乎没有意义 - 无论规则如何,这种行为似乎都是武断的.为何110像素？为什么不是109像素或100像素？我会理解,如果自动调整大小的列无法完全展开或者某些东西,但是为了让固定宽度列随机忽略它的宽度,我会给开发人员留下一个烧焦的外壳.

任何帮助或指导灯将非常感谢!

Answer 1

我不知道为什么第一个例子没有正确渲染

第二个是因为Auto意味着“与内容大小相同”，但是在 Column2 中没有任何内容，因此 Column2 以 0px 呈现。您在 Column1 中有一些东西跨越 2 个单元格，但由于 Column2 以 0 px 呈现，这意味着 Column1 被拉伸到 200 px。默认情况下，Grid 扩展其子项以填充单元格中的所有可用空间，因此将aborder2拉伸到 200 像素而不是 20 像素。

我认为第一个示例可能是类似的情况，其中 Column2 由于没有内容而以 0px 呈现，但是我不确定为什么将其设置aborder2为 110。110 似乎来自(GridWidth / TotalColumns) + (1stColumnWidth / TotalColumns * NumberOfStarColumns)，所以我认为它是漏洞。

作为旁注，您可以设置 Column1MaxWidth="20"以强制 Column1 始终呈现为 20px