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

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

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

在 Photoshop 中，您可以转到 Image ->图像大小，它将显示点数/英寸框。您还可以使用它来更改 DPI。确保禁用Resample Image复选框，以便仅更改 DPI。您需要使用另存为Web对话框来保存该更改，因为普通的另存为不会保存该信息。

就我而言，我有一个大小为 24x24 的 PNG 文件，DPI 72.009，我的系统是在默认 DPI 下。图片看起来更大、更模糊，现在使用 Photoshop 将 PNG DPI 从 72.009 调整为 72 并使用另存为 Web 后就可以了。

Answer 3

要跟进 SLAks 答案：要使用图像的像素尺寸（无论 DPI 如何），您可以将宽度和高度绑定到源的 PixelWidth 和 PixelHeight，如下所示

<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>