如何在WPF/XAML中创建类似Windows截图工具的响应式工具栏？

要做这种组间距自动调整、每组宽度固定的工具栏，用Grid布局就搞定了，关键是给按钮组设固定宽度的列，组之间用自动占满剩余空间的列当自适应间距。直接上代码：

<Window x:Class="ScreenshotToolbarDemo.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="截图工具栏" Height="100" MinWidth="450"> <!-- MinWidth设成三组总宽度，防止窗口缩太小 -->
    <Grid>
        <!-- 5列布局：组1（固定宽）+ 自适应间距1 + 组2（固定宽）+ 自适应间距2 + 组3（固定宽） -->
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="150"/> <!-- 第一组固定宽度 -->
            <ColumnDefinition Width="*"/>   <!-- 第一个间距自动填剩余空间 -->
            <ColumnDefinition Width="150"/> <!-- 第二组固定宽度 -->
            <ColumnDefinition Width="*"/>   <!-- 第二个间距自动填剩余空间 -->
            <ColumnDefinition Width="150"/> <!-- 第三组固定宽度 -->
        </Grid.ColumnDefinitions>

        <!-- 第一组按钮 -->
        <StackPanel Grid.Column="0" Orientation="Horizontal" HorizontalAlignment="Center" Margin="5">
            <Button Content="矩形截图" Width="70" Margin="2"/>
            <Button Content="窗口截图" Width="70" Margin="2"/>
        </StackPanel>

        <!-- 第二组按钮 -->
        <StackPanel Grid.Column="2" Orientation="Horizontal" HorizontalAlignment="Center" Margin="5">
            <Button Content="全屏截图" Width="70" Margin="2"/>
            <Button Content="自由截图" Width="70" Margin="2"/>
        </StackPanel>

        <!-- 第三组按钮 -->
        <StackPanel Grid.Column="4" Orientation="Horizontal" HorizontalAlignment="Center" Margin="5">
            <Button Content="保存" Width="70" Margin="2"/>
            <Button Content="取消" Width="70" Margin="2"/>
        </StackPanel>
    </Grid>
</Window>

重点说明： #

• 列布局逻辑：5列里，第1、3、5列是固定宽度，对应三个按钮组；第2、4列用Width="*"，这两列会自动平分窗口的剩余空间，窗口放大时间距自动变宽，缩小时间距自动变窄，完全符合需求。
• 最小窗口宽度：把MinWidth设成三个固定列的宽度总和（150×3=450），这样窗口不会缩到显示不全按钮组。
• 组内排版：每组用StackPanel横向排按钮，加上HorizontalAlignment="Center"让组内按钮居中，视觉上更整齐。

之前用Grid出问题，大概率是没给按钮组列设固定宽度，或者没留出自适应间距的列。这个方案里固定列始终保留，中间列只调间距，不会挤压按钮组，也就不会出现内容消失的情况。

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