Рендеринг текста в WPF

В этой статье мы обсудим, почему иногда текст размывается при рендеринге в WPF, как этого избежать и как Вы можете самостоятельно контролировать рендеринг текста.

Как уже было оговорено раньше, WPF в состоянии самостоятельно реализовывать различные механизмы, по сравнению с другими фреймворками (например WinForms), которые используют Windows API для широкого круга функциональностей. Особенно, это явно видно, когда речь заходит о рендеринге текста - WinForms использует GDI API от Windows, в то время как WPF имеет собственную реализацию данного механизма, для лучшей поддержки анимации, и независимости от "железа".

К сожалению, результат данного рендеринга будет слегка размытым, особенно для маленьких шрифтов. Некоторое время это было достаточно серьезной проблемой для программистов WPF, но, к счастью, Microsoft сделала множество "поправок" в движке для рендера в рамках .NET 4.0. Это означает, что если Вы используете данную версию, либо выше, то у Вас не возникнет неудобств, связанных с "размытым текстом".

Управление рендерингом

С версией фреймворка .NET 4.0. Microsoft решила дать больший контроль над рендерингом в руки программиста, введя класс TextOptions со свойствами TextFormattingMode и TextRenderingMode. Они позволяют определить, как текст должен быть отформатирован и отрендерен на уровне элемента управления. Возможно, Вы лучше вникнете в курс дела, после примера, так что изучите код и скриншоты ниже, и Вы поймете, как можно влиять на рендеринг текста с помощью данных свойств.

TextFormattingMode

Используя свойство TextFormattingMode, Вы можете определить, какой алгоритм будет использован при форматировании текста. Вам предоставлен выбор между Ideal(по умолчанию) и Display. Обычно, Вы не захотите управлять этим свойством, так как опция Ideal дает отличный результат для большинства ситуаций, но в случае, если Вам необходимо отобразить текст маленьким шрифтом, то опция Display даст лучший результат. Вот пример, где разница будет видна, но не так очевидна.

<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 позволяет Вам выбрать алгоритм сглаживания при рендеринге текста. Больший эффект будет достигнут при комбинации опцией Display для свойства TextFormattingMode, который мы продемонстрируем на примере ниже:

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

Как Вы можете заметить, результатирующие тексты отличаются "внешним видом", но опять же, это касается частных случаев при использовании.