skip to Main Content

I am getting the "asset not found" error when I try to run my app. Here are my files.

main.dart:

import 'package:flutter/material.dart';

void main() {
  runApp(MaterialApp(
    home: Scaffold(
      appBar: AppBar(
        title: Text('I Am Rich'),
        centerTitle: true,
        backgroundColor: Colors.blueGrey[900],
      ),
      // You can also
      body: Center(child: Image(image: AssetImage("images/poor.png"))),
      backgroundColor: Colors.blueGrey,
    ),
    debugShowCheckedModeBanner: false,
  ));
}

pubspec.yaml:

name: i_am_poor
description: A new Flutter project.
version: 1.0.0+1


environment:
  sdk: '>=2.19.6 <3.0.0'

dependencies:
  flutter:
    sdk: flutter
  cupertino_icons: ^1.0.2

dev_dependencies:
  flutter_test:
    sdk: flutter
  flutter_lints: ^2.0.0
flutter:
  assets:
    - images/poor.png

File structure:
file structure

What I tried: I tried looking at docs and copy pasting directly from there while adapting it to my situation.

6

Answers


  1. You need to also include the assets directory

    try this AssetImage("assets/images/poor.png")

    Login or Signup to reply.
  2. Move your dashes back to align with the word assets like this:

    flutter:
      assets:
      - images/
    

    Also you don’t need to specify poor.png in the pubspec.yaml, just the folder name will access all the images inside it.

    Your structure is not inside lib. But for others: double check that your assets folder is not inside lib, because if it is you need to add it:

    flutter:
      assets:
      - lib/images/
    
    Login or Signup to reply.
  3. Use it this way instead.

    import 'package:flutter/material.dart';
    
    void main() {
      runApp(MaterialApp(
        home: Scaffold(
          appBar: AppBar(
            title: Text('I Am Rich'),
            centerTitle: true,
            backgroundColor: Colors.blueGrey[900],
          ),
          // You can also
          body: Center(
          child: Image.Asset("images/poor.png"),
          backgroundColor: Colors.blueGrey,
        ),
        debugShowCheckedModeBanner: false,
      ));
    }
    
    Login or Signup to reply.
  4. The problem may be in your pubspec.yaml file.
    Remove unnecessary spaces and do it again as

    pubspec.yaml

    flutter:
      assets:
        - images/poor.png
    
    Login or Signup to reply.
  5. You should add the images directory to assets by following the below. Ensure to maintain the right pattern and formatting, as unnecessary spaces could be an issue. Ensure to do a pub get after updating the pubspec.yaml

    # The following section is specific to Flutter packages.
    flutter:
      assets:
        - images/
    

    Note that we do not have to specify poor.png as adding the directory is enough.

    Login or Signup to reply.
  6. Step 1: click Copy Relative Path of the image.
    Step 2: Copy that path inside the code like

    AssetImage("<your_image_path>") or Image.asset("<your_image_path>")

    Another way: create assets folder outside the lib folder and set that path of the assets folder inside pubspec.yaml.
    like this pubspec.yaml screenshot. then follow the above steps.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search