在我们的SqlSugar开发框架的WPF应端中,有时候我们需要在按钮或者其他界面元素上使用一些图标,框架中我们可以使用 lepoco/wpfui 项目的图标库,也可以使用Font-Awesome-WPF 图标库,另外我们如果喜欢阿里矢量图标库的,也可以通过使用Geometry图标来实现图标的展示,本篇随笔介绍在WPF应用中,结合阿里矢量图标库使用Geometry图标。
1、回顾lepoco/wpfui 项目的图标库,也可以使用Font-Awesome-WPF 图标库在我们之前介绍过的随笔《循序渐进介绍基于CommunityToolkit.Mvvm 和HandyControl的WPF应用端开发(7) -- 图标列表展示和选择处理》,介绍了lepoco/wpfui 项目的图标库和Font-Awesome-WPF 图标库,两种都在集成在了菜单选择上的图标设置操作中,可以根据需要选择其中一种。
1)lepoco/wpfui 项目的图标库,列表选择界面
lepoco/wpfui 项目的图标库来源于Fluent System Icons,项目地址是:https://github.com/microsoft/fluentui-system-icons
这些图标映射到枚举对象 SymbolRegular 和 SymbolFilled,一个是常规的,一个是填充的图标。我们封装的选择图标界面如下所示。
界面展示的图标代码如下所示。
2)使用Font-Awesome-WPF 图标组件
在WPF中使用Font-Awesome-WPF 图标组件的很多,它的项目地址:https://github.com/charri/Font-Awesome-WPF/blob/master/README-WPF.md。
我们也可以用类似的方式来整合这个图标组件到项目中进行使用。图标选择界面运行效果如下所示,由于图标不是很多,所以一次性加载了(没有分页)。
界面展示的图标,代码如下所示。
系统运行,动态从后端获取菜单及图标展示如下所示。
2、结合阿里矢量图标库使用Geometry图标
前面介绍了两种图标的应用方案,我们再来介绍一下Geometry图标的场景。
由于我们框架整合了HandyControl的一些组件的展示。HandyControl的控件 的
官方地址:https://github.com/HandyOrg/HandyControl
中文文档地址:https://handyorg.github.io/handycontrol/
通过它的控件扩展属性,我们可以很容易绑定按钮图标的展示。
部分按钮的定义如下所示。
通过 hc:IconElement.Geometry 的绑定,我们就可以自定义图标的展示,第一个AddGeometry 是HandyControl的内置Geometry,而第二个t_import 是我们用户扩展自定义导入的Geometry几何图形。
我们在项目定义一个 Geometries\Custom.xaml 文件,用来放置用户自定义的图标几何图形。
其中文件就是一个XML的文件定义。
该文件里面的集合图形,会在WPF应用的App中进行导入,如下代码所示。
导入文件后,这些几何图形就可以在静态资源中使用了,类似上面的代码,其中的t_import就是我们