在 xaml 中调整图像大小而不损失质量答案

【问题标题】：Resize image in xaml without losing quality在 xaml 中调整图像大小而不损失质量
【发布时间】：2013-10-18 14:01:59
【问题描述】：

我有这张图片（原始尺寸：256x256）

我做了这个 xaml 定义以在我的应用程序中显示图像

<Image Grid.Row="1" 
       Source="/MyProject;component/Images/happy.png" 
       Stretch="Fill" 
       Width="64" Height="64"  
       VerticalAlignment="Top" Margin="0,0,0,0" 
       HorizontalAlignment="Center" />

我得到了这个结果

如何进行更平滑的大小调整？

【问题讨论】：

您正在寻找矢量图形，而不是位图。
以下所有这些答案可能会产生更高质量的图像，但@HighCore 是正确的，因为您应该使用矢量，而不是位图图像。
@eranotzap 见this answer，它指向this tool。自己没有尝试过，但快速浏览一下就会发现它产生了非常好的效果。
@eranotzap 也，this tool
由于图像被缩小（像素总数减少），使用矢量源的优势相对较小，这只是混淆了问题。尝试使用位图到矢量的转换工具也没什么意义，您永远无法增加图像中已有的信息量。

标签： c# image xaml

【解决方案1】：

如上所述，设置RenderOptions.BitmapScalingMode="HighQuality" 会激活抗锯齿功能。我想为不知道什么是抗锯齿的用户提供一个示例。

没有这个设置：

<Image x:Name="InstrumentImage" />

使用此设置：

<Image x:Name="InstrumentImage" RenderOptions.BitmapScalingMode="HighQuality" />

在此处查看不同的选项：https://docs.microsoft.com/en-us/dotnet/api/system.windows.media.bitmapscalingmode?view=netframework-4.8

【讨论】：

【解决方案2】：

为您的Image 到.xaml 设置RenderOptions.BitmapScalingMode 属性：

<Image Grid.Row="1" RenderOptions.BitmapScalingMode="HighQuality" ... />

其他信息：

RenderOptions.BitmapScalingMode 是一个根据质量缩放图像的属性。 WPF 4.0默认为Unspecified，即LowQuality图片渲染。

但是为了保证图像在尺寸增加时仍然保持良好的质量，BitmapScalingMode 应该选择HighQuality。

这里是 BitmapScalingMode 枚举成员及其来自msdn 的描述：

1.Fant - 使用非常高质量的 Fant 位图缩放，比所有其他位图缩放模式慢，但产生更高的质量输出。

2.HighQuality - 使用高质量位图缩放，比 LowQuality 模式慢，但产生更高质量的输出。高品质模式与Fant模式相同。

3.Linear - 使用线性位图缩放，比 HighQuality 模式更快，但输出质量较低。

4.LowQuality - 使用双线性位图缩放，比 HighQuality 模式更快，但产生的输出质量较低。低质量模式与线性模式相同。

5.NearestNeighbor - 使用最近邻位图缩放，当软件使用时，它比 LowQuality 模式提供性能优势使用光栅化器。此模式常用于放大位图。

6.未指定 - 使用默认的位图缩放模式，即线性。

【讨论】：

"但是要确保图像在尺寸增加时保持良好的质量" --> 不仅是在尺寸增加时，还适用于其他图像操作，例如旋转或缩放（向上或向下）。理论上，使用 HighQuality 会对性能产生影响，但对于当前的硬件，它应该成为默认设置。这会导致巨大的质量差异，因为它似乎激活了抗锯齿功能。

【解决方案3】：

在您的图片中包含RenderOptions.BitmapScalingMode="Fant"，如下所示：

<Image Grid.Row="1"
       Source="/MyProject;component/Images/happy.png"
       RenderOptions.BitmapScalingMode="Fant"
       Stretch="Fill"
       Width="64"
       Height="64"
       VerticalAlignment="Top"
       Margin="0,0,0,0"
       HorizontalAlignment="Center" />

【讨论】：

+1 用于命名RenderOptions.BitmapScalingMode。 “NearestNeighbor”为我提供了最好的结果
墨尔本，你是在表单上设置了 UseLayoutRounding=true 还是在控件上设置了 SnapToDevicePixels=true ？如果不是，它将“模糊”设备像素之间的图像。