C# 在WPF .net8.0框架中使用FontAwesome 6和IconFont图标字体

news2024/11/24 2:12:33

文章目录

    • 一、在WPF中使用FontAwesome 6图标字体
      • 1.1 下载FontAwesome
      • 1.2 在WPF中配置引用
        • 1.2.1 引用FontAwesome字体文件
        • 1.2.2 将字体文件已资源的形式生成
      • 1.3 在项目中应用
        • 1.3.1 使用方式一:局部引用
        • 1.3.2 使用方式二:单个文件中全局引用
        • 1.3.3 使用方式三:整个项目中全局引用
    • 1.4 效果图
    • 二、在WPF中使用IconFont图标字体
      • 2.1 下载IconFont字体文件
      • 2.2 在WPF中配置引用
        • 2.2.1 引用IconFont字体文件
        • 2.2.2 将字体文件已资源的形式生成
      • 2.3 在项目中应用
        • 2.3.1 使用方式一:局部引用
        • 2.3.2 使用方式二:单个文件中全局引用
        • 2.3.3 使用方式三:整个项目中全局引用
    • 2.4 效果图

一、在WPF中使用FontAwesome 6图标字体

1.1 下载FontAwesome

官网下载地址:https://fontawesome.com/download
选择下载:Free For Desktop
在这里插入图片描述
下载完成后解压可在otfs文件下找到如下三个文件:
在这里插入图片描述

1.2 在WPF中配置引用

1.2.1 引用FontAwesome字体文件

在WPF项目中新建文件夹,如Fonts,将上面下载解压好的三个ttf文件复制到Fonts目录下
在这里插入图片描述

1.2.2 将字体文件已资源的形式生成

如下图所示:
选择Font Awesome 6 Brands-Regular-400.ttf, Font Awesome 6 Free-Regular-400.ttf, Font Awesome 6 Free-Solid-900.ttf,右键【属性】

  • 生成操作:资源
  • 复制操作:如果较新则复制始终复制

在这里插入图片描述

1.3 在项目中应用

1.3.1 使用方式一:局部引用
<Label  FontFamily="pack://application:,,,/Fonts/#Font Awesome 6 Free Solid" FontSize="128" Content="&#xf8cc;" Foreground="Red"/>

其中/Fonts为Font Awesome 6 Free-Solid-900.ttf坐在的目录,#之后为字体名称,字体名称可双击Font Awesome 6 Free-Solid-900.ttf文件查询
在这里插入图片描述
Content="&#xf8cc;"为对应图标的十六进制,具体的值可以通过官网https://fontawesome.com/search来进行查询
在这里插入图片描述

1.3.2 使用方式二:单个文件中全局引用

在mainwindow.xml中设置样式

<Window.Resources>
    <Style x:Key="FontAwesome">
        <Setter Property="TextElement.FontFamily" Value="pack://application:,,,/Fonts/#Font Awesome 6 Free Solid"></Setter>
    </Style>
</Window.Resources>

在控件中添加style属性的配置,其中IconFont对应style中配置的x:key的值

<Label Style="{DynamicResource FontAwesome}" FontSize="128" Content="&#xf8cc;" Foreground="Lime"/>
1.3.3 使用方式三:整个项目中全局引用

在App.xml中设置样式

<Application.Resources>
    <ResourceDictionary>
        <Style x:Key="AppFontAwesome">
            <Setter Property="TextElement.FontFamily" Value="pack://application:,,,/Fonts/#Font Awesome 6 Free Solid"></Setter>
        </Style>
    </ResourceDictionary>
</Application.Resources>

在控制中引用

<Label Style="{DynamicResource AppFontAwesome}" FontSize="128" Content="&#xf8cc;" Foreground="Blue"/>

1.4 效果图

在这里插入图片描述

二、在WPF中使用IconFont图标字体

2.1 下载IconFont字体文件

iconfont官网:https://www.iconfont.cn/?spm=a313x.search_index.i3.2.411c3a81NwQdm7

a. 搜索到需要的图标,然后点击下图按钮添加入库
在这里插入图片描述
b. 完成所有需要的图标入库之后,可以点击后侧类似购物车的图标;在弹出的界面中,可以查看所有入库的图标,然后点击【下载代码】

在这里插入图片描述

2.2 在WPF中配置引用

2.2.1 引用IconFont字体文件

将解压得到的6个文件全部复制到项目中去,比如这边复制的目录为IconFont文件夹
注:.ttf为字体文件
在这里插入图片描述

2.2.2 将字体文件已资源的形式生成

如下图所示:
选择iconfont.ttf,右键【属性】

  • 生成操作:资源
  • 复制操作:如果较新则复制始终复制
    在这里插入图片描述

2.3 在项目中应用

2.3.1 使用方式一:局部引用
<Label  FontFamily="pack://application:,,,/IconFont/#iconfont" FontSize="128" Content="&#xe8a7;" Foreground="Red"/>

其中/IconFont为iconfont.ttf坐在的目录,#之后为字体名称,字体名称可双击iconfont.ttf文件查询
在这里插入图片描述
Content="&#xe8a7;"为对应图标的十六进制,具体的值可以通过打开demo_index.html来进行查询
在这里插入图片描述

2.3.2 使用方式二:单个文件中全局引用

在mainwindow.xml中设置样式

<Window.Resources>
    <Style x:Key="IconFont">
        <Setter Property="TextElement.FontFamily" Value="pack://application:,,,/IconFont/#iconfont"></Setter>
    </Style>
</Window.Resources>

在控件中添加style属性的配置,其中IconFont对应style中配置的x:key的值

<Label Style="{DynamicResource IconFont}" FontSize="128" Content="&#xe8a7;" Foreground="Lime"/>
2.3.3 使用方式三:整个项目中全局引用

在App.xml中设置样式

<Application.Resources>
    <ResourceDictionary>
        <Style x:Key="AppIconFont">
            <Setter Property="TextElement.FontFamily" Value="pack://application:,,,/IconFont/#iconfont"></Setter>
        </Style>
    </ResourceDictionary>
</Application.Resources>

在控制中引用

<Label Style="{DynamicResource AppIconFont}" FontSize="128" Content="&#xe8a7;" Foreground="Blue"/>

2.4 效果图

在这里插入图片描述
##【参考程序】
参考程序下载:WPFICONFontApp.rar

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1872822.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Transformer教程之Encoder-Decoder架构

在当今的自然语言处理&#xff08;NLP&#xff09;领域&#xff0c;Transformer已经成为不可或缺的模型。它以其高效的并行计算和卓越的性能在多个任务中占据了主导地位。在这篇文章中&#xff0c;我们将深入探讨Transformer的核心——Encoder-Decoder架构&#xff0c;帮助大家…

可燃气体报警器:广东深圳五金行业的安全守护者

在广东深圳这一五金制造与集散的重地&#xff0c;安全问题一直受到业界和社会的高度重视。在五金行业的日常运营中&#xff0c;可燃气体作为能源的重要来源&#xff0c;其安全使用与监控显得尤为重要。 可燃气体报警器作为保障生产安全的重要设备&#xff0c;在五金行业中扮演…

入门机器视觉的正确打开方式——徒手撸一个python+opencv实现的机器视觉简易调试工具(下)

目录 1.引言2.框架思路3.图像处理流程化的实现3.1如何解析图像流程数据结构3.2 使用networkx网络图库3.3 python实现 4.结论5.python源码PS.扩展阅读ps1.六自由度机器人相关文章资源ps2.四轴机器相关文章资源ps3.移动小车相关文章资源 1.引言 在当今AI时代&#xff0c;关于视觉…

【JPCS独立出版】第四届机电一体化技术与航空航天工程国际学术会议(ICMTAE 2024,8月2-4)

第四届机电一体化技术与航空航天工程国际学术会议&#xff08;ICMTAE 2024&#xff09;将围绕“机电一体化”、“电工与电子技术”、“航天工程”与“航空工程”等相关最新研究领域&#xff0c; 为来自国内外高等院校、科学研究所、企事业单位的专家、教授、学者、工程师等提供…

【语言模型】Xinference的部署过程

一、引言 Xinference&#xff0c;也称为Xorbits Inference&#xff0c;是一个性能强大且功能全面的分布式推理框架&#xff0c;专为各种模型的推理而设计。无论是研究者、开发者还是数据科学家&#xff0c;都可以通过Xinference轻松部署自己的模型或内置的前沿开源模型。Xinfe…

【MTK平台】如何学习Bluedroid A2DP Code

一 Bluedroid A2DP架构图 备注: vendor/mediatek/proprietary/packages/modules/Bluetooth/system/audio_a2dp_hw/src 目录下编译生成audio.a2dp.default.so,主要实现a2dp做为设备的功能 二 A2DP File Hierarchy ModuleFileDescriptionAudio HAL (hardware/libhardware/…

好用的兼容性测试工具推荐

兼容性测试确保软件在不同系统和环境中的一致性。本指南探讨了开发人员和QA专业人员有效检测和解决问题的工具&#xff0c;从而提高应用程序的稳健性和用户满意度。 好用的兼容性测试工具推荐 1.Lambda测试 它是一个由AI驱动的测试编排和执行平台&#xff0c;可让您使用超过300…

微信小程序在线客服源码系统 附带完整的安装代码包以及搭建部署教程

系统概述 微信小程序在线客服源码系统是一款基于微信小程序的客服解决方案&#xff0c;它集成了实时通讯、聊天记录保存、智能机器人客服、自定义消息通知、多客服协同工作、客户信息管理、数据统计与分析等多项功能。该系统采用云端架构&#xff0c;确保数据的安全性和可恢复…

北京小程序开发如何选择开发团队与开发语言?

随着移动互联网的飞速发展&#xff0c;小程序的开发与使用也变得越来越频繁。对于商户来说&#xff0c;市面上的小程序开发团队数量众多又鱼龙混杂&#xff0c;应该如何选择合适的开发团队与开发语言呢&#xff1f; 一&#xff0e; 北京小程序的开发语言的种类及不同 北京小程…

正版软件 | WIFbox:智能化文件管理工具,让效率与隐私并行

在数字化办公日益普及的今天&#xff0c;文件管理成为了提升工作效率的关键。WIFbox 一款智能文件管理工具&#xff0c;利用强大的人工智能技术&#xff0c;帮助您快速对文件进行分类&#xff0c;完成复杂的智能文件分类任务。 智能分类&#xff0c;效率倍增 WIFbox 通过精细化…

三河市寄大件物品快递多少钱?

在三河市&#xff0c;如果你需要寄送大件物品&#xff0c;费用问题无疑是你最关心的。不同的快递公司收费标准各异&#xff0c;今天&#xff0c;就让我们来探讨一下&#xff0c;从三河市寄大件物品&#xff0c;哪家快递更划算。 1. 祺祺寄快递&#xff1a; “祺祺寄快递”是一…

Vscode lanuch.json

Intro 使用launch.json 能够方便的运行需要传很多参数的代码文件 如下&#xff1a; import math import argparse # 1、导入argpase包def parse_args():parse argparse.ArgumentParser(descriptionCalculate cylinder volume) # 2、创建参数对象parse.add_argument(--rad…

【原创教程】FX5UCPU扩展FX3模拟量模块应用案例(新手篇)

模块配置 名称 型号 数量 PLC FX5U-64MR/ES 1个 总线转换模块 FX5U-CNV-BUS 1个 FX3U模拟量输入模块 FX3U-4AD 2个 ①硬件配置 扩展FX3模块时,若在总线转换模块后面添加了FX3扩展电源模块,则最多可添加8个FX3智能模块,否则最多6个。 ②软件配置

程序猿大战Python——Python与MySQL交互三

SQL注入 目标&#xff1a;了解什么是SQL注入&#xff1f; SQL注入指的是&#xff1a;恶意篡改或注入SQL条件。 当开发者的数据条件若被恶意篡改&#xff0c;那就达不到预期的查询效果。 为了了解SQL注入是怎么回事&#xff1f;通过一个案例来分析。 例如&#xff0c;使用命令…

vue3【实战】创建项目、创建并提交代码到远程仓库,安装 SASS, 清除浏览器默认样式 reset-css, 清除模板代码,提升开发效率的必要集成

新建远程仓库&#xff08;码云&#xff09; https://gitee.com/ 得到远程仓库地址 https://gitee.com/sunshine39/ec-web-vue3.git创建项目 vscode 安装插件 vue3-snippets-for-vscode安装 node v20.12.2设置淘宝镜像 npm config set registry https://registry.npmmirror.c…

Linux 的启动流程

第一步、加载内核 操作系统接管硬件以后&#xff0c;首先读入 /boot 目录下的内核文件。 以我的电脑为例&#xff0c;/boot 目录下面大概是这样一些文件&#xff1a; $ ls /bootconfig-3.2.0-3-amd64config-3.2.0-4-amd64grubinitrd.img-3.2.0-3-amd64initrd.img-3.2.0-4-amd6…

laravel对接百度智能云 实现智能机器人

创建API Key和 Secret Key进入网址&#xff1a;百度智能云千帆大模型平台 如下图操作&#xff1a; 填写完毕点击确认后&#xff0c;即可得到sk和ak 后端接口实现代码&#xff1a; //调用百度智能云第三方机器人接口public function run($text) {$curl curl_init();curl_setop…

I/O系统

1. I/O接口 接口可以看做两个系统或两个部件之间的交接部分&#xff0c;它既可以是两种硬设备之间的连接电路&#xff0c;也可以是两个软件之间的共同逻辑边界。 I/O接口通常是指主机与I/O设备之间设置的一个硬件电路及其相应的软件控制。 2. 程序查询方式 程序查询方式是一…

代码统计工具V1.0.0(支持各种文件类型)

点击下载《代码统计工具&#xff08;支持各种文件类型&#xff09;》 1. 前言 本文介绍了一款使用C#开发的代码行数统计软件。该软件允许用户通过选择文件目录和设置统计项目类型&#xff0c;来统计指定目录下的代码行数。软件提供了三种统计方式&#xff1a;按文件名统计、按…

虹科技术丨Linux环境再升级:PLIN驱动程序正式发布

来源&#xff1a;虹科技术丨Linux环境再升级&#xff1a;PLIN驱动程序正式发布 原文链接&#xff1a;https://mp.weixin.qq.com/s/N4zmkYXTPr7xm-h2s7QiLw 欢迎关注虹科&#xff0c;为您提供最新资讯&#xff01; #PLIN #LIN #LIN接口 导读 Linux驱动程序领域再添新成员&am…