Шрифт из пакета (библиотеки) не отображается в приложении Flutter?

Question

У меня есть пакет под названием Handwriter. Он пишет текст собственным шрифтом. У меня есть.ttf, сохраненный в lib/third_party/. В его pubspec.yaml я добавляю шрифт:

flutter:
    uses-material-design: true
    fonts:
     - family: FancyHandwriting
       fonts:
        - asset: lib/third_party/FancyHandwriting-Regular.ttf

Мое приложение импортирует этот пакет. В его pubspec.yaml я добавляю Handwriter как зависимость:

dependencies:
  flutter:
    sdk: flutter
  handwriter:
    path: ../handwriter
  model:
    path: ../model

Однако шрифт вообще не отображается, когда я использую его в своем приложении. Зачем?

final defaultStyle = TextStyle(
      fontFamily: 'FancyHandwriting',
      fontSize: 130);

Answer 1

Без повторного добавления шрифтов в потребительское приложение пакета вы можете использовать:

final defaultStyle = TextStyle(
  fontFamily: 'FancyHandwriting',
  package: 'handwriter',
  fontSize: 130,
);

Что также эквивалентно выполнению:

final defaultStyle = TextStyle(
  fontFamily: 'packages/handwriter/FancyHandwriting',
  fontSize: 130,
);

Answer 2

Чтобы использовать шрифт Flutter Icon из настраиваемого пакета, вы можете выполнить следующие действия:

создать шрифт значка флаттера

Вы можете использовать для этого значок флаттера 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

(возможно, вам придется перезапустить приложение и полностью объединить его, чтобы шрифт загрузился правильно)

Теперь добавьте объявление пакета в файл шрифта dart

Войдите в my_icon_font.dart файл и измените константу _kFontPkg там к имени вашего пакета.

      
class MyIconFont {
  MyIconFont._();

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

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

Answer 3

Согласно этому: https://flutter.dev/docs/cookbook/design/package-fonts вы должны объявить шрифт пакета в pubspec.yaml вашего приложения:

Объявите ресурсы шрифтов. Теперь, когда вы импортировали пакет, сообщите Flutter, где найти шрифты из awesome_package.

Чтобы объявить пакетные шрифты, добавьте к пути к шрифту префикс packages / awesome_package. Это говорит Flutter искать шрифт в папке lib пакета.

Т.е.:

dependencies:
  flutter:
    sdk: flutter
  handwriter:
    path: ../handwriter
  model:
    path: ../model

flutter:
    uses-material-design: true
    fonts:
     - family: FancyHandwriting
       fonts:
        - asset: packages/handwriter/third_party/FancyHandwriting-Regular.ttf

Обратите внимание, что вы объявляете актив из пакета - вам не нужно делать его копию в своем приложении. lib.

Причина этого в том, что не все шрифты из каждого пакета могут быть использованы, поэтому это сокращает размер вашего окончательного приложения.

Answer 4

Не забывайте, что вы также должны импортировать / скопировать шрифты в каталог ресурсов шрифтов. В вашем случае убедитесь, что вы поместили их вlib/third_party/. (См. Шаг 1 - https://flutter.dev/docs/cookbook/design/fonts).