Flutter Question posted in
The official Flutter documentation can be found here.

Flutter – Fluuter is unable to load my Asset, how do i fix it?

Error Image Load

Hi Guys,

currently i am doing my first Flutter Project with Android Studio.

And everything went good until i tried to load an image into my App, it never shows up on the Emulator.

I tried a few steps to solve the problem.

  1. i checked my pubspec.yami folder and it seems to be ok.

assets:

  • lib/images/japanflag.png

  1. I did run "Flutter Clean"

  2. i did run "flutter pub outdated"

And after all that it is stil not working and i made sure that my images folder is in the right place.

import 'package:flutter/material.dart';

    class StartPage extends StatelessWidget {
      const StartPage({super.key});

      @override
      Widget build(BuildContext context) {
      return Scaffold(
        backgroundColor: Color.fromARGB(255,215,165,187),
        body: SafeArea(
          child: Column(

            crossAxisAlignment: CrossAxisAlignment.start,

            children: [
              Row(children: [Text("JAPAN JOURNEY",
                              style: TextStyle(
                                fontSize: 38,
                                fontWeight: FontWeight.bold,
                                color: Colors.white,
                              ),
              ),
               Image.asset("lib/images/japanflag.png", height: 30,)

              ],
              )

I hope that someone can help me tho :D, thanks.

Tags:

3

Answers


  1. 0

    I would follow the flutter way and create an assets folder for all the assets.

    But in your case you should add lib and lib/images also to your assets.

    From the docs:

    Only files located directly in the directory are included.
    Resolution-aware asset image variants are the only exception. To add
    files located in subdirectories, create an entry per directory.

    https://docs.flutter.dev/ui/assets/assets-and-images

    Login or Signup to reply.
  2. 0

    You should specify your assets in the pubspec.yaml file for that scenario.

      assets:
     - lib/images/
    Login or Signup to reply.
  3. 0

    Solution 1:
    If you added the image and you didn’t stop the app,
    try to stop the app and build it again, this can solve the issue.
    If it does not work, try solution 2.

    Solution 2

    Create an assets folder inside your root project.
    inside it create an images folder then put your japanflag.png image.

    Inside your pubspec.yaml make sure to have :

    assets:
    - assets/images/

    then do flutter pub get in your terminal.

    then display your image like:

    Image.asset("assets/images/japanflag.png", height: 30,)

    Stop and Build the app, the image should show up.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search