如何在 WPF 中使用图标 [Font-awesome]

Question

我是 WPF 新手。我想在文本框和按钮中使用 Font-awesome Icon。但图标未与我的文本框绑定

我在我的应用程序中安装了 Font-awesome 资源。

告诉我如何使用它

谢谢，

我真的需要它请帮助我..

Example

第 1 步：下载 Font-Awesome

工具 -> 库包管理器 -> 包管理器控制台安装

PM > 安装包 FontAwesome.WPF

第 2 步：添加资源

<Application> xmlns:fa="http://schemas.fontawesome.io/icons/" </Application>

第 3 步：输入 App.xaml

<Application.Resources>

    <Style x:Key="FontAwesome">
        <Setter Property="TextElement.FontFamily" Value="pack://application:,,,/fonts/#FontAwesome" />
    </Style>

</Application.Resources>

第 4 步：在 Demo.xaml

中使用它

<TextBlock Style="{StaticResource FontAwesome}"
FontSize="75"
Text="&#xf133;" />

第 5 步：- 输出

Answer 1

首先，下载 Font Awesome，解压缩 ZIP 文件并将 fonts/fontawesome-webfont.ttf 复制到解决方案中的 Fonts 文件夹中。如果尚未将属性中的构建操作设置为资源

接下来，向 App.xaml 中的资源添加样式。不要忘记字体名称前面的 # 并记住使用字体的内部名称，而不是文件名。要检查字体名称，只需双击字体文件，它将在 Windows 字体查看器中打开。字体名称将在顶部。

<Application.resources>
<FontFamily x:Key="FontAwesome">/Fonts/fontawesome-webfont.ttf#FontAwesome</FontFamily>
</Application.resources>

打开 MainWindow.xaml 并将网格替换为以下代码段：

<Grid VerticalAlignment="Center" HorizontalAlignment="Center">

<StackPanel Orientation="Horizontal" >

<TextBlock Text="I" FontSize="32" Margin="10" VerticalAlignment="Center"></TextBlock>


<TextBlock x:Name="tbFontAwesome" Text="&#xf004;" FontFamily="{StaticResource FontAwesome}" Foreground="Red" FontSize="32" Margin="10" VerticalAlignment="Center"></TextBlock>
<TextBlock Text="Font Awesome" FontSize="32" Margin="10" VerticalAlignment="Center"></TextBlock>

</StackPanel>

</Grid>

注意 "tbFontAwesome" 文本块的 "Text" 属性，它是 Heart 的 Unicode。

Cheat Sheet

Answer 2

您也可以手动从 TextBlock.That 的 FontFamily 属性中 select FontAwesome 来解决问题。

如果 FontAwesome 不在字体列表中，那么您可能需要像第一个答案建议的那样导入字体文件。

Answer 3

为了扩展已接受的答案，因为它有些过时并且缺少信息，我是这样做的：

下载FontAwesome
解压缩档案
在解压后的文件夹中，在use-on-desktop文件夹下，找到你想要的版本。 N.B。 Solid 拥有最多的免费图标；某些图标需要为普通版和精简版付费。
- 对我来说，这是 Font Awesome 5 Free-Solid-900.otf。
按照已接受的答案和大多数教程，首先在名为 Fonts 的 C# 项目中创建一个 sub-folder。将字体文件粘贴到此文件夹中。
为了简洁起见，我重命名了这个文件FontAwesome.otf
设置此文件的属性：
- 构建操作：资源
- 复制到输出目录：复制如果newer/Copy总是
在您的 App.xaml <Application.Resources> 或其他 <ResourceDictionary> 中，插入：
<FontFamily x:Key="FontAwesome">/YOUR_PROJECT_NAME;component/Fonts/FontAwesome.otf#Font Awesome 5 Free Solid</FontFamily>
- 将 YOUR_PROJECT_NAME 替换为您的项目名称。我包含它是因为如果您跨项目使用 MergedDictionaries 则需要它。
- 如果您没有将文件放在项目中 sub-folder Fonts，请重命名或省略这部分路径。
- 检查文件名是否匹配：将 FontAwesome.otf 替换为文件名（或重命名文件本身）。
- 检查内部字体名称。您可以按照接受的答案执行此操作。（从资源管理器打开 .otf 或 .tff 文件以启动 Windows 字体查看器，复制字体名称）。
- 将 Font Awesome 5 Free Solid 替换为字体名称（# 之后）。
- 不要安装该字体，否则您无法验证您是否正确执行了这些步骤，并且该字体可能无法在未安装该字体的计算机上运行。

Answer 4

我知道这是一个老问题，当时您可能还没有这个选项，所以我想我会为任何偶然发现这个问题的人提供一个更新的方法。我建议您从这里安装 NuGet 包 'FontAwesome5'：

FontAwesome5 on NuGet.org

或在 Visual Studio 的内置 NuGet 包管理器中搜索 "fontawesome5" window:

Tools > NuGet Package Manager > Manage NuGet Packages for Solution...

-当使用这个精确的搜索词时，它通常是最上面的结果。

然后只需将以下命名空间添加到您的 XAML 文档中：

xmlns:fa5="http://schemas.fontawesome.com/icons/"

然后您应该会发现向项目添加图标相对容易。例如：

<fa5:ImageAwesome Icon="Solid_ExclamationTriangle" Foreground="#FFFF7400"/>

或

<fa5:FontAwesome Icon="Solid_ExclamationTriangle" Foreground="#FFFF7400"/>

这样做的好处是 IntelliSense 会向您显示所有可用图标的列表，让您免去访问网站搜索它们的麻烦。

如何在 WPF 中使用图标 [Font-awesome]

how use icon [Font-awesome] in WPF

wpf

wpf-controls

font-awesome