Muhammad Talha
Muhammad Talha

Reputation: 187

Flutter custom package not loading fonts and images | Flutter

I am creating a package. I've added two directories, fonts and images, consecutive to the lib directory. I've also added the required code in pubspec.yaml file to use those fonts and images in the package. I created an example directory in the package directory in order to test the package I'm creating, but the test app won't pick the fonts and images from the package and gives the exception:

FlutterError (Unable to load asset: images/abc.png)

Screenshot of directories [1]: https://i.sstatic.net/po8oT.png

pubspec.yaml:

name: customtestingpackage
description: A new Flutter package project.
version: 0.0.1
author:
homepage:

environment:
  sdk: ">=2.7.0 <3.0.0"
  flutter: ">=1.17.0"

dependencies:
  flutter:
    sdk: flutter
  cupertino_icons:
  
dev_dependencies:
  flutter_test:
    sdk: flutter

flutter:
  uses-material-design: true
  assets:
    - images/

  fonts:
    - family: Comfortaa
      fonts:
        - asset: fonts/comfortaa/Comfortaa-Regular.ttf
          weight: 400
        - asset: fonts/comfortaa/Comfortaa-Medium.ttf
          weight: 500
    - family: Poppins
      fonts:
        - asset: fonts/poppins/Poppins-Regular.ttf
          weight: 400
        - asset: fonts/poppins/Poppins-Medium.ttf
          weight: 500

main.dart: implementation of fonts

style: TextStyle(
    fontSize: 24,
    fontWeight: FontWeight.w500,
    color: Colors.white,
    fontFamily: 'Poppins',
    letterSpacing: 1.25,
),

Upvotes: 5

Views: 1615

Answers (1)

tmaihoff
tmaihoff

Reputation: 3550

From https://flutter.dev/docs/development/ui/assets-and-images#from-packages:

To load an image from a package dependency, the package argument must be provided to AssetImage.

Assets used by the package itself should also be fetched using the package argument as above.

So in your case you should be able to load an image by something like this:

  Image.asset(
    'images/image_a.png',
    package: 'customtestingpackage',
  ),

The same seems to apply to fonts as well. From: https://api.flutter.dev/flutter/painting/TextStyle-class.html

To use a font family defined in a package, the package argument must be provided

If the package internally uses the font it defines, it should still specify the package argument when creating the text style as in the example above.

Upvotes: 6

Related Questions