使用Font Awesome更改WPF中的字体图标

Gareth 发表于 Dev

加雷斯

我正在使用Font Awesome的图标在C＃WPF应用程序中渲染基本字体图像。在运行时，当我尝试更改TextBlock以显示其他字体图标，但显示Unicode表示形式而不是字体图标时。

我创建了一个示例应用程序来显示此内容。单击任何一个按钮时，它将用相应图标的Unicode替换TextBlock的Text属性。项目中有一个Resources文件夹，该文件夹具有FontAwesome.ttf字体文件作为TextBlock的FontFamily属性引用的生成资源。

这是我的示例应用程序的源代码：

后台代码：

namespace FontAwesomeTest
{
public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }

    private void btnGlass_Click(object sender, RoutedEventArgs e)
    {
        tblkFontIcon.Text = "&#xf000;";            
    }

    private void btnMusic_Click(object sender, RoutedEventArgs e)
    {
        tblkFontIcon.Text = "&#xf001;";
    }

    private void btnSearch_Click(object sender, RoutedEventArgs e)
    {
        tblkFontIcon.Text = "&#xf002;";
    }        
}
}

XAML：

<Window x:Class="FontAwesomeTest.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Font Awesome Test Window" Height="300" Width="330" Name="FontAwesomeTestWindow">
<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="50"/>
        <RowDefinition Height="25"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <Button Name="btnGlass" Height="35" Width="85" Click="btnGlass_Click" >Glass</Button>
    <Button Name="btnMusic" Grid.Column="1" Height="35" Width="85" Click="btnMusic_Click">Music</Button>
    <Button Name="btnSearch" Grid.Column="2" Width="85" Height="35"  Click="btnSearch_Click">Search</Button>
    <TextBlock Grid.Row="1" Grid.Column="0" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="18" FontFamily="../Resources/#FontAwesome">&#xf000;</TextBlock>
    <TextBlock Grid.Row="1" Grid.Column="1" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="18" FontFamily="../Resources/#FontAwesome">&#xf001;</TextBlock>
    <TextBlock Grid.Row="1" Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="18" FontFamily="../Resources/#FontAwesome">&#xf002;</TextBlock>
    <TextBlock Name="tblkFontIcon" Grid.Row="2" Grid.ColumnSpan="3" FontSize="64" FontFamily="../Resources/#FontAwesome" HorizontalAlignment="Center" VerticalAlignment="Center">&#xf011;</TextBlock>
</Grid>

我使用以下教程将Font Awesome合并到我的应用程序中http://www.codeproject.com/Tips/634540/Using-Font-Icons

因此，从本质上讲，我如何更改图标但显示图标-不是Unicode？

提前致谢。

毛圈

更新

我为此主题找到了另一篇文章-在wpf中添加图标字体，我认为这应该更符合您的需求。

确保将字体添加为资源。然后，使用以下字符串：
<Setter Property="TextElement.FontFamily" Value="pack://application:,,,/fonts/#FontAwesome" />
在上面的字符串中，我假设字体的名称（而不是字体的文件名）是FontAwesome。

您只需要：

将字体添加到您的项目中，假设您将它们放入文件夹“字体”中
将生成操作更改为资源 而不是 嵌入式资源
添加样式以设置字体系列（如上面的代码片段），然后将设置TextBlock.Text为所需的图标，然后将样式应用于TextBlock。

如果要通过更新TextBlock.Text属性来更改图标，则应Text使用支持的unicode字符串设置属性。

尝试类似的东西

 tblkFontIcon.Text = "\uf000";

而不是

tblkFontIcon.Text = "&#xf000;";

如果您正在使用“使用字体图标”中的代码

那么您可能错过了该帖子中的“工作原理”部分。您应该使用该标记扩展名，而不是使用TextBlock.Text属性。

在他的示例代码中：

<RibbonButton Label="Import data" 
  LargeImageSource="{WpfTools:ImageFromFont Text=&#xf01a;, 
  FontFamily=/RibbonFontIconSample;component/Resources/#FontAwesome, Brush=Brown}" />

注意WpfTools:ImageFromFont，它是标记扩展，它允许xaml解析器将

{WpfTools:ImageFromFont Text=&#xf01a;, 
      FontFamily=/RibbonFontIconSample;component/Resources/#FontAwesome, Brush=Brown}

一个ImageSource并分配给LargeImageSource财产。

因此，在您的XAML，你可以更换TextBlock用Image，那么就应该是这样的：

<Image Source="{WpfTools:ImageFromFont Text=&#xf000;, 
      FontFamily=/RibbonFontIconSample;component/Resources/#FontAwesome, Brush=Brown}" />

如果要更改图标，则必须更改ImageSource自己，只需按照“使用字体图标”创建自己的方法，或者简单地从该教程中复制以下代码。

private static ImageSource CreateGlyph(string text, 
        FontFamily fontFamily, FontStyle fontStyle, FontWeight fontWeight, 
        FontStretch fontStretch, Brush foreBrush)
{
    if (fontFamily != null && !String.IsNullOrEmpty(text))
    {
        Typeface typeface = new Typeface(fontFamily, fontStyle, fontWeight, fontStretch);
        GlyphTypeface glyphTypeface;
        if (!typeface.TryGetGlyphTypeface(out glyphTypeface))
                throw new InvalidOperationException("No glyphtypeface found");

        ushort[] glyphIndexes = new ushort[text.Length];
        double[] advanceWidths = new double[text.Length];
        for (int n = 0; n < text.Length; n++)
        {
            ushort glyphIndex = glyphTypeface.CharacterToGlyphMap[text[n]];
            glyphIndexes[n] = glyphIndex;
            double width = glyphTypeface.AdvanceWidths[glyphIndex] * 1.0;
            advanceWidths[n] = width;
        }

        GlyphRun gr = new GlyphRun(glyphTypeface, 0, false, 1.0, glyphIndexes,
                                    new Point(0, 0), advanceWidths, 
                                    null, null, null, null, null, null);
        GlyphRunDrawing glyphRunDrawing = new GlyphRunDrawing(foreBrush, gr);
        return new DrawingImage(glyphRunDrawing);

    }
    return null;
}