Sitemap

A different way to use assets in Flutter

Jun 25, 2022

In this blog, I’ll show you a new way to use assets in Flutter.

How this new new approach look like?

Press enter or click to view image in full size

How to implement this?

Add the following dependencies first in dev_dependencies in pubspec.yaml.

dev_dependencies:
build_runner: ^2.1.11
flutter_gen_runner: ^4.3.0

Add your required assets in assets folder and mention it in pubspec.yaml.

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

This is how I added

I’ve added the following images in assets folder

After that run the following command in command prompt/Terminal.

flutter pub run build_runner build

This command generates a new file in lib folder i.e. lib/gen/assets.gen.dart

Now you can use the assets in your project as below

Assets.google.image() //=> Image.assets("assets/google.png")

To continuously watch the changes to assets folder, type the following command.

flutter pub run build_runner watch --delete-conflicting-outputs

— delete-conflicting-outputs flag lets you solve any issues regarding outputs of previous build.

--

--