c# - 无论如何在 WPF 中模糊图像

Question

我有一个带有图像的按钮，无论我做什么，图像在渲染/编译后看起来都很模糊。

仅供引用 - 当不在 WPF 控件中时图像看起来不错

左边是编译前的图像，右边是编译后的模糊图像。

我尝试应用 UseLayoutRounding，应用 SnapsToDevicePixels，RenderOptions.BitmapScalingMode 并直接在按钮中移除抗锯齿并直接移除图像但没有任何效果。

知道如何提高 WPF 中图像的质量吗？

XAML:

直接应用于按钮的样式:

  <Grid>
        <Button x:Name="recentButton" UseLayoutRounding="True" RenderOptions.BitmapScalingMode="HighQuality" SnapsToDevicePixels="True" RenderOptions.EdgeMode="Aliased"
            Margin="10,137,302,10"
            Width="auto"
            Height="23" 
            HorizontalAlignment="Stretch"
            BorderBrush="{x:Null}" 
            Foreground="White" 
            BorderThickness="0" 
            Style="{StaticResource {x:Static ToolBar.ButtonStyleKey}}">
            <Image Source="/Tool;component/Design/Images/more-icon-active.png" Stretch="None"/>
        </Button>
    </Grid>

直接应用于图像的样式:

  <Grid>
        <Button x:Name="recentButton"
            Margin="10,137,302,10"
            Width="auto"
            Height="23" 
            HorizontalAlignment="Stretch"
            BorderBrush="{x:Null}" 
            Foreground="White" 
            BorderThickness="0" 
            Style="{StaticResource {x:Static ToolBar.ButtonStyleKey}}">
            <Image Source="/Tool;component/Design/Images/more-icon-active.png" UseLayoutRounding="True" RenderOptions.BitmapScalingMode="HighQuality" SnapsToDevicePixels="True" RenderOptions.EdgeMode="Aliased" Stretch="None"/>
        </Button>
    </Grid>

Answer 1

问题是您正在使用 UseLayoutRounding 直接在控件上。

但是，请注意链接文档中的这条注释，

You should set UseLayoutRounding to true on the root element. The layout system adds child coordinates to the parent coordinates; therefore, if the parent coordinates are not on a pixel boundary, the child coordinates are also not on a pixel boundary. If UseLayoutRounding cannot be set at the root, set SnapsToDevicePixels on the child to obtain the effect that you want.

因此，改为在父容器上使用它。在您的情况下，这将在 <grid> 上元素。

---

其他建议

1. @Clemens 在评论区推荐，

取决于图像的种类，RenderOptions.BitmapScalingMode="NearestNeighbor"可能会增加一些清晰度。

请注意，您必须直接将其应用到图像上。

1. @BradleyUffner 在评论区推荐，

设置 TextOptions.TextFormattingMode="Display"在您的顶级元素上，以大大改进桌面计算机上的文本呈现。