logo标签列表

如何在Flutter中使用开放式字体（OTF）？

flutter
24
我已经在pubspec.yaml中添加了字体。任何True Type Font都可以正常工作。但是，当我添加Open Type Font时，它不起作用。
以下是我如何在pubspec.yaml中添加字体的方式。
  fonts:
    - family: Kufyan
      fonts:
        - asset: assets/fonts/Kufyan.otf
你能在这里添加你的 pubspec.yaml 代码吗？ - fayeed
请查看此链接：https://flutter.dev/docs/cookbook/design/fonts - Hairon Chaviano
2
无论是 ttf 还是 otf，它们都应该正常工作，你能提供你正在使用的字体的链接或提供吗？ - Hemanth Raj
6个回答
22

✔️ 于2021年2月24日正式生效

证明

  1. 自从这个提交（GitHub）以来 enter image description here

  2. 当前文档请查看此处（Flutter文档） enter image description here

21
最新版本的Flutter v1.12.13 不支持直接使用open type font(otf)。你需要先将otf转换为true type font(ttf)，然后再在项目中使用。你可以使用第三方网站将字体转换为ttf格式。你可以参考有关Flutter中使用自定义字体的指南获取更多信息。
Flutter会根据字体本身的元数据来匹配字体族。因此，在pubspec.yml中定义family: Kufyan并不是必需的。 注意：OTF现在已经得到官方支持，请参见支持的字体类型。
7
我使用的是Flutter v1.16.2版本，OTF字体可以完全正常工作。 - Dmytro Rostopira
关于.ttc字体怎么样？它似乎不能在我的电脑上使用。 - Saw Thinkar Nay Htoo
1
这可能会对你有所帮助：https://dev59.com/H2Up5IYBdhLWcg3wLlRV - Kiran Maniya
1
我正在使用Flutter 2.2.3，通常的字体可用，但您无法“打开”高级OTF功能。 - Darkade
6

刚刚测试了Flutter 1.20，似乎OTF字体按预期工作。我似乎在文档中找不到Flutter支持哪种类型的字体。

4
Flutter引擎根据字体本身的元数据匹配字体系列中的字体。
(We should remove the style descriptors in pubspec.yaml now that they are obsolete).

在pubspec.yaml中将这些字体声明为不同的系列将解决此问题。
可以看到示例here，你已经完成了。
但otf可能不受支持。这可能是由于Google字体造成的。
如果仍然无法正常工作，则可以使用一个技巧，即通过第三方（例如convertio等）将otf转换为ttf。
然后您可以像普通字体一样使用它。
导入字体文件。
在pubspec中声明字体。
设置字体为默认值。
在特定小部件中使用字体。
2
Flutter引擎根据字体本身的元数据匹配字体系列内的字体，而不是pubspec.yaml清单中声明的样式描述符。(现在应该删除pubspec.yaml中已经过时的样式描述符)。
Edmondsans常规、中等和粗体字体包含元数据，声明它们的权重分别为400、410和420。然而，Flutter文本子系统仅支持表示100的偶数倍的字重桶(https://api.flutter.dev/flutter/dart-ui/FontWeight-class.html)。因此，这三种字体都被映射到FontWeight.w400，并且字体样式匹配器无法根据字重选择这些字体。
在pubspec.yaml中将这些字体声明为不同的系列可以解决这个问题。
1
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接