WPFではTTFアイコンフォントを使用

アイコンとは？

ベクターグラフィックスをフォントの形にパッケージ化し、フォントを使用するのと同じ方法で、アイコンのサイズや色を自由に設定できます。従来の写真と比較して、利点は明らかです。

小型、高速ロード、高性能
ベクトル（歪みのない自由拡大縮小）
柔軟性コードでアイコンの色を変更可能

しかし、それと同様に、いくつかの欠点があります。

以前の設計との互換性が難しく、交換作業が多い
デザイナーのデザインに合わせるのが難しく、コミュニケーションの調整コストがやや高い

よく使うアイコンのフォント

首先推荐的是阿里巴巴矢量图标库，这个里面方案比较多，也有很多成套的图标，可以多尝试尝试，之前只需要登录就行了，现在好像还要验证手机号，有点恶心。

其次就是Font Awesome 图标，这里分为旧版和新版（V5 版本 or Pro 版本），旧版是免费，图标较少。

微软目前提供了两套，一套是 Windows10 的Segoe MDL2 Assets 图标，一套是 windows11 的Segoe Fluent 图标。

Google 有一套开源的 Material Design icons 的图标字体，之前是提供下载到本地的，没找到了Material Design icons by Google。

残りは言わないで、アイコンのフォントが多いので、自分で検索してください!

WPFでアイコンフォントを使用する方法

本例子中使用的是微软的 Segoe MDL2 Assets 图标，下图是网站中图标字体的部分展示，其中可以看到一个Unicode码位，这个是用来标识当前这个字体的，后面也需要用这个来显示我们的字体。

字体展示

Windows 10での使用方法

这套图标字体在Windows10中是自带的，所以可以直接设置FontFamily属性为Segoe MDL2 Assets，来获得图标的支持：

<TextBlock
  FontFamily="Segoe MDL2 Assets"
  FontSize="50"
  Foreground="Red"
  Text="&#xE702;"
/>

其中Text就是由描述中的Unicode码位来构成的，不过需要在文本前加上&#x，文本后加上分号;,完整的就是”“。

フォントファイルを参照する方法

但是这种方式只支持Window10系统，如果在其他系统上，就会无法显示，所以我们下载 Segoe MDL2 Assets图标字体，将下载的压缩包中的SegMDL2.ttf拷贝到我们的项目，为了方便管理，放到了项目中新建的Fonts文件夹下：

然后选中SegMDL2.ttf在下方的属性栏中将生成操作改为资源，这样这个文件就会以资源的形式包含在我们的 WPF 程序中：

使用图标字体的方式跟上面是一样的，但是因为是通过外置字体的形式来添加到 WPF 程序中的，所以FontFamily设置的属性值就有点讲究了，大概可以表述为pack://application:,,,/项目名称空间;component/字体路径/字体文件名#字体实际名称，下面来一个一个介绍（后面引用自定义资源文件也可以参考此规则，不过#字体名称就不需要了，具体看下方）：

项目名称空间：如果没有私自改过项目名称空间，那么你的项目名称空间就是项目的名称，我这里的项目名称叫WPF_Blog_Test,所以项目名称空间也是如此，如果不清楚你的项目名称空间是什么，可以打开你的XAML文件，比如项目中的App.xaml，可以看到xaml文件中的x:Class属性，或者后台类的namespace：

字体路径/文件名：字体文件这里是放在Fonts文件夹下的，所以我的字体路径和文件名为Fonts/SegMDL2.ttf,文件名这里有个小插曲，应使用属性中显示的文件名：

字体实际名称：字体的实际名称需要我们双击打开字体，然后才能看到（别再 VS 中打开，不然看到的是字节码，在 windows 的文件夹中选中文件双击打开），这里SegMDL2.ttf的实际名称是Segoe MDL2 Assets：

所以FontFamily应该设置为”pack://application:,,,/WPF_Blog_Test;component/Fonts/SegMDL2.ttf#Segoe MDL2 Assets“，贴个代码，收工！

<TextBlock
  FontFamily="pack://application:,,,/WPF_Blog_Test;component/Fonts/SegMDL2.ttf#Segoe MDL2 Assets"
  FontSize="50"
  Foreground="Red"
  Text="&#xE702;"
/>

PS：为了不让每次用都写这么长的FontFamily，可以考虑在资源中写好再引用，或者定义一个 TextBlock 图标字体样式（再扯点），已经了解资源定义的下面可以略过。

カスタム·リソース

新建文件夹Styles，在该文件夹下新建资源文件IconFonts（右键 Styles，选择添加资源字典）。两种方式都写在IconFonts这个文件中了，方便演示就少搞点：

定義のスタイルを記述します（コードは下の画像）：

<FontFamily x:Key="SegIconFont">
  pack://application:,,,/WPF_Blog_Test;component/Fonts/SegMDL2.ttf#Segoe MDL2
  Assets
</FontFamily>

<style x:Key="tbSegIconFontKey" TargetType="{x:Type TextBlock}">
  <Setter Property="FontFamily" Value="pack://application:,,,/WPF_Blog_Test;component/Fonts/SegMDL2.ttf#Segoe MDL2 Assets" />
  <Setter Property="Foreground" Value="Red" />
  <Setter Property="FontSize" Value="50" />
</style>

此时只是添加了一个名叫IconFonts资源字典，还需要引入到项目中，才能在界面中使用，所以需要在App.xaml文件中添加一条引用语句，即告知程序需要将新建的这个资源字典包含进来，语句为<ResourceDictionary Source="pack://application:,,,/WPF_Blog_Test;component/Styles/IconFonts.xaml" />，名称空间和资源路径规则上面已表述，添加一个App.xaml的截图：

残りはプログラム内で直接コードに使われます

<!--  最原始方式  -->
<TextBlock
  FontFamily="pack://application:,,,/WPF_Blog_Test;component/Fonts/SegMDL2.ttf#Segoe MDL2 Assets"
  FontSize="50"
  Foreground="Red"
  Text="&#xE702;"
/>

<!--  定义FontFamily资源  -->
<TextBlock
  FontFamily="{StaticResource SegIconFont}"
  FontSize="50"
  Foreground="Red"
  Text="&#xE702;"
/>

<!--  定义TextBlock Style样式  -->
<TextBlock
  FontSize="50"
  Foreground="Red"
  Style="{StaticResource tbSegIconFontKey}"
  Text="&#xE702;"
/>

こんなに多くの画像をカットするとは思わなかった、ロジックが明確であればいいのに、見てくれてありがとう!

本文园，作者：丑萌狗，请原文：htt/www.cnblogs.com/choumengqizhigou/p/15550133.html

QQグループから転載：56 0 6 1 15 1 4

WPFではTTFアイコンフォントを使用

アイコンとは？

よく使うアイコンのフォント

WPFでアイコンフォントを使用する方法

Windows 10での使用方法

フォントファイルを参照する方法

カスタム·リソース

延伸阅读

Avalonia UIの進化ロジックとQtの生態深さの比較

WPFからAvaloniaへの移行シリーズ：WPFプログラムをAvaloniaに移行する必要がある理由

WPFはカスタムXMLファイルで国際化を実現

WPFのビデオを作ったのは“マイクロソフトからお金をもらった”からです