将按钮大小设置为图像大小答案

【问题标题】：Set button size to size of image将按钮大小设置为图像大小
【发布时间】：2016-09-13 20:08:29
【问题描述】：

我在我的 WPF 项目中使用以下 XAML 在我的应用程序 GUI 上显示了几个按钮：

<Button Style="{DynamicResource NoChromeButton}" Click="backBtn_Click" Margin="0,0,0,0" HorizontalAlignment="Left" >
    <Image Source="C:\...\arrow_left.png" Height="30" Width="30" />
</Button>
<Button Style="{DynamicResource NoChromeButton}" Click="RefreshBtn_Click" Margin="0,0,0,0" HorizontalAlignment="Left" >
    <Image Source="C:\...\arrow_loop3.png" Height="30" Width="30" />
</Button>

但是，当我运行我的应用程序时，按钮似乎比我在它们上显示的图像的尺寸大 - 即图像是 30x30，但按钮是矩形的，而不是方形的，它们的高度是大于它们的宽度。

我正在将按钮彼此相邻绘制，并与其他几个按钮排成一行，以在应用程序窗口的顶部提供“菜单栏”外观。但是，由于这些按钮的高度显示的值大于我设置的值，因此菜单栏上会显示一些“空白”，在其他按钮的上方和下方显示高度值我已经设置了，例如：

<Button Style="{DynamicResource NoChromeButton}" Click="referThis" Margin="0,0,0,0" HorizontalAlignment="Left" HorizontalContentAlignment="Left" Height="30" Width="80">
    <TextBlock>Send Reference</TextBlock>
</Button>

使用此按钮，似乎因为我显示的是文本而不是图像，所以它保持了我设置的高度和宽度值，但这意味着它上面有一些“空白”在它下方，因为其他按钮导致我放置这些按钮的<StackPanel> 占用了比我预期的更多的垂直空间。

如何强制显示图像的按钮以我设置的尺寸显示？

编辑

这似乎与我在运行应用程序时手动调整窗口大小时发生的情况有关 - <StackPanel>/<TabPanel> 在调整窗口大小时自动调整大小......我已经设置了@ <StackPanel> 的 987654326@ 到一个特定的值，这意味着按钮都被限制为那个大小，所以它们都保持相同的大小，这很棒。

但是，当我调整窗口大小时，这会导致它们所在的 <TabPanel> 被调整大小，所以我最终会在按钮上方和下方出现空白 - 有没有办法可以阻止这种情况？

【问题讨论】：

标签： c# wpf image button

【解决方案1】：

将按钮的 VerticalAlignment 设置为顶部。在按钮而不是图像上设置所需的宽度/高度。通过Margin 属性执行此操作。另请查看Alignment on MSDN。然后将图像的拉伸设置为 Stretch.Fill。

另外，你的风格可能会让你失望，因为这个

<Button VerticalAlignment="Top" HorizontalAlignment="Left" Margin="0">
        <Image Width="30" Height="30" />
</Button>

非常适合我。

【讨论】：

【解决方案2】：

这段代码正是你想要的：

<Button Width="100" Height="100" Padding="0" BorderThickness="0">
    <Image Source="image.jpg" Stretch="Fill"/>
</Button>

注意使图像适合按钮的 Padding 和 BorderThickness 值。正如RoyalPotato所说，您可以更改按钮的宽度和高度，并且图像大小将被动态拉伸。

【讨论】：