UWP IoT 如何添加自定义字体答案

【问题标题】：UWP IoT how to add custom fontUWP IoT 如何添加自定义字体
【发布时间】：2018-09-01 14:49:48
【问题描述】：

我未能添加自定义字体。我遵循了here 的步骤，它引用了this page，但没有使用字体。

我已将字体添加到我的项目中

确实出现在我的设计师视图中

在 Windows 中打开的字体（验证字体名称）：

但是当我提到它们时，它们仍然没有在我的应用程序中使用。我尝试了以下语法

<TextBlock 
    Grid.Column="1" 
    Text="{x:Bind Text}"
    FontFamily="ms-appx:///Assets/Delphi-Soleto_Lt.ttf#Delphi-Soleto Light"/>

或者当我在设计器中选择字体时设计器会填写它

<TextBlock 
    Grid.Column="1" 
    Text="{x:Bind Text}"
    FontFamily="Delphi-Soleto Light"/>

或如this site 建议的那样

<TextBlock 
    Grid.Column="1" 
    Text="{x:Bind Text}"
    FontFamily="/Assets/Delphi-Soleto_Lt.ttf#Delphi-Soleto Light"/>

非常感谢您的帮助...！

已将 GIT 代码库上传到：

https://github.com/basprins/CustomFontWinIot

我正在尝试在BulletText.xaml 中使用 Delphi 字体：

    <TextBlock 
        Grid.Column="1" 
        Margin="0, 13, 0, 0"
        Style="{StaticResource Normal}" 
        Text="{x:Bind Text}"
        FontFamily="{StaticResource DefaultFont}"/>

我在主页中添加了BulletText 控件，该控件将在应用启动时立即可见。

使用空白应用程序更新 git repo，该应用程序引用了不会显示的字体

在我的 PC 上，我确实没有将字体安装到 Windows 中。我刚刚将它们添加到项目中。代码见github页面。设计器视图截图

【问题讨论】：

转到所有字体文件的属性并确保它们被标记为类型“内容”和“请勿复制”作为构建操作
@touseefbsb 不一样的结果。它仍然默认返回 Segoe UI
请将它上传到一个公共的 github 仓库并与我们分享，我会尝试看看它:)
也可以试试 "ms-appx:/Assets...." （这意味着这里用 1 代替 3 /// 看看是否有帮助
我点击此链接 (ian.bebbs.co.uk/posts/UsingSVGInUWP) 将 svg 图标添加到我的应用程序中，它适用于我。我想知道你是如何创建这些字体文件的？

标签： c# fonts uwp

【解决方案1】：

您不应使用FontFamily 属性中的字体粗细索引来引用字体文件。如果需要设置字体粗细，可以设置TextBlock的FontWeight属性。试试这个：

<StackPanel>
    <!--Don't add "Light" in the FontFamily-->
    <TextBlock FontFamily="ms-appx:///Assets/Delphi-Soleto_Lt.ttf#Delphi-Soleto"
               Text="Hello world, this is my test"/>
    <!--Don't add "Thin" in the FontFamily-->
    <TextBlock FontFamily="ms-appx:///Assets/Delphi-Soleto_Th.ttf#Delphi-Soleto"
               Text="Hello world, this is my test"/>
    <!--This is the default font family, set the FontWeight property-->
    <TextBlock Text="Hello world, this is my test" FontWeight="Normal"/>
</StackPanel>

效果如下：

【讨论】：

我创建了一个新项目，在 /Assets 中添加了字体。将副本设置为输出 = 始终。复制/粘贴您的示例。运行项目，所有文本都出现没有所需的字体。文本仅以默认字体显示。您是否下载了字体并有工作版本？你真的证明它可以工作吗？因为我对这一切都失去了信心......我的截止日期是 4 天，我担心我将无法以客户字体显示应用程序......非常感谢帮助！
是的，我只是使用上面github.com/basprins/CustomFontWinIot提供的示例，然后我创建一个新的空白页面来添加这些TextBlocks并在项目中使用您的字体，它们可以使用。你可以试试看。
请注意，您的字体 (Delphi-Soleto_Th.ttf) 与默认字体非常相似。我在答案中添加了图片。
你是否也在windows中安装了字体？或者只是将它们添加到您的项目中？
就在项目中。你可以上传一个新的 uwp 简单示例，在你这边无法使用，然后我会尝试在我这边测试。

【解决方案2】：

到目前为止，我在 winiot/UWP 中遇到的最大困难...但是这里...

其他正在拔头发的人的一些注意事项。

首先，这是可能的。但是许多网站告诉你一个不同的故事，它使已经过于复杂的功能过于复杂恕我直言。

在物联网设备上可视化字体所需完成的步骤：

将字体添加到您的项目中

大多数网站都会告诉您的显而易见的第一步。不过有几点意见。

在哪里存储字体并不重要。它们可以驻留在 /Assets、/Fonts、/Assets/Fonts、/Resources 或任何您喜欢的位置。
您不必为copy to output 烦恼。你如何定义它并不重要。
您确实需要将构建操作留给Content。这是默认设置，因此您也不必为此烦恼。

参考字体系列名称

找出正确的字体名称可能很糟糕。约定如下[fontfamily file path]#[font family name]。

一个例子是：

Assets/Delphi-Soleto_Lt.ttf#Delphi-Soleto

或者在完整的 xaml 中：

<TextBlock FontFamily="Fonts/Delphi-Soleto_Lt.ttf#Delphi-Soleto" Text="This is Delphi Soleto Light" />

无论您是否使用 msappx 语法引用路径都没有关系，以下所有定义都将起作用：

<TextBlock FontFamily="Fonts/Delphi-Soleto_Lt.ttf#Delphi-Soleto" Text="This is Delphi Soleto Light" />

<TextBlock FontFamily="/Fonts/Delphi-Soleto_Lt.ttf#Delphi-Soleto" Text="This is Delphi Soleto Light" />

<TextBlock FontFamily="ms-appx:///Fonts/Delphi-Soleto_Lt.ttf#Delphi-Soleto" Text="This is Delphi Soleto Light" />

字体名称

然后是大的，字体名称。重要的是要知道，字体样式应该从字体名称中删除。例如

字体名称为 Delphi-Soleto Light 的文件“Delphi-Soleto_Blk.ttf”变为 Delphi-Soleto
字体名称为 Delphi-Soleto Black 的文件“Delphi-Soleto_Blk.ttf”变为 Delphi-Soleto
字体名称为 Delphi-Soleto App Black 的文件“Delphi-Soleto_A_Blk.ttf”变为 Delphi-Soleto App

为了节省您一开始的猜测时间，这里有一个工具可以帮助您度过难关。小心使用 windows 字体查看器，因为它可能不会显示您需要查看的内容。请下载免费的dp4 font viewer。

如果您打开 dp4 字体查看器并找到包含您的字体的文件夹，您将看到正确的字体名称。请注意下面屏幕截图中的字体系列名称。

验证所需字体的文本

最后但同样重要的是，一些网站声称 xaml 设计器会立即以字体显示文本，这很容易测试。它确实不在我这边这样做。最后对我有帮助的是将我的应用程序部署在我的目标上（在我的情况下是 RPI），并在应用程序在调试器中运行时更改 XAML。这些变化会立即反映在您正在运行的应用中。

最后，我可以看看我的屏幕并看到我的字体可视化

我希望这会有人在那里！特别感谢 Breeze Liu 抽出时间帮助我！

【讨论】：

【解决方案3】：

在 UWP 应用程序中使用自定义字体的一种方式是在 App.xaml 中定义：

1 - 在项目的根目录中创建一个文件夹并将其命名为 "Fonts"

2 - 选择自定义字体，然后按 F4 并将 复制到输出目录 设置为 始终复制

3 - 在 App.xaml 文件 > Application.Resources 标签 > ResourceDictionary 标签中，添加以下代码：

<FontFamily x:Key="DefaultFont">/Fonts/(Your FontName).ttf#(Font Title)</FontFamily>

之后，您可以随时随地在元素中使用字体，如下所示：

<TextBlock Text="Your Sample Text" FontFamily="{StaticResource DefaultFont}"></TextBlock>

【讨论】：

你可以试试这个<FontFamily x:Key="DefaultFont">/Fonts/(Your FontName).ttf</FontFamily> 吗？

【解决方案4】：

刚刚添加到 2020 年末，在针对 Windows 10 版本 1809（内部版本 17763）的 UWP 项目中，我只能通过使用前导斜杠来引用自定义字体，例如

FontFamily="/Assets/Fonts/PT_Sans/PTSans-Regular.ttf#PT Sans"

如果没有前导斜杠或以 ms-appx:/// 开头的 uri，它将默认为标准字体。在这上面拉了几根头发。

构建操作：内容

复制到输出目录：不要复制

使用的字体是 PTSans-Regular.ttf，从 google 下载。

【讨论】：