Loading image from assets doesn't work when string formatting

Question

I am trying to load images from the assets folder inside a listview item builder. The problem is that if I format the path string with the image name it won't load the image, otherwise, if I hard code the image name flutter does manage to load the image. I have declared the images correctly in pubspec.yaml, a proof to that is that the image loads when I hardcode its name in the image asset path. This is the error I am getting when trying to string format the image name to the image asset path. Also, with vscode debugger I can see that the path is formatted successfully and contains the correct path to the image.

Code:

  Widget itemItemBuilder(BuildContext context, int pos) {
    Item item= StaticObjects.items[pos];
    String imagePath = "assets/images/items/${item.image}.jpg";
    return Card(
      child: Row(
        children: <Widget>[
          Column(
            mainAxisAlignment: MainAxisAlignment.start,
            children: <Widget>[
              Image.asset(
                imagePath,
                scale: 5,
              ),
              Text(item.name)
            ],
          ),
          Column(
            mainAxisAlignment: MainAxisAlignment.start,
            children: <Widget>[
              Text(item.description),
              Text("${item.price}₪")
            ],
          )
        ],
      ),
    );

Error:

PlatformAssetBundle.load (d:\Programs\flutter\packages\flutter\lib\src\services\asset_bundle.dart:221)
<asynchronous gap> (Unknown Source:0)
AssetBundleImageProvider._loadAsync (d:\Programs\flutter\packages\flutter\lib\src\painting\image_provider.dart:484)
AssetBundleImageProvider.load (d:\Programs\flutter\packages\flutter\lib\src\painting\image_provider.dart:469)
ImageProvider.resolve.<anonymous closure>.<anonymous closure>.<anonymous closure> (d:\Programs\flutter\packages\flutter\lib\src\painting\image_provider.dart:327)
ImageCache.putIfAbsent (d:\Programs\flutter\packages\flutter\lib\src\painting\image_cache.dart:160)
ImageProvider.resolve.<anonymous closure>.<anonymous closure> (d:\Programs\flutter\packages\flutter\lib\src\painting\image_provider.dart:325)
SynchronousFuture.then (d:\Programs\flutter\packages\flutter\lib\src\foundation\synchronous_future.dart:38)
ImageProvider.resolve.<anonymous closure> (d:\Programs\flutter\packages\flutter\lib\src\painting\image_provider.dart:323)
_rootRun (dart:async/zone.dart:1126)
_rootRun (dart:async/zone.dart:0)
_CustomZone.run (dart:async/zone.dart:1023)
_CustomZone.runGuarded (dart:async/zone.dart:925)
ImageProvider.resolve (d:\Programs\flutter\packages\flutter\lib\src\painting\image_provider.dart:315)
_ImageState._resolveImage (d:\Programs\flutter\packages\flutter\lib\src\widgets\image.dart:1010)
_ImageState.didChangeDependencies (d:\Programs\flutter\packages\flutter\lib\src\widgets\image.dart:967)
StatefulElement._firstBuild (d:\Programs\flutter\packages\flutter\lib\src\widgets\framework.dart:4376)
ComponentElement.mount (d:\Programs\flutter\packages\flutter\lib\src\widgets\framework.dart:4201)
Element.inflateWidget (d:\Programs\flutter\packages\flutter\lib\src\widgets\framework.dart:3194)
MultiChildRenderObjectElement.mount (d:\Programs\flutter\packages\flutter\lib\src\widgets\framework.dart:5551)

Anyone knows why does this happen?

Can you print `imagePath` and show us the output ? Also can you add either your folder structure of your images or your pubspec file where you declared the image assets ? — Midhun MP, Apr 08 '20 at 09:28
As I have said the debugger shows me that the path is correct, pubspec is also correct because I said that when I hardcode the image name it does manage to load the image — Alon Yeager, Apr 08 '20 at 10:26
If hard-coded value is working then the issue is with your `imagePath` creation logic, if you can't share what it's look like and what it looks like in your hard-coded path, we can't do nothing other than speculating. — Midhun MP, Apr 08 '20 at 10:38
I did what you said, I printed the value of imagePath and indeed the .jpg is missing, do you know why? — Alon Yeager, Apr 08 '20 at 10:40
Btw, it is missing on all of the strings except the last one — Alon Yeager, Apr 08 '20 at 10:41
Probably your `item.image` contains some control characters. If your item object is created from json, check that json. — Midhun MP, Apr 08 '20 at 10:50
It is created from a text file that contains name,price,description,imagename name,price,description,imagename and so on. So I split the file at '\n' and then at ',' and build the objects — Alon Yeager, Apr 08 '20 at 10:57
It seems the issue is in that logic. There must me carriage return as well (probably), instead of `\n` try to split with `\r\n`. — Midhun MP, Apr 08 '20 at 11:00
Yea you are right, I uploaded the objects to firebase realtime database and it showed me the /r, do you know why it did that? — Alon Yeager, Apr 08 '20 at 11:05
If you have multiple lines in your text files, usually it ends with control character \r\n (Usually in windows os). You can read more abour CRLF here: https://en.wikipedia.org/wiki/Newline and here https://stackoverflow.com/questions/1552749/difference-between-cr-lf-lf-and-cr-line-break-types — Midhun MP, Apr 08 '20 at 11:18

score 0 · Accepted Answer · answered Apr 08 '20 at 11:32

0

The problem was that the image path variable had a control character /r

answered Apr 08 '20 at 11:32

Alon Yeager

820
2
8
17

Loading image from assets doesn't work when string formatting

1 Answers1