WPF tekstgengivelse

I denne artikel vil vi forklare hvorfor tekst nogle gange gengives mere udvisket med WPF, hvordan det senere blev rettet og hvordan, du kan kontrollere tekstgengivelse selv.

Som nævnt allerede i dette selvstudie gør WPF en hel del ting selv sammenlignet med andre UI frameworks som WinForms, som bruger Windows API til rigtig mange ting. Dette er også tydeligt, når det kommer an på gengivelse af tekst - Winforms bruger GDI API fra Windows mens WPF har sin egen tekstgengivelses-implementation for bedre at understøtte animationer så vel som den enhedsuafhængige natur i WPF.

Desværre førte dette til, at tekst blev gengivet lidt udvisket, specielt i små fontstørrelser. Dette var et stort problem for WPF-programmører et stykke tid, men heldigvis lavede Microsoft en masse forbedringer i WPF tekstgengivelsesmotoren i .NET framework version 4.0. Dette betyder, at bruger du denne version eller nyere, skulle din tekst være næsten så god som pixel.perfekt.

Kontrol af tekstgengivelse

Med .NET framework 4.0 besluttede Microsoft også at giver mere kontrol over tekstgengivelse til programmøren ved at introducere TextOptions klassen med TextFormattingMode og TextRenderingMode egenskaberne. Dette giver dig mulighed for specifikt at beslutte hvordan tekst skal formatteres og gengives på kontrolniveau. Dette er sikkert bedst illustreret med et eksempel, så kig på koden og skærmbillederne herunder for at se hvordan, du kan påvirke tekstgengivelsen med disse egenskaber.

TextFormattingMode

Med TextFormattingMode egenskaben kan du beslutte hvilken algoritme, der skal bruges ved formattering af tekst. Du kan vælge mellem Ideal (standardværdien) og Display. Du vil normalt lade denne egenskab være urørt siden Ideal indstillingen vil være den bedste i de fleste tilfældde, men i tilfælde, hvor du har brug for at gengive meget små tekster, kan Display indstillingen nogle gange give et bedre resultat. Her er et eksemel, hvor du kan se forskellen (selv om det er meget subtilt):

<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>

TextRenderingMode

TextRenderingMode egenskaben giver dig kontrol over hvilken anti-aliasing algoritme der bruges ved gengivelse af tekst. Det har den største effekt i kombination med Display indstillingen for TextFormattingMode egenskaben, hvilket vi vil bruge i det næste eksempel for at vise forskellen:

<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>

Som du kan se, er der mange forskelle i de resulterende teksters gengivelse, og igen: Du skal hovedsagelig kun ændre dette i særlige tilfælde.