Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

WPF `Glyphs` not rendering the text right like `TextBlock`

Tags:

c#

.net

vb.net

wpf

I'm making a WPF text-editor using Glyphs element. And I have a problem that the text is not drawn correctly as you can see in the picture, how can I solve this problem?

enter image description here

There are two problems:

  1. Kerning between letters.
  2. Kerning between letters and diacritics.

The first problem I solved by GetKerningPairs function.

How do I solve this problem, maybe I'm wrong?

<Window x:Class="MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="200" Width="525">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="100"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="AUTO"/>
            <RowDefinition Height="AUTO"/>
        </Grid.RowDefinitions>

        <TextBlock Text="TextBlock" VerticalAlignment="Center" Margin="6"/>
        <TextBlock Grid.Row="1" Text="Glyphs" VerticalAlignment="Center" Margin="6"/>

        <TextBlock Text="בְּרֵאשִׁית" Grid.Column="1" FontSize="50" FontFamily="Times New Roman"
                   FontWeight="Normal" Grid.Row="0"/>

        <Glyphs Grid.Row="1" Grid.Column="1"
            FontUri             = "C:\WINDOWS\Fonts\TIMES.TTF"
            FontRenderingEmSize = "50"
            UnicodeString       = "בְּרֵאשִׁית"
            BidiLevel="1"
            Fill                = "Black"/>

        <TextBlock Text="AVAV" Grid.Column="2" FontSize="50" FontFamily="Times New Roman"
                   FontWeight="Normal" Grid.Row="0"/>

        <Glyphs Grid.Row="1" Grid.Column="2"
            FontUri             = "C:\WINDOWS\Fonts\TIMES.TTF"
            FontRenderingEmSize = "50"
            UnicodeString       = "AVAV"
            BidiLevel="0"
            Fill                = "Black"/>

    </Grid>
</Window>
like image 865
google dev Avatar asked Sep 16 '17 22:09

google dev


2 Answers

Kerning for diacritics does not exist in TrueType fonts, So you must define your own list of pairs for diacritics, and give the corresponding kerning. In most letters, the diacritics is centered, and in the others on the right side. Apparently Text Block does the above.

like image 58
codeDom Avatar answered Nov 19 '22 17:11

codeDom


As @Codedom said you must define your own list, which could look like this:

class Program
{
    static void Main(string[] args)
    {
        var list = new List<DiacriticsKerning>();
        list.Add(new DiacriticsKerning('א', 'ָ', HorizontalAlignment.Center, VerticalAlignment.None));
        list.Add(new DiacriticsKerning('ב', 'ָ', HorizontalAlignment.Center, VerticalAlignment.None));
        list.Add(new DiacriticsKerning('ג', 'ָ', HorizontalAlignment.Center, VerticalAlignment.None));
        list.Add(new DiacriticsKerning('ד', 'ָ', HorizontalAlignment.Right, VerticalAlignment.None));
        list.Add(new DiacriticsKerning('ה', 'ָ', HorizontalAlignment.Center, VerticalAlignment.None));
        list.Add(new DiacriticsKerning('ו', 'ָ', HorizontalAlignment.Center, VerticalAlignment.None));
        // ...
    }
}

struct DiacriticsKerning
{
    public DiacriticsKerning(char letter, char diacritics, HorizontalAlignment alignmentHorizontal, VerticalAlignment alignmentVertical)
    {
        Letters = letter;
        Diacritics = diacritics;
        HorizontalAlignment = alignmentHorizontal;
        VerticalAlignment = alignmentVertical;
    }

    char Letters;
    char Diacritics;
    HorizontalAlignment HorizontalAlignment;
    VerticalAlignment VerticalAlignment;
}

enum HorizontalAlignment { None, Center, Left, Right, }

enum VerticalAlignment { None, Center, Left, Right, }
like image 29
magicode Avatar answered Nov 19 '22 17:11

magicode