如何使工具栏按钮共享相同的宽度？

Question

我有一个工具栏

代码：

<ToolBarTray>
    <ToolBar>
        <Button>
            <StackPanel>
                <Image/>
                <Label/>
            </StackPanel>
        </Button>
        <Button>
            <StackPanel>
                <Image/>
                <Label/>
            </StackPanel>
        </Button>
        <Button>
            <StackPanel>
                <Image/>
                <Label/>
            </StackPanel>
        </Button>
    </ToolBar>
</ToolBarTray>

在图片上我只设置了Source，而在标签上我只设置了Content。

然而，如图所示，按钮没有共享相同的宽度。 ＆＃34;删除＆＃34;按钮比其他按钮宽。

如何制作它以便所有工具栏按钮的共享宽度与＆＃34;删除＆＃34;相同？按钮？

Answer 1

您可以同时设置所有按钮Width的一种方法是在Setter中使用ToolBar.Resources，如下所示：

<ToolBar>
  <ToolBar.Resources>
    <Style x:Key="{x:Static ToolBar.ButtonStyleKey}" TargetType="Button">
      <Setter Property="Width" Value="80"/>
    </Style>
  </ToolBar.Resources>
  <Button>
  ...
  <Button>
  ...
</ToolBar>

这样，您无需单独手动设置每个Button的宽度。

您还可以使用Setter设置Stretch属性，如下所示：

      <Setter Property="Stretch" Value="None"/>

修改

显然，根据https://stackoverflow.com/a/2406213/3101082，您需要确保使用Style设置x:Key="{x:Static ToolBar.ButtonStyleKey}"，以便将其应用于ToolBar按钮。我已经更新了我的答案以反映这一点。

Answer 2

这可能会有效，我还没有对它进行测试，但是通过指定按钮的宽度和图像缩放，您应该会发现它可以解决问题。

<Button Width="intValue">
   <StackPanel>
       <Image Source="yourImage" 
              RenderOptions.BitmapScalingMode="Fant" />
       <Label/>
   </StackPanel>
</Button>