Assets

If your app have assets, and you want to display them in Widgetbook, you need to set the package parameter in the Image.asset constructor. But doing so will make the image not display in your app. To fix this, you need to convert your assets folder into a package as follows.

1. Add a pubspec.yaml file in the root of your assets folder

   No dependencies are needed
   Copy

   name: assets
   description: >
     Holds the assets for the app. The assets are included in a
     separate package, to be able to share it with Widgetbook app.
   
   version: 0.0.0
   publish_to: none
   
   environment:
   sdk: ">=3.1.0 <4.0.0"
   
   flutter:
     assets:
       - .
   

2. Add the assets package to your app and widgetbook pubspec.yaml files

   pubspec.yaml

   Copy

   dependencies:
     assets:
       path: assets
   

   widgetbook/pubspec.yaml

   Copy

   dependencies:
     assets:
       path: ../assets
   

3. Use the package parameter in the Image.asset constructor whenever you want to display an image asset in your app

   Copy

   Image.asset(
     'assets/image.png',
     package: 'assets',
   )