Flutter Dart: can't load SVG assets: Unable to load asset iconPath

Question

I am trying to use the flutter_svg package to load some .svg icon.

class _MyHomePageState extends State<MyHomePage> {
  final String iconPath = "assets/icons/adept.svg";
  ...
}

I added the assets/ folder containing the icons/ folder to the pubspec.yaml file:

  assets:
    - assets/

And when I try to load the icon inside my body:

      body: Center(
        child: Container(
          child: LimitedBox(
            child: SvgPicture.asset('iconPath', color: Colors.black, width: 100, height: 100,),
            maxHeight: 100,
            maxWidth: 100,
          )
        )
      ),

I get this StackTrace, Unable to load asset: assetName,

I/flutter (10154): ══╡ EXCEPTION CAUGHT BY SVG ╞═══════════════════════════════════════════════════════════════════════
I/flutter (10154): The following assertion was thrown resolving a single-frame picture stream:
I/flutter (10154): Unable to load asset: iconPath
I/flutter (10154): 
I/flutter (10154): When the exception was thrown, this was the stack:
I/flutter (10154): #0      PlatformAssetBundle.load (package:flutter/src/services/asset_bundle.dart:223:7)
...
I/flutter (10154): Picture provider: ExactAssetPicture(name: "iconPath", bundle: null, colorFilter: null)
I/flutter (10154): Picture key: AssetBundlePictureKey(bundle: PlatformAssetBundle#153a9(), name: "iconPath",
I/flutter (10154):   colorFilter: null)
I/flutter (10154): ════════════════════════════════════════════════════════════════════════════════════════════════════

Kindly explain to me what am I missing?

Solution

Did you change like below code?

assets:
    - assets/
    - assets/icons/

      body: Center(
        child: Container(
          child: LimitedBox(
            child: SvgPicture.asset(iconPath, color: Colors.black, width: 100, height: 100,),
            maxHeight: 100,
            maxWidth: 100,
          )
        )
      ),

Comments

[Andrej]

Try using SvgPicture.asset('assets/icons/adept.svg').

[Admin]

@Andrej thank you for pointing out an error that I didn't notice, as you can see in the answer bellow, I have to include - assets/icons/ in the pubspec.yaml file, I was under the impression that all I had to do is to add the parent folder and all the subsequent folders will be automatically included, which was not the case, odd.

[Andrej]

Does it work now?

[Admin]

@Andrej yes, thank you.

[Admin]

Problem solved by adding - assets/icons/ but I was under the impression that if I include a folder as an asset in pubspec.yaml, all child folders will be automatically included, which is not the cas as demonstrated in this thread. Could you explain why?

[KuKu]

Please check official site comment 'flutter.dev/docs/development/ui/assets-and-images'.

[KuKu]

Only files located directly in the directory are included unless there are files with the same name inside a subdirectory (see Asset Variants). To add files located in subdirectories, create an entry per directory.