WPF 字体图标的使用

第1步：登录

打开阿里图标 IconFont 注册账号并登录（已有账号直接登录）

地址：https://www.iconfont.cn/

 

 第2步：添加图标

（1）查找想要到字体图标，点击添加入库后便可在右上角 “购物车” 里面看到

（2）将图标添加到项目中（没有项目需要创建一个新项目）

 

 

 

（3）下载到本地

第3步：添加到项目

将下载下来的 iconfont.ttf 字体文件添加到项目中

 

 

 

 第4步：使用

• 在XAML中使用

（1）找到之前添加到项目中的图标，复制需要用到图标的代码

 

 

 （2）设置 FontFamily 字体

这里字体的设置，用的是 Pack URI 路径

WPF的 Pack URI 路径，我们只需要记住这样的格式即可： pack://application:,,,[/程序集名称;][可选版本号;][文件夹名称;/][文件名称]

pack://application:,,,/Test;component/Assets/Font/#iconfont  根据实际情况修改红色字体就好了；注意字体图标文件名称前面需要加＃号

 

 

 

实际开发中用到字体图标比较频繁时，可以单独对字体写一个资源，然后利用绑定的的形式查找字体图标，这里需要注意的是，利用这种方法需要用 “ DynamicResource 绑定 ”的形式，如果用“ StaticResource 绑定 ”是查找不到资源的

<!--...-->
    <Window.Resources>
        <FontFamily x:Key="Iconfont">pack://application:,,,/Test;component/Assets/Font/#iconfont</FontFamily>
    </Window.Resources>
    
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center">
        <!--pack://application:,,,[/程序集名称;][可选版本号;][文件夹名称;/][文件名称]-->
        <TextBlock Text="&#xe60c;" Margin="10" FontFamily="pack://application:,,,/Test;component/Assets/Font/#iconfont" VerticalAlignment="Center"/>

        <TextBlock Text="&#xE603;" Margin="10" FontFamily="{DynamicResource Iconfont}"/>
    </StackPanel>
<!--...-->

• 在C#后台使用

在XAML中的写法 Text="" 等同于在C#中 Text = "\ue60c" 只需要把对应红色标注部分替换即可，别忘了后面的（ ；）号也需要删除