Flutter asset image wont display properly

2.2k Views Asked by At

I want to add an icon to a card widget so I used the ImageIcon widget as below

Card(
  color: colorPalette.cultured,
  child: Padding(
    padding: const EdgeInsets.all(20.0),
    child: Row(
      children: <Widget>[
        Text(label,style: TextStyle(fontWeight: FontWeight.w600,fontSize: 15.0,fontFamily: 'Poppins'),),
        Spacer(),
        ImageIcon(AssetImage('assets/icons/call.png'),),
      ],
    ),
  ),
);

The icon I want to display is,

call.png

but what is displayed is,

enter image description here

the assets in the pubspec.yaml are indented properly as well.

2

There are 2 best solutions below

0
On

Try below Code Hope its help to you . Just change your image on your need

you have add asset image in 2 Ways

  1. Image.assets() - Documentation here
  1. AssetImage()
      Row(
             children: [
               Image(
                  image: AssetImage('assets/images/shop.png'),
                  width: 150,
                  height: 150,
                ),
                Image.asset(
                  'assets/images/cycle.png',
                  width: 150,
                  height: 150,
                ),
             ],
           ),

Your Result Screen -> enter image description here

0
On

You can use either of these for using asset images
Image.asset('image')
or
Image(image: AssetImage('image')) for using asset images

For achieving it with icon

Container(
            width: 40,
            height: 40,
            decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(10),
                color: Colors.blue),
            child: Icon(
              Icons.call,
              color: Colors.white,
            ),
          )

enter image description here