WPF模糊字体问题 - 解决方案

Rob*_*vić 151 wpf fonts

问题在以下链接中描述和演示:

说明:WPF中的文本清晰度.此链接具有字体比较.

我想为这个问题收集所有可能的解决方案.Microsoft Expression Blend使用WPF但字体看起来可读.

  • Microsoft Expression Blend中的深色背景
  • 增加字体大小和更改字体(Calibri ...)[链接]
  • 嵌入窗体[链接]
  • 使用GDI +和/或Windows窗体TextRenderer类将文本呈现到位图,然后将该位图呈现为WPF控件.[链接]

有没有更多的解决方案?

这将在VS2010(和WPF4)beta 2中修复

WPF 4.0文本堆栈改进

它看起来像它已被最终解决!

Scott Hanselman的ComputerZen.com:WPF和Text Blurriness,现在有完整的Clarity
WPF文本博客:其他WPF文本清晰度改进

Hel*_*ein 124

.NET 4最终解决了WPF文本呈现质量差的问题,但它隐藏得很好.为每个窗口设置以下内容:

TextOptions.TextFormattingMode="Display"
Run Code Online (Sandbox Code Playgroud)

默认值是"理想",它完全不是名称所暗示的.

TextOptions中还有另外两个选项,即TextHintingMode和TextRenderingMode,但它们都有合理的默认值.

  • 我只想要这个!我真的不在乎WPF渲染的复杂程度,这些字体对任何人来说都是不可接受的. (5认同)

Dav*_*itt 105

技术背景

有一篇关于WPF文本呈现的深入文章来自windowsclient.net上的一个WPF文本程序管理器:WPF中的文本清晰度.

问题归结为WPF需要线性缩放字体渲染器以实现流畅的动画.另一方面,Pure ClearType使用字体将相当大的自由度推入下一个像素.

如果比较经典的"级联"模式,差异是显而易见的.左下角的WinForms,右上角的WPF:

虽然我也不喜欢WPF的字体渲染特性,但我可以想象,如果动画会像Winforms级联中那样跳跃,那就是吵闹.

玩注册表

我特别感兴趣的是MSDN文章" ClearType注册表设置 " 的链接,该文章解释了注册表中可能的用户端调整:

  • ClearType级别:子像素提示量
  • 伽玛级别
  • 像素结构:如何排列显示像素中的彩色条纹
  • 文本对比度级别:调整字形词干的宽度以使字体更重

使用这些设置并没有真正改善根本问题,但可以通过减少敏感用户的颜色渗色效果来提供帮助.

另一种方法

Text Clarity文章给出的最佳建议是增加字体大小和更改字体.Calibri比标准的Segoe UI更适合我.由于它作为网络字体的流行,我也尝试了Verdana,但它在14pt和15pt之间有一个令人讨厌的重量跳跃,这在动画字体大小时非常明显.

WPF 4.0

WPF 4将改进对影响字体呈现的支持.WPF文本博客上一篇文章解释了这些变化.最突出的是,现在(至少)有三种不同的文本呈现方式:

文字渲染比较

<grumble>对于每个设计师来说,这应该足够了.</ grumble>

  • 优秀的解释,+ 1.可能解释了为什么Flash也有如此可怕的字体渲染. (11认同)
  • 特别相关的是TextOptions.TextFormattingMode附加属性(http://msdn.microsoft.com/en-us/library/ee169597.aspx).WPF4和Silverlight也有UseLayoutRounding(http://msdn.microsoft.com/en-us/library/dd783605.aspx)和SnapsToDevicePixels(http://msdn.microsoft.com/en-us/library/system.windows .uielement.snapstodevicepixels.aspx)属性. (2认同)

Isa*_*avo 37

前几天我使用了应用了DropShadowEffect的边框时遇到了问题.结果是该边界内的所有文本都非常模糊.如果文本位于其他面板内或直接位于边框下,则无关紧要 - 任何具有效果的父级子级的文本块似乎都会受到影响.

这个特殊情况的解决方案是不将东西放在有效果的边框内,而是使用网格(或任何其他支持将内容放在彼此之上的东西)并在与文本相同的单元格中放置一个矩形(即作为视觉树中的兄弟姐妹)并对其产生影响.

像这样:

<!-- don't do this --->
<Border>
     <Border.Effect>
          <DropShadowEffect BlurRadius="25" ShadowDepth="0" Opacity="1"/>
     </Border.Effect>
     <TextBlock Text="This Text Will Be Blurry" />
</Border>

<!-- Do this instead -->
<Grid>
  <Rectangle>
     <Rectangle.Effect>
          <DropShadowEffect BlurRadius="25" ShadowDepth="0" Opacity="1"/>
     </Rectangle.Effect>
  </Rectangle>
  <TextBlock Text="This Text Will Be Crisp and Clear" />
</Grid>
Run Code Online (Sandbox Code Playgroud)


Pav*_*aev 10

这将在VS2010(和WPF4)beta 2中修复:


小智 6

SnapToDevicePixels仅适用于WPF形状(线等),而不适用于文本渲染器.

此问题没有已知的解决方法.根据微软的说法,这种行为是"按设计"的.

还可以在微软论坛上看到这个讨论问题的帖子 - 它已经得到了MS家伙的一些回复,澄清了他们在这个问题上的立场.


小智 6

从开发人员的角度来看,迄今为止唯一已知的"解决方法"是使用GDI +和/或Windows Forms TextRenderer类将文本呈现到位图,然后将该位图呈现为WPF控件.除了明显的性能影响之外,这并没有缓解现有应用程序的问题.

我现在已经为这个问题创建了一个Microsoft Connect票证(令我惊讶的是,尽管存在所有的负面影响,但在指定的跟踪器中没有实际的错误报告).

由于这是向微软传达请求和问题的官方渠道之一,我建议通过它来更快地回答.至少,如果您希望以某种方式解决问题,在那里投票和/或验证问题将有助于引起Microsoft PM和工程师对此问题的关注,并可能提高其感知优先级.


Gab*_*iel 5

我不认为这是一个错误,但是默认配置确实很烦人。这是所有组合的比较

TextOptions.TextRenderingMode
TextOptions.TextFormattingMode
RenderOptions.ClearTypeHint
Run Code Online (Sandbox Code Playgroud)

SnapToDevicePixels 在文本呈现方面没有任何区别。

http://i.stack.imgur.com/cS3S2.png

我更喜欢:

TextOptions.TextRenderingMode="Auto"
TextOptions.TextFormattingMode="Ideal"
RenderOptions.ClearTypeHint="Auto"
Run Code Online (Sandbox Code Playgroud)

垂直线从不模糊。

使用的字体是Open Sans Light,如果使用得当,它可以非常漂亮,例如最新的TeamViewer。

对于使用Mahapps.Metro的用户而言,问题在于TransitioningContentControl https://github.com/MahApps/MahApps.Metro/issues/889