绑定属性无法显示FontAwesome图标,仅直接写XAML有效,求解决方案
问题描述
希望通过ViewModel将FontAwesome图标绑定到XAML中,现有实现如下:
- 模型代码:
public string Icon { get; set; }
- ViewModel代码:
new Models.Item {Icon="",},
- XAML代码:
<Label> <Span Text="{Binding Icon}" FontFamily="Materiales" FontSize="22" /> </Label>
最终显示的是文本而非图标,需要修改或添加什么内容?
解决方案
修正FontFamily名称
当前使用的Materiales是Material Design字体的名称,并非FontAwesome的字体名。需替换为对应FontAwesome版本的正确字体标识:- FontAwesome 6 固体样式:
"FontAwesome 6 Free, Solid" - FontAwesome 6 品牌图标:
"FontAwesome 6 Brands"
修改后的XAML示例:
<Span Text="{Binding Icon}" FontFamily="FontAwesome 6 Free, Solid" FontSize="22" />- FontAwesome 6 固体样式:
替换HTML实体为Unicode字符
ViewModel中的是HTML实体编码,XAML绑定不会自动解析该格式,需直接使用Unicode转义序列\uf713:new Models.Item { Icon = "\uf713" },确保FontAwesome字体已正确嵌入项目
- 下载对应FontAwesome版本的字体文件(如
fa-solid-900.ttf、fa-brands-400.ttf) - 将字体文件添加到项目目录(例如新建
Fonts文件夹存放) - 右键字体文件→属性,设置生成操作为
Resource
- 下载对应FontAwesome版本的字体文件(如
内容的提问来源于stack exchange,提问作者Pxaml
相关产品推荐
相关产品推荐

