Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

SVG image does not appear, no errors

Tags:

flutter

I wanna show the svg in a container, the container colours does show as grey but the vector image does not appear. No errors are being produced. I have added the dependancy flutter_svg: ^0.22.0 and

Svg image: this is placed at /Assets/Vector.svg

<svg width="25" height="26" viewBox="0 0 25 26" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M4.9435 8.38116H0.706215C0.282486 8.38116 0 8.62978 0 9.00271V25.1629C0 25.5359 0.282486 25.7845 0.706215 25.7845H4.9435C5.36723 25.7845 5.64972 25.5359 5.64972 25.1629V9.00271C5.64972 8.62978 5.36723 8.38116 4.9435 8.38116Z" fill="white"/> </svg>

Code:

import 'package:flutter_svg/flutter_svg.dart';

Container(
          width: 200,
          height: 200,
          color: Colors.grey,
          child: SvgPicture.asset('/Assets/Vector.svg',
              color: Colors.black))

enter image description here

the small black line is the svg (appears in my browser) enter image description here

like image 852
Pretty_Girl Avatar asked Apr 06 '26 20:04

Pretty_Girl


2 Answers

What's the file path in your .yaml file? Is it /Assets/Vector.svg ? Because normally if you have only assets folder & no more sub-folder inside.

You should use the path 'Assets/Vector.svg' in your case.

Accessing Asset Folder

enter image description here

In this case, my path is

child: SvgPicture.asset('assets/login.svg')

like image 107
Phil D Avatar answered Apr 09 '26 15:04

Phil D


Try to build the app all over again. Flutter clean to be precise. Some packeges requires a full rebuild including flutter_svg.

like image 39
Ward Suleiman Avatar answered Apr 09 '26 16:04

Ward Suleiman



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!