Google’s Flutter is an open-source, cross-platform UI development kit. It’s becoming more popular these days because Flutter apps can operate on a variety of devices, regardless of platform. It’s primarily used to create apps for both Android and iOS, as a single Flutter-based app may run on both platforms. You can opt for a Flutter course to learn more about Flutter from the best Flutter training center in Kerala and build your Flutter app from scratch.

In this blog, we will learn how to add images to a Flutter app. When a Flutter app is completed, it has both assets (resources) and code. During runtime, assets are available and deployed.

What is an asset file?

An asset is a file that contains static data, configuration files, icons, and graphics in the format of JPEG, WebP, PNG, GIF, animated WebP/GIF, BMP, and WBMP.

Image.asset(‘Imge Name’)

How to add an Image?

1. Create a new folder in the project.

It should be close to the top of your Flutter project’s hierarchy. It can be called anything you choose, although assets are recommended. If you wish to include other assets in your app, such as fonts, create a new subfolder called images.

2. Copy your image to the images sub-folder now.

The path should be assets/images/yourImage

Check the above-mentioned supported image formats before adding images.

3. Update the pubspec.yaml file to include the assets folder.

a) To add images, use the code below:

assets:

– assets/images/yourFirstImage.jpg

– assets/image/yourSecondImage.jpg

b) Add this if you wish to include all the assets folder’s images:

flutter:

assets:

– assets/images/ yourFirstImage.jpg

4. Paste the image code into the file where you want the image to appear.

Image.asset(‘assets/images/yourFirstImage.jpg ‘)

5. At this point, you can save all the files and launch the app.

Before you can use Image.asset, you must first place your photos in an assets folder. The photos are then included in the installation package for the corresponding app using the above-mentioned commands. If you want to learn more about the Flutter framework, you can opt Flutter course in Kochi and build your future in mobile app development.