一、字體圖標(biāo)概述

①字體圖標(biāo)其實(shí)就是把矢量圖形打包到字體文件里，以后就可以像使用一般外置字體一樣的使用它，因此Winform、WPF中都是可以用的。

②可以在很多地方使用圖標(biāo)字體，包括自定義控件、自定義樣式、模板等。

③字體圖標(biāo)優(yōu)點(diǎn)：

二、在WPF中使用字體圖標(biāo)

①獲取字體圖標(biāo)，推薦阿里巴巴開源字體，如何下載字體參考它網(wǎng)站的下載說明，解壓下載的字體會(huì)得到以下文件：

iconfont.tff是我們需要的字體圖標(biāo)庫文件

demo_unicode.html是字體庫對應(yīng)的字體的標(biāo)識，如下圖：

以后通過使用上圖紅色方框中的標(biāo)識，即可獲得對應(yīng)的字體圖標(biāo)

②將字體圖標(biāo)添加到項(xiàng)目新建的Resources文件夾中，并設(shè)置其生成操作為"Resource"，如下圖：

③定義樣式

使用TextBlock作為圖標(biāo)顯示的容器，因此定義一個(gè)TextBlock的樣式即可，如下所示。其中"SK2015"為字體名稱，以前阿里巴巴開源字體庫下載的時(shí)候可以修改字體名稱，現(xiàn)在好像修改不了，默認(rèn)字體名稱為"iconfont"，有朋友發(fā)現(xiàn)如何修改字體名稱的話，請?jiān)谙旅娼o我留言，謝謝！

MyIconFontStyle.xaml代碼如下：

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/PResentation"                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"                    xmlns:local="clr-namespace:IconFontDemo">    <Style x:Key="iFont" TargetType="TextBlock">        <Setter Property="FontFamily" Value="/IconFontDemo;component/Resources/#SF2015"/>        <Setter Property="TextAlignment" Value="Center"/>        <Setter Property="HorizontalAlignment" Value="Center"/>        <Setter Property="VerticalAlignment" Value="Center"/>        <Setter Property="FontSize" Value="20"/>    </Style></ResourceDictionary>注意：上面的FontFamily屬性也可以這樣設(shè)置<Setter Property="FontFamily" Value="/Resources/#SF2015"/>但是為了以后將字體樣式定義到另外一個(gè)程序集，還是推薦使用全的相對路徑，否則會(huì)出現(xiàn)找不到資源的問題。
④在App.xaml中引用定義的樣式資源
<application x:Class="IconFontDemo.App"             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"             xmlns:local="clr-namespace:IconFontDemo"             StartupUri="MainWindow.xaml">    <Application.Resources>        <ResourceDictionary>            <ResourceDictionary.MergedDictionaries>                <ResourceDictionary Source="MyIconFontStyle.xaml"/>            </ResourceDictionary.MergedDictionaries>        </ResourceDictionary>    </Application.Resources></Application>⑤在xaml中使用字體圖標(biāo)，MainWindow.xaml代碼
<Window x:Class="IconFontDemo.MainWindow"        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"        xmlns:local="clr-namespace:IconFontDemo"        mc:Ignorable="d"        Title="MainWindow" Height="350" Width="525" Background="Blue">    <StackPanel Orientation="Horizontal">        <TextBlock Text="" Style="{StaticResource iFont}" FontSize="50" Margin="3" Foreground="White"></TextBlock>        <TextBlock Text="" Style="{StaticResource iFont}" FontSize="60" Margin="3" Foreground="SandyBrown"></TextBlock>        <TextBlock Text="" Style="{StaticResource iFont}" FontSize="70" Margin="3" Foreground="#FB0AE8"></TextBlock>        <TextBlock x:Name="ios" Style="{StaticResource iFont}" FontSize="80" Margin="3" Foreground="Chartreuse"></TextBlock>        <TextBlock x:Name="android" Style="{StaticResource iFont}" FontSize="90" Margin="3" Foreground="#FEDB11"></TextBlock>    </StackPanel></Window>
很奇怪Text屬性在網(wǎng)頁上無法顯示，三個(gè)屬性分別為：Text="&#xe600;" Text="&#xe61c;" Text="&#xe63d;"
⑥在CS代碼中使用字體圖標(biāo)，MainWindow.xaml.cs代碼：
using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threading.Tasks;using System.Windows;using System.Windows.Controls;using System.Windows.Data;using System.Windows.Documents;using System.Windows.Input;using System.Windows.Media;using System.Windows.Media.Imaging;using System.Windows.Navigation;using System.Windows.Shapes;namespace IconFontDemo{    /// <summary>    /// MainWindow.xaml 的交互邏輯    /// </summary>    public partial class MainWindow : Window    {        public MainWindow()        {            InitializeComponent();            ios.Text = "/xe602";            android.Text = "/xe60c";        }    }}⑦最終效果演示