如何让DockPanel内对象随窗口大小调整自动扩展缩放

两个问题导致元素无法随窗口缩放：

• 你给ScrollViewer和Button都写死了固定Width值，元素尺寸被硬编码锁死，自然不会跟着容器大小变化。
• 你没有给DockPanel的子元素指定DockPanel.Dock停靠属性，所有元素默认靠左堆叠，根本没触发DockPanel的自动填充布局逻辑。

DockPanel的核心布局规则：最后一个未显式设置DockPanel.Dock属性的子元素，会自动占满剩下的所有可用空间，只要你给元素设了固定宽高，就会直接覆盖这个自动拉伸的行为。

1. 删掉ScrollViewer上写死的Width="405"、Button上写死的Width="406"，不要给需要自适应的元素设置固定宽高值。
2. 为需要停靠的元素添加DockPanel.Dock附加属性，指定停靠方向（Top/Bottom/Left/Right），需要填充剩余空间的元素放在XAML的最后，不要设置固定尺寸。
3. 如果需要内部的Image跟随容器缩放，给Image设置Stretch属性，选择合适的缩放模式：
   • Uniform：等比缩放图片，不裁剪，完整显示在容器内
   • UniformToFill：等比缩放图片填满容器，超出部分会被裁剪
   • Fill：直接拉伸图片填满容器，可能会变形

下面是按钮停靠在底部、图片区域自动填充剩余空间的自适应示例：

<DockPanel HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
    <!-- 按钮停靠在DockPanel底部，仅固定高度，宽度自动撑满整行 -->
    <Button DockPanel.Dock="Bottom" Height="40" Content="确认操作"/>
    <!-- 滚动视图作为最后一个子元素，自动填充按钮之外的所有剩余空间 -->
    <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
        <Image Source="/myImage.png" Stretch="Uniform"/>
    </ScrollViewer>
</DockPanel>

• 如果你需要两个元素横向排列、按比例分配宽度（比如各占50%），不建议用DockPanel实现，换成Grid布局，给列定义设置星号（*）宽度即可，缩放时会自动按比例调整尺寸。
• 如果需要保留元素的尺寸边界，可以用MinWidth/MaxWidth/MinHeight/MaxHeight设置约束，不要直接写死固定的Width/Height。

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