在 Flutter 包中使用自定义图标字体会显示问号而不是自定义图标

Question

我有一个由许多不同的 Dart 和 Flutter 包组成的应用程序。事实证明这很有用，因为我能够将字体、颜色和小部件等内容移动到一个独立的样式指南包中，然后我们可以在所有内容中使用它我们的其他应用程序。

\n

在包中使用自定义字体在Flutter 中的工作方式略有不同，因为我们需要将assets目录添加为子目录lib而不是同级目录：

\n

\n

\xe2\x80\xa6 然后像这样注册这些资产pubspec.yaml：

\n

assets:\n - packages/receipt_widget/assets/fonts/my_font.ttf\n // other asset declarations\n\n

\n

对于自定义字体和图标（png、jpg 等）来说，这完全可以正常工作。我的问题是，同样的方法不适用于自定义图标字体。

\n

脚步：

\n

\n
• 使用IcoMoon或Flutter Icon生成自定义图标字体
\n
• 将生成的字体放入assets/fonts如上所示的目录中
\n
• 将生成的dart文件放入lib文件夹中
\n
• 在代码中引用自定义图标并将其放入Icon小部件中，如下所示：
\n

\n

Icon(MyFontIcon.ic_heart);\n

\n

为了安全起见，我然后flutter clean在部署干净的版本之前从设备/模拟器运行并卸载应用程序。\n然后我留下一个问号而不是引用的图标。

\n

注意。当直接在 Flutter 应用程序中而不是在包中使用时，相同的图标可以正常工作。

\n

Answer 1

要使用自定义包中的 Flutter Icon 字体，您可以按照以下步骤操作：（我已经重复了您的一些步骤，供其他发现此问题的人使用）

创建颤振图标字体

您可以使用 flutter 图标https://www.fluttericon.com

将文件放入你的包中

确保将.ttf文件复制到文件夹中/lib。不仅仅是资产，就像您在根项目中所做的那样。

示例路径：

/packages/my_awesome_fontpackage/lib/assets/MyIconFont.ttf

（参见https://zubairehman.medium.com/how-to-use-custom-fonts-images-in-flutter-package-c2d9d4bfd47a）

将字体添加到您的项目中

现在打开包的pubspec.yaml文件并将字体添加为带有包路径的资源：

flutter:
  fonts:
  - family:  MyIconFont
    fonts:
      - asset: packages/my_awesome_fontpackage/assets/MyIconFont.ttf

（您可能必须重新启动应用程序并完全捆绑才能正确加载字体，并且可能flutter clean需要运行才能确定）

现在将包声明添加到 font dart 文件中

进入该my_icon_font.dart文件并将其中的常量更改_kFontPkg为您的包名称。

class MyIconFont {
  MyIconFont._();

  static const _kFontFam = 'MyIconFont';
  static const String? _kFontPkg = 'my_awesome_fontpackage';

  static const IconData bell = ...
  ....
}