Problem mit WPF Blurry-Schriftarten - Lösungen

153

Das Problem wird unter folgenden Links beschrieben und demonstriert:

Erläuterung: Textklarheit in WPF . Dieser Link hat einen Schriftvergleich.

Ich möchte alle möglichen Lösungen für dieses Problem sammeln. Microsoft Expression Blend verwendet WPF, aber Schriftarten sehen lesbar aus.

  • Dunkler Hintergrund wie in Microsoft Expression Blend
  • Erhöhen der Schriftgröße und Ändern der Schriftart (Calibri ...) [Link]
  • Windows-Formulare einbetten [Link]
  • Verwenden Sie die GDI + - und / oder Windows Forms TextRenderer-Klasse, um Text in eine Bitmap zu rendern, und rendern Sie diese Bitmap dann als WPF-Steuerelement. [Verknüpfung]

Gibt es noch weitere Lösungen?

Dies wird in VS2010 (und WPF4) Beta 2 behoben

Es sieht so aus, als wäre es endgültig gelöst worden!

Scott Hanselmans ComputerZen.com: WPF und Text Blurriness, jetzt mit vollständiger Klarheit

Robert Vuković
quelle
VS2010RC ist für mich völlig unbrauchbar mpdreamz.nl/vs2010RC-blur.png
Martijn Laarman
VS2010RC auf meinem Computer sieht viel besser aus als auf Ihrem Bild, eigentlich mit weißem Hintergrund ist sehr gut, aber immer noch mit dunklem Hintergrund saugt.
Robert Vuković
Haben Sie eine Lösung für dieses Problem gefunden? Eigentlich habe ich das gleiche Problem hier in meiner Anwendung und ich verwende WPF 3.5 mit VS2010
SharpUrBrain
Die letzten 3 Links sind tot.
SHIN JaeGuk

Antworten:

107

Technischer Hintergrund

Es gibt einen ausführlichen Artikel über das Rendern von WPF-Text von einem der WPF-Textprogrammmanager auf windowsclient.net: Textklarheit in WPF .

Das Problem besteht darin, dass WPF einen linear skalierenden Font-Renderer für reibungslose Animationen benötigt. Pure ClearType hingegen benötigt mit der Schriftart einiges an Freiheit, um vertikale Stämme in das nächste Pixel zu verschieben.

Der Unterschied ist offensichtlich, wenn man das klassische "Kaskaden" -Muster vergleicht. WinForms unten links, WPF oben rechts:

Obwohl ich auch kein Fan von WPFs Eigenheiten beim Rendern von Schriftarten bin, kann ich mir das Geschrei vorstellen, wenn die Animationen wie in der Winforms-Kaskade springen würden.

Mit der Registrierung spielen

Von besonderem Interesse für mich war der Link zum MSDN-Artikel " ClearType-Registrierungseinstellungen ", in dem die möglichen benutzerseitigen Anpassungen in der Registrierung erläutert werden:

  • ClearType-Ebene: Anzahl der Subpixel-Hinweise
  • Gamma-Level
  • Pixelstruktur: Wie die Farbstreifen in einem Anzeigepixel angeordnet sind
  • Textkontraststufe: Passt die Breite der Glyphenstämme an, um die Schrift schwerer zu machen

Das Herumspielen mit diesen Einstellungen hat das zugrunde liegende Problem nicht wirklich verbessert, kann jedoch helfen, indem der Farbblutungseffekt für empfindliche Benutzer verringert wird.

Ein anderer Ansatz

Der beste Rat, den der Artikel über Textklarheit gab, war, die Schriftgröße zu erhöhen und die Schriftart zu ändern. Calibri funktioniert für mich besser als die Standard-Segoe-Benutzeroberfläche. Aufgrund seiner Beliebtheit als Web-Schriftart habe ich auch Verdana ausprobiert, aber es hat einen fiesen Gewichtssprung zwischen 14pt und 15pt, der beim Animieren der Schriftgröße sehr gut sichtbar ist.

WPF 4.0

WPF 4 bietet eine verbesserte Unterstützung für die Beeinflussung des Renderns von Schriftarten. Im WPF-Textblog gibt es einen Artikel, in dem die Änderungen erläutert werden. Am bekanntesten ist, dass es jetzt (mindestens) drei verschiedene Arten der Textwiedergabe gibt:

Vergleich der Textwiedergabe

<grumble> Das sollte für jeden Designer genug Seil sein. </ murren>

David Schmitt
quelle
11
ausgezeichnete Erklärung, +1. Erklärt wahrscheinlich, warum Flash auch so schreckliche Schriftwiedergabe hat.
Jeff Atwood
1
Ja. Das ist eine gute Erklärung, aber ich wünschte immer noch, es gäbe eine Möglichkeit, die Schriftart für einen schönen Look zu aktivieren, wenn Sie wissen, dass Sie nicht animieren werden. Ich nehme an, dass dies eine bestimmte Skala implizieren würde, für die Sie den Hinweis optimieren. Diese Art von Sachen lässt WPF für mich immer noch als Beta-Version erscheinen.
PeterAllenWebb
Es ist nicht so, dass die "skalierbare" Variante keine Schriftartenhinweise verwendet, sondern nur, dass WPF nicht wie ClearType für das Auftreffen auf das Pixelraster optimiert ist. Möglicherweise sollte SnapToDevicePixels für Text funktionieren, dies müsste jedoch immer vererbt werden, da ein Steuerelement nicht wissen kann, ob es möglicherweise einbindet oder nicht.
David Schmitt
2
Besonders relevant ist die angehängte Eigenschaft TextOptions.TextFormattingMode ( msdn.microsoft.com/en-us/library/ee169597.aspx ). WPF4 und Silverlight verfügen außerdem über die Eigenschaften UseLayoutRounding ( msdn.microsoft.com/en-us/library/dd783605.aspx ) und SnapsToDevicePixels ( msdn.microsoft.com/en-us/library/… ).
Pat
@All: Ich kann keine Möglichkeit finden, das Anti-Aliasing von Text in WPF3.5 zu deaktivieren. Daher sieht die Bezeichnung oder der Schaltflächentext wirklich schlecht aus. Idealerweise möchte ich das Anti-Aliasing für Schriftarten global deaktivieren. Wie kann ich das erreichen?
SharpUrBrain
128

.NET 4 hat endlich eine Lösung für die schlechte Textwiedergabequalität von WPF, ist aber gut versteckt. Stellen Sie für jedes Fenster Folgendes ein:

TextOptions.TextFormattingMode="Display"

Der Standardwert ist "Ideal", was der Name überhaupt nicht impliziert.

Es gibt zwei weitere Optionen in TextOptions, nämlich TextHintingMode und TextRenderingMode, aber beide haben sinnvolle Standardeinstellungen.

Helge Klein
quelle
Alles. Vielen Dank. Das hilft mir, das Problem zu lösen, aber Sie müssen das nur einmal im Container definieren, wie <grid>
Peter Du
Ja, und wenn Sie es in einem Fenster festlegen, gilt es für alles, was in diesem Fenster enthalten ist.
Helge Klein
Ich habe viel Zeit damit verbracht, auf unzähligen Websites und Blogs danach zu suchen, wie viel besser die Textformatierung in VS2010 RTM / .Net 4 ist (da stimme ich zu!). Aber keiner von ihnen wollte erwähnen, wie Sie WPF-Anwendungen, die Sie damit erstellen, so gut aussehen lassen können. Warum ist diese Eigenschaft so gut versteckt? Vielen Dank.
M-Peror
5
Alles was ich will ist das! Es ist mir wirklich egal, wie ausgefeilt das WPF-Rendering ist, die Schriftarten sind für niemanden akzeptabel.
Jerry Liang
1
"Ideal" funktioniert bei mir anstelle von "Display". Das Projekt ist auf .NET 4.6.2. Vielleicht haben sie den verwirrten Namen repariert.
Joe
40

Ich bin neulich auf ein Problem gestoßen, als ich einen Rahmen verwendet habe, auf den DropShadowEffect angewendet wurde. Das Ergebnis war, dass der gesamte Text innerhalb dieses Rahmens extrem verschwommen war. Es spielt keine Rolle, ob sich Text in anderen Bereichen oder direkt unter dem Rand befand - ein Textblock, der dem übergeordneten Element untergeordnet ist und einen Effekt hat untergeordnet angewendet wird, scheint betroffen zu sein.

Die Lösung für diesen speziellen Fall bestand darin, keine Inhalte in den Rahmen einzufügen, die Auswirkungen haben, sondern stattdessen ein Raster (oder etwas anderes, das das Übereinanderlegen von Inhalten unterstützt) zu verwenden und ein Rechteck in derselben Zelle wie der Text zu platzieren (z als Geschwister im visuellen Baum) und setzen Sie die Auswirkungen darauf.

Wie so:

<!-- 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>
Isak Savo
quelle
Das hat den Trick gut gemacht. Ein bisschen wie ein Hack, aber besser als mit Einstellungen usw. herumzuspielen. Schön. Vielen Dank. Eine Sache, die ich jedoch tun musste, war, die Füllung des Rechtecks ​​auf etwas zu setzen. Vielleicht war dies aber nur mein Setup.
HAdes
Ja, Sie haben Recht. Das Rechteck ist standardmäßig transparent, wodurch der Schlagschatten seltsam aussieht.
Isak Savo
Dies geschieht nicht in meiner Beispielanwendung, ich verwende WPF 3.5
SharpUrBrain
@ SharpUrBrain: Was passiert nicht? Ist es auch nach meinem zweiten Beispiel noch verschwommen?
Isak Savo
Ja, es ist immer noch verschwommen, nachdem Sie auch Ihr zweites Beispiel verwendet haben
SharpUrBrain
10

Dies wird in VS2010 (und WPF4) Beta 2 behoben:

Pavel Minaev
quelle
1
+1 zum Testen. Interessant zu sehen, wie viel breiter dieser Text ist.
David Schmitt
6

SnapToDevicePixels gilt nur für WPF-Formen (Linien usw.), nicht für Textrenderer.

Es ist keine Problemumgehung für dieses Problem bekannt. Laut Microsoft ist das Verhalten "beabsichtigt".

Lesen Sie auch diesen Thread in Microsoft-Foren, in dem die Probleme besprochen werden. Er hat einige Antworten von MS-Mitarbeitern erhalten, die ihre Position zu diesem Thema klarstellen.


quelle
In WPF 4 mithilfe der angehängten Eigenschaft TextOptions.TextFormattingMode ( msdn.microsoft.com/en-us/library/ee169597.aspx ) behoben .
Pat
1
Der Eigenschaftsname lautet "SnapsToDevicePixels" und nicht wie geschrieben "SnapToDevicePixels".
Nir Kornfeld
6

Aus Entwicklersicht besteht die einzige bisher bekannte "Problemumgehung" darin, GDI + und / oder Windows Forms TextRenderer zu verwenden, um Text in eine Bitmap zu rendern, und diese Bitmap dann als WPF-Steuerelement zu rendern. Abgesehen von offensichtlichen Auswirkungen auf die Leistung wird das Problem für vorhandene Anwendungen dadurch nicht behoben.

Ich habe jetzt ein Microsoft Connect-Ticket für dieses Problem erstellt (zu meiner Überraschung gab es trotz aller Negativität keinen tatsächlichen Fehlerbericht im angegebenen Tracker).

Da dies einer der offiziellen Kanäle für die Übermittlung von Anfragen und Fragen an Microsoft ist, würde ich empfehlen, ihn auch für eine schnellere Antwort durchzugehen. Wenn Sie möchten, dass das Problem auf die eine oder andere Weise behoben wird, können Sie zumindest durch die Abstimmung für dieses Ticket und / oder die Validierung des Problems die Aufmerksamkeit von Microsoft PMs und Ingenieuren auf dieses Problem lenken und möglicherweise die wahrgenommene Priorität erhöhen.

David Schmitt
quelle
6

Ich sehe es nicht als Fehler, aber die Standardkonfiguration ist in der Tat sehr ärgerlich. Hier ist ein Vergleich aller Kombinationen von

TextOptions.TextRenderingMode
TextOptions.TextFormattingMode
RenderOptions.ClearTypeHint

SnapToDevicePixels macht beim Text-Rendering keinen Unterschied.

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

Ich bevorzuge:

TextOptions.TextRenderingMode="Auto"
TextOptions.TextFormattingMode="Ideal"
RenderOptions.ClearTypeHint="Auto"

wo vertikale Linien niemals verschwommen sind.

Die verwendete Schriftart ist Open Sans Light, die sehr schön sein kann, wenn sie gut verwendet wird, wie im neuesten TeamViewer.

Für Benutzer von Mahapps.Metro ist das Problem TransitioningContentControl https://github.com/MahApps/MahApps.Metro/issues/889

Gabriel
quelle
4

Ich habe gerade die Beta-Version von VS2010 ausprobiert, die alle in WPF ausgeführt wird, und sie leidet SCHLECHT unter dem Problem mit verschwommenen Schriftarten. Besonders auf Tooltips.

Das scheint einige Beweise dafür zu geben, dass WPF4 das Problem tatsächlich nicht lösen wird (wenn überhaupt, sieht es schlimmer aus)

Orion Edwards
quelle
3
Ich melde Fehler gegen VS2010B1 für jede Stelle in der Benutzeroberfläche an, an der der Text verschwommen ist. Die Tooltips sind fast komisch schlecht, da stimme ich zu. Angesichts der Tatsache, dass ausdrücklich gesagt wurde, dass dies in WPF4 behoben werden sollte, kann ich nur hoffen, dass es den Schnitt für diese Beta einfach nicht geschafft hat.
Will Dean
4

Wow, ich kann nicht glauben, dass ich endlich meine WPF-Schriftarten lesbar habe. Und ich kann auch nicht glauben, dass es keinen Optionsdialog gibt, um diese Änderungen zu vereinfachen, während die Standardwerte auf meinem Display schrecklich sind.

Diese Registrierungseinstellungen (in Dezimalzahlen) haben bei mir funktioniert und kommen meiner regulären Cleartype-Schriftart am nächsten:

  • ClearTypeLevel: 10 (meistens Graustufen-Aliasing)
  • GammaLevel: 1300 (höheres Gamma hat die Schrift zu dünn gemacht und ich habe die Farben im Aliasing gesehen)
VVS
quelle
3

Sie sagen, dass "SnapToDevicePixels = true" funktioniert, aber ich habe noch nie gute Ergebnisse gesehen.

Ich bekämpfe den unscharfen Text, indem ich zu einer anderen Schriftart wechsle.

Offensichtlich ist dies keine Lösung für das Problem, aber so habe ich es umgangen.

Inisheer
quelle
Ich habe gerade einen TextBlock mit SnapToDevicePixels = "true" mit einem ohne verglichen und es gab keinen Unterschied zur Segoe UI-Schriftart bei 12duis. Darf ich fragen, welche Schriftarten Sie verwenden?
David Schmitt
Wir haben die Situation auch verbessert, indem wir unsere Schriftart geändert haben. Die von uns gewählte Schriftart war Avenir (ich glaube nicht, dass sie standardmäßig installiert ist, zumindest nicht unter Windows XP).
Plots
0

Wenn Sie es vorziehen, eine C # -Basisklasse zum Anpassen von Fenstern für Ihre App zu verwenden (oder jetzt einen Grund dafür haben), können Sie die Textformatierung wie folgt festlegen, um den ansprechenden Anzeigemodus zu verwenden:

public class SnappyWindow : Window
{
    public SnappyWindow()
    {
        SetValue(TextOptions.TextFormattingModeProperty, TextFormattingMode.Display);
    }
}
Edward Brey
quelle