WPF布局问题：如何让顶部元素填充剩余空间，底部元素固定高度？

要实现底部元素固定高度、顶部元素填充剩余空间的布局，核心是正确配置父Grid的行定义，而非仅依赖子元素的VerticalAlignment属性。

正确实现代码 #

<Grid>
    <!-- 定义两行：第一行占满剩余空间，第二行固定高度 -->
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="100"/>
    </Grid.RowDefinitions>

    <!-- 顶部元素，放置在第一行，自动填充剩余空间 -->
    <Grid Grid.Row="0"></Grid>
    <!-- 底部元素，放置在第二行，固定高度100 -->
    <Grid Grid.Row="1" Height="100"></Grid>
</Grid>

为什么之前的代码无效 #

• 重叠情况：未定义Grid.RowDefinitions时，所有子元素默认都放在第0行，因此两个Grid会重叠，设置VerticalAlignment无法改变行的分配规则。
• 顶部高度为0：顶部Grid未指定高度，且父Grid没有为它分配可用空间，因此高度默认收缩为0。

给WinForms转WPF开发者的提示 #

WPF的布局范式与WinForms完全不同：WinForms中元素自行定义位置和大小，而WPF中父容器主导子元素的布局规则。99%的情况下，仅设置子元素自身属性却不配置父容器的布局规则是无效的。

内容的提问来源于stack exchange，提问作者Marcos