WPF中使用iconfont图标

下载 iconfont 资源

  1. 登录官网 :打开阿里巴巴矢量图标库官网(https://www.iconfont.cn/),若有账号可直接登录,无账号则需注册一个。
  2. 查找图标:通过搜索框输入关键词,或浏览分类查找所需图标。
  3. 添加图标:找到心仪的图标后,点击图标进入详情页面,鼠标悬浮在图标上,选择 "添加入库"。
  4. 下载图标:点击页面右上角 "购物车",选择 "添加至项目",可新建项目或添加到现有项目。然后点击 "下载至本地",将图标资源以压缩包形式下载到电脑。

在 WPF 项目中使用下载的资源

  1. 解压文件 :将下载的压缩包解压,找到里面的.ttf字体文件,如iconfont.ttf
  2. 添加字体文件到项目 :在 Visual Studio 中打开 WPF 项目,创建ResourcesFonts文件夹(也可根据项目结构自行决定放置位置),将iconfont.ttf文件导入其中。选中iconfont.ttf文件,在属性中将 "生成操作" 设置为 "资源" 或 "Resource","复制到输出目录" 设置为 "不复制"。
  3. 引入字体文件 :在App.xaml中添加字体文件引用,代码如下:

xml

xml 复制代码
<FontFamily x:Key="DefautFont">/项目名;Component/Resources/Fonts/#字体名称</FontFamily>

其中,"项目名" 替换为实际的项目名称,"字体名称" 可双击打开iconfont.ttf文件查看,通常为iconfont

  1. 使用图标 :在需要使用图标的控件中,引用定义好的字体资源,并通过图标代码显示图标。例如,在TextBlock控件中使用,代码如下:

xml

xml 复制代码
<TextBlock FontFamily="{StaticResource DefautFont}" Text="&#xe62e;" />

"&#xe62e;" 为图标对应的 Unicode 编码,可在下载文件中的demo_index.html文件中查看,找到对应图标即可获取其编码。

相关推荐
Poetinthedusk13 小时前
WPF应用跟随桌面切换
开发语言·wpf
小北方城市网16 小时前
MongoDB 分布式存储与查询优化:从副本集到分片集群
java·spring boot·redis·分布式·wpf
听麟1 天前
HarmonyOS 6.0+ 智慧出行导航APP开发实战:离线地图与多设备位置协同落地
华为·wpf·harmonyos
笨蛋不要掉眼泪2 天前
Spring Boot + RedisTemplate 数据结构的基础操作
java·数据结构·spring boot·redis·wpf
LcVong3 天前
WPF MediaPlayer获取网络视频流当前帧并展示图片完整范例
网络·wpf
bugcome_com3 天前
WPF数据绑定入门:从传统事件到5种绑定模式
wpf
LateFrames3 天前
我用 WPF 做了一个 “苍蝇飞舞” 的屏保
ui·wpf
wuty0073 天前
完善基于WPF开发的标尺控件(含实例代码)
wpf·wpf标尺·支持横向竖向标尺·ruler
浩浩测试一下4 天前
洪水猛兽攻击 Ddos Dos cc Drdos floods区别
安全·web安全·网络安全·系统安全·wpf·可信计算技术·安全架构
无心水4 天前
分布式环境下定时任务与SELECT FOR UPDATE的陷阱与解决方案
分布式·后端·wpf·xxl-job·quartz·定时任务·selectforupdate