WPF font grid viewer

Question

I have a glyph font in ttf format made with icomoon that i want to display in a grid just like the windows font viewer, so each glyph is displayed in a cell

what is the best way to achieve this please ?

thanks and good day

Answer 1

Maybe this little demo helps you get started:

MainWindow.xaml:

<Window x:Class="FontViewer.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Font Viewer" Height="350" Width="640">
    <Grid>
        <ScrollViewer VerticalScrollBarVisibility="Visible">
            <ItemsControl ItemsSource="{Binding Glyphs}"  FontFamily="{Binding FontName}">
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <WrapPanel Width="600"/>
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <Border Width="30" Height="30" BorderBrush="Black" BorderThickness="1">
                            <TextBlock Text="{Binding}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                        </Border>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </ScrollViewer>
    </Grid>
</Window>

MainWindow.xaml.cs:

using System.Linq;
using System.Windows;
using System.Windows.Media;

namespace FontViewer
{
    public partial class MainWindow : Window
    {
        private char[] _glyphs;
        private FontFamily _fontFamily;

        public MainWindow()
        {
            DataContext = this;

            GlyphTypeface glyphTypeface;
            _fontFamily = new FontFamily(FontName);
            _fontFamily.GetTypefaces().First().TryGetGlyphTypeface(out glyphTypeface);
            _glyphs = glyphTypeface.CharacterToGlyphMap.Select(g => (char)g.Key).ToArray();

            InitializeComponent();
        }

        public char[] Glyphs
        {
            get
            {
                return _glyphs;
            }
        }

        public string FontName
        {
            get
            {
                return "Comic Sans MS";
            }
        }
    }
}

The result looks like this: