WPF——关于图像模糊的解决办法？

原创已于 2024-06-16 09:19:11 修改 · 1.4k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#wpf #microsoft #c#

于 2023-03-20 11:33:39 首次发布

WPF 专栏收录该内容

9 篇文章

订阅专栏

文章讨论了在页面中拼接图片出现模糊的情况，尤其是当TextBlock后面跟着图片时。问题可能由像素不对齐引起。解决方案包括对TextBlock和Image设置UseLayoutRounding为true，或调整TextOptions和RenderOptions的属性。对于容器，同样可以应用这些设置来确保子元素的清晰度。作者建议优先使用UseLayoutRounding，因为SnapsToDevicePixels的效果受限于DPI设置。

一、问题

当在页面中呈现一个拼接后的图片时，有时候会模糊有时候不会。根据观察，该图片前面放了一个TextBlock，当TextBlock文案结尾出现英文字符时，后面的图片大概率会糊。推测是因为前面一个元素导致的像素不对齐问题，解决方案可以针对前一个TextBlock，或者当前Image，甚至可以是两者的外层容器。

二、解决方案

对于TextBlock，使用UseLayoutRounding=true，或TextOptions.TextFormattingMode=“Display”
对于Image，使用UseLayoutRounding=true，或RenderOptions.BitmapScalingMode=“NearestNeighbor”
对于两者的容器，使用使用UseLayoutRounding=true，或TextOptions.TextFormattingMode=“Display”，或RenderOptions.BitmapScalingMode=“NearestNeighbor”；因为对容器的赋值，最终会影响到其各个子元素。

三、参考

四、反思

当图像或文字出现模糊时，优先对容器使用UseLayoutRounding=true，而不是 SnapsToDevicePixels=true；因为SnapsToDevicePixels并不是任何时候都会起作用，就如微软中说的<在以上示例中，仅在将显示设置为 96 每英寸点数 (dpi) 时，图像对齐才起作用。在其他设置中，需要调整布局以适应显示设置。>。另外，UseLayoutRounding的像素对齐发生在Layout时，而SnapsToDevicePixels的像素对齐发生在Render。