WPF text rendering

In acest articol, vom discuta despre cum putem modifica felul in care se randeaza textul in aplicatia WPF.

Dupa cum am mentionat anterior, WPF face mult mai mult decat WinForms, care foloseste Windows API pentru majoritatea chestiilor. Acest lucru se observa si cand vine vorba de randare - WinForms foloseste GDI API, in timp ce WPF are propriul mijloc de randare, pentru a implementa mai bine animatii si pentru a rula independent de dispozitiv.

Din păcate, acest lucru a dus la redarea textului un pic neclară, în special la dimensiuni mici ale fontului. Aceasta a fost o problemă destul de mare pentru programatorii WPF de ceva timp, dar, din fericire, Microsoft a făcut o mulțime de îmbunătățiri în motorul de redare al textului WPF în .NET framework versiunea 4.0. Aceasta înseamnă că, dacă folosești această versiune sau o versiune ulterioară, textul tău ar trebui să fie aproape la fel de bun ca "pixel perfect".

Cum controlam randarea textului

Cu aparitia .NET framework 4.0, Microsoft le-a dat programatorilor mai mult control asupra randarii textului prin introducerea clasei TextOptions si a proprietatilor TextFormattingMode siTextRenderingMode. Acestea ne dau posibilitatea de a modifica modul in care textul este formatat si randat la nivelul de control. Acest lucru este probabil cel mai bine descris prin exemplul de mai jos.

Proprietatea TextFormattingMode

Using the TextFormattingMode property, you get to decide which algorithm should be used when formatting the text. You can choose between Ideal (the default value) and Display. You would normally want to leave this property untouched, since the Ideal setting will be best for most situations, but in cases where you need to render very small text, the Display setting can sometimes yield a better result. Here's an example where you can see the difference (although it's very subtle):

<Window x:Class="WpfTutorialSamples.Control_concepts.TextFormattingModeSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="TextFormattingModeSample" Height="200" Width="400">
    <StackPanel Margin="10">
        <Label TextOptions.TextFormattingMode="Ideal" FontSize="9">TextFormattingMode.Ideal, small text</Label>
        <Label TextOptions.TextFormattingMode="Display" FontSize="9">TextFormattingMode.Display, small text</Label>
        <Label TextOptions.TextFormattingMode="Ideal" FontSize="20">TextFormattingMode.Ideal, large text</Label>
        <Label TextOptions.TextFormattingMode="Display" FontSize="20">TextFormattingMode.Display, large text</Label>
    </StackPanel>
</Window>

Proprietatea TextRenderingMode

Proprietatea TextRenderingMode ne lasa sa alegem algoritmul de antialiasing folosit la randarea textului. Acesta are efect puternic in combinatie cu setarea Display a proprietatii TextFormattingMode, pe care o sa o folosim pentru a sublinia diferentele:

<Window x:Class="WpfTutorialSamples.Control_concepts.TextRenderingModeSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="TextRenderingModeSample" Height="300" Width="400">
    <StackPanel Margin="10" TextOptions.TextFormattingMode="Display">
        <Label TextOptions.TextRenderingMode="Auto" FontSize="9">TextRenderingMode.Auto, small text</Label>
        <Label TextOptions.TextRenderingMode="Aliased" FontSize="9">TextRenderingMode.Aliased, small text</Label>
        <Label TextOptions.TextRenderingMode="ClearType" FontSize="9">TextRenderingMode.ClearType, small text</Label>
        <Label TextOptions.TextRenderingMode="Grayscale" FontSize="9">TextRenderingMode.Grayscale, small text</Label>
        <Label TextOptions.TextRenderingMode="Auto" FontSize="18">TextRenderingMode.Auto, large text</Label>
        <Label TextOptions.TextRenderingMode="Aliased" FontSize="18">TextRenderingMode.Aliased, large text</Label>
        <Label TextOptions.TextRenderingMode="ClearType" FontSize="18">TextRenderingMode.ClearType, large text</Label>
        <Label TextOptions.TextRenderingMode="Grayscale" FontSize="18">TextRenderingMode.Grayscale, large text</Label>
    </StackPanel>
</Window>

Dupa cum se observa, textul difera destul de mult, in functie de proprietatile folosite. Ele ar trebui schimbate numai in situatii speciale.