WPF中的图像变得模糊

Question

我正在使用C＃在WPF中开发一个应用程序。我将图像放在一个WrapPanel中，并在一个Grid中显示另一个Border，并在Buttons中使用图像。问题是我的图像控制失去了它的质量。我无法在此发布我的图片，所以我只是在这里描述。

我将SnapsToDevicePixels="True"用于图片，但看起来仍然模糊。

更新：

我在这里分享了以下图片：

Answer 1

我认为Markus所说的是解决问题的一种方法，并尝试在其中添加一个属性RenderOptions.EdgeMode="Aliased"，用于我的意思：

<Image Source="/LoginPanel;component/Icons/icoLogin.ico"
       RenderOptions.BitmapScalingMode="NearestNeighbor"
       RenderOptions.EdgeMode="Aliased"/>

如果您仍然无法解决问题，那么您可以参考此http://blogs.msdn.com/b/dwayneneed/archive/2007/10/05/blurry-bitmaps.aspx来创建自定义位图类，并应用于为您造成麻烦的所有图片。

您还可以看到此Stack Overflow Question

Answer 2

SnapsToDevicePixels似乎不适用于位图。

NearestNeighbor选项实际上转换了位图，最终会与原始位图不同。

在WPF 4中，引入了FrameworkElement上的属性“ UseLayoutRounding ”来解决此问题。

通过在根元素上将此属性设置为True，例如Window将在像素的边缘上对齐子元素。

<Window UseLayoutRounding="True">...</Window>

Answer 3

这对我有用

<Image Source="/LoginPanel;component/Icons/icoLogin.ico"
       RenderOptions.BitmapScalingMode="NearestNeighbor"</Image>

为每个图像设置RenderOptions.BitmapScalingMode =“NearestNeighbor”。或者在StackOverflow上查看此question。

修改
这是我的示例代码

<Window x:Class="MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="661">
    <WrapPanel>
        <Button VerticalAlignment="Center">
            <Image Source="/WpfApplication1;component/icoChip32x32.ico"
               RenderOptions.BitmapScalingMode="NearestNeighbor" Stretch="None"></Image>
        </Button>
        <Button VerticalAlignment="Center">
            <Image Source="/WpfApplication1;component/icoChip32x32.ico"
                   RenderOptions.BitmapScalingMode="NearestNeighbor" Stretch="None"></Image>
        </Button>

        <Button VerticalAlignment="Center">
            <Image Source="/WpfApplication1;component/Presentation-Edit.png"
               RenderOptions.BitmapScalingMode="NearestNeighbor" Stretch="None"></Image>
        </Button>
        <Button VerticalAlignment="Center">
            <Image Source="/WpfApplication1;component/Presentation-Edit.png"
                   RenderOptions.BitmapScalingMode="NearestNeighbor" Stretch="None"></Image>
        </Button>
    </WrapPanel>
</Window>

这是我的结果：

Answer 4

如果将image用作内容，则在父元素上使用UseLayoutRounding =“True”属性。在你的情况下，它是按钮。

Answer 5

我遇到了由缩放引起的图像背景的模糊问题，解决方案比您想象的要简单得多。虽然起初我想知道它是否被扩展到2的二次幂纹理大小，但缩放实际上与系统DPI（96）的比率相匹配：图像DPI（72，这是许多编辑器的默认值）。如果将图像调整为96 DPI，则应使用默认的Windows设置显示像素完美。

编辑：尝试了具有高细节对比度的图像，并略微柔化。

Answer 6

我有同样的问题，但在我的情况下，我已经下载了图标并发现，他们都有错误的DPI ...... 110,56和116，xx和95,99等... < / p>

当我将DPI改为96时，一切都很好！

Answer 7

WPF不会对大小和位置使用具体的像素值，因此可以使用DPI很好地扩展。

这会导致尝试使用与离散的屏幕上像素不对应的位置的问题;一些图像像素在多个屏幕上的像素上渲染，我们将其视为模糊。

使用SnapToDevicePixels = false的

UseLayoutRendering = true应解决此问题。您还需要在主窗口级别设置它，以便计算级联到图像级别。

您可以通过创建一个带有一个窗口和图像的简单WPF应用程序来尝试此操作。将图像边距设置为愚蠢（10.452,0.736,0,0）会导致模糊。这在图像上消失了UseLayoutRendering = true。

如果您在InitializeComponent（）之后再次在窗口的构造函数中设置边距，则无论您是否在图像上设置UseLayoutRendering = true，它都是模糊的，因为在您之前进行了与屏幕上像素对齐的计算将图像移动到与这些图像不匹配的位置。

我不完全确定UseLayoutRendering和SnapToDevicePixels之间的区别 - 我认为这只是进行计算的时间。 UseLayoutRendering似乎更适合图像。

从原始尺寸拉伸/压缩图像也会导致模糊问题。