WPF：按钮中的奇怪图像拉伸

Question

我有多个按钮，每个按钮都有一个32x32像素的PNG图像。奇怪的是，两个按钮显示不同的大小（是的，我三重检查图标真的是32x32！）。秒按钮看起来像48x48像素大小。最有趣的是，如果省略Stretch="None"属性，图标会按比例放大以填充整个屏幕。

我无法解释自己为何会发生这种情况！

    

    <ToolBar Name="toolBar1" DockPanel.Dock="Top">
        <Button Name="importButton" ToolTip="Import" Click="importButton_Click">
            <Image Source="Icons/Import.png" Stretch="None" />
        </Button>
        <Button Name="toggleDetails" ToolTip="Details for Item" Click="toggleDetails_Click">
            <Image Source="Icons/maximize.png" Stretch="None" />
        </Button>           
    </ToolBar>

    <StackPanel Name="stackPanel1" DockPanel.Dock="Top" Orientation="Horizontal" Margin="0,5,0,5">
        <Label  Name="label2" Content="Find"></Label>
        <TextBox  Name="tags" Width="400" KeyDown="tags_KeyDown" />
        <Button ToolTip="Find" Name="findItemsButton" Click="findItemsButton_Click">
            <Image Source="Icons/xmag.png" Stretch="None" />
        </Button>
        <CheckBox Content="Show Closed" Name="showClosedItemsCheckBox" VerticalAlignment="Center" Margin="10,0,0,0" Click="showClosedItemsCheckBox_Click" />
    </StackPanel>
    <TabControl  Name="tabControl" TabStripPlacement="Top">

    </TabControl>

</DockPanel>

Answer 1

这两张图片可能有不同的DPI。

Answer 2

如果您为Stretch="None"设置Image，但它仍然看起来更大/更小/更模糊，那么可能是因为DPI不匹配。

例如，PNG文件存储DPI。 Windows有一个特定的DPI。检查系统DPI并检查PNG DPI。

在Photoshop中，您可以转到Image -> Image Size，它会显示点/英寸框。您也可以使用它来更改DPI。确保禁用Resample Image复选框，以便仅更改DPI。您需要使用Save for Web对话框来保存更改，因为正常Save As将无法保存该信息。

在我的情况下，我有一个大小为24x24的PNG文件和一个DPI 72.009，我的系统是默认的DPI。使用Photoshop并使用Save for Web将PNG DPI从72.009调整为72后，图片看起来更大，更模糊。

Answer 3

要跟进SLAK答案：要使用图像的像素尺寸而不考虑DPI，您可以将宽度和高度绑定到像素的宽度和像素高度

<Button Name="toggleDetails" ToolTip="Details for Item" Click="toggleDetails_Click">  
    <Image Source="Icons/maximize.png"
           Stretch="None"
           Width="{Binding RelativeSource={RelativeSource Self}, Path=Source.PixelWidth}"
           Height="{Binding RelativeSource={RelativeSource Self}, Path=Source.PixelHeight}"/>
</Button>