版权声明：本文为博主原创文章，转载请注明出处。 https://blog.csdn.net/lwwl12/article/details/78606747

常用的矢量字体图标：阿里巴巴iconfont，FontAwesome；今天介绍如何在wpf中使用阿里巴巴iconfont矢量图标。其他矢量图标也是类似的使用方式。

1.下载矢量图标ttf文件，并包括在项目中

具体如何下载，不详写了。将ttf文件拷贝至项目，并包括在项目中。

下载下来的文件内容：

我们需要将iconfont.ttf包括在项目中，打开demo_unicode.html可以看到字体图标的unicode编码：

项目文件目录：

2.在style中定义样式

我的ttf文件是放在/Resource/目录下，所以FontFamily的值为/Resources/#iconfont，文件目录可以为其他目录，相应的修改Value值即可。ttf文件名称不重要，可以任意修改。#iconfont是字体名称，阿里巴巴的矢量图标默认字体名称为iconfont，不可以写错了。

        <Style x:Key="FIcon" TargetType="TextBlock">

            <!--<Setter Property="FontFamily" Value="/MefMain;component/Resources/#iconfont"></Setter>-->

            <Setter Property="FontFamily" Value="/Resources/#iconfont"></Setter>

            <Setter Property="TextAlignment" Value="Center"/>

            <Setter Property="HorizontalAlignment" Value="Center"/>

            <Setter Property="VerticalAlignment" Value="Center"/>

            <Setter Property="FontSize" Value="20"/>

        </Style>

3.使用字体图标

    <StackPanel>

        <TextBlock Text="" Style="{StaticResource FIcon}" FontSize="50" Margin="3" Foreground="Black"></TextBlock>

        <TextBlock Text="" Style="{StaticResource FIcon}" FontSize="50" Margin="3" Foreground="Black"></TextBlock>

        <TextBlock Text="" Style="{StaticResource FIcon}" FontSize="50" Margin="3" Foreground="Black"></TextBlock>

        <TextBlock Text="" Style="{StaticResource FIcon}" FontSize="50" Margin="3" Foreground="Black"></TextBlock>

    </StackPanel>