I have a series of images stashed in Assets. I want to be able to select which image is displayed, dynamically. How would you do this?
Longer-version...
I have 100 items in an SQLite DB, each item has a name, some description, and the filename of an associated image (~100px) that is in my project's Assets. I am able to query the SQLite DB and have fields like Name and Description be populated dynamically. My struggle is with getting the image to display dynamically.
How to dynamically select an image that is in Assets?
I simplified everything to bare-bones:
a Read Query that only returns two columns: description & imageFilename.
(For imageFilename I tried type String, and type Image Path, doesn't seem to matter)a new, blank page, added a single parent, with child widgets of text and image
On the parent I have my SQLite query
(I've tried Column, Row, and ListView as the parents, makes no odds)
On the text widget..
content shows imageFilename (when I tried the SQL Query output
Type
asString
), and then later showed Cues (when I was trying imageFilename asType: Image
).I can see the content, and the content is as I would expect, so I believe the SQL Query is setup correct and the backend query is setup correctly.
On the image widget...
I first set
Image Type: Asset
, and used the manual picker to find the image file associated with my example case. That displayed fine, so I know the image asset is physically there, and able to be displayed on this screen.I then switched to
Image Type: Network
in order to allow me to pass a variable to the location. When I try that, I don't get an error in the FF builder, but where the Image Widget should be, I instead see:Invalid Argument(s): No host specified in URI file:///assets/images/<my-filename-would-go-here.jpg>
As well as assets/images, I also tried just the filename, and the full actual path on the device.../data/data/com.xxxx.yyy/code_cache/zzz/build/flutter_assets/assets/images/
but still no joy.
So, I clearly need help. Ideas? Am I missing something obvious? Or am I going to need to write a custom image widget to display a file-from-device dynamically?