Reputation: 898
I am new to flutter. I am getting image from backend and displaying those images on the screen using Hero and FadeInImage. I ave added the hyperlinks in the images and generating the list of images after hitting the API.
child: Hero(
tag: tag,
child: FadeInImage(
width: 130.0,
height: 186.0,
placeholder: AssetImage('assets/images/splash1.png'),
fit: BoxFit.cover,
// onTap: _launchUrl(),
image: NetworkImage(
(merchant.logo)),
// fit: BoxFit.cover,
),
),
),
),
when I run my app, the images are not loaded; the screen is empty. But when I hot reload it shows.
...List.generate(
merchantsList.length,
(index) {
print(merchantsList.length);
print(index);
return MerchantCard(merchant: merchantsList[index]);
Upvotes: 0
Views: 924
Reputation: 898
The problem was actually widget was built before values are populated in the list. I used setState on my listPopulated function and it worked perfectly ok.
Upvotes: 0
Reputation: 332
You can use placeholder image and also you can add Future Builder concept and Please once check the Future Concept.
@override
Widget build(BuildContext context) {
return new FutureBuilder(
future: _loadImage(),
builder: (BuildContext context, AsyncSnapshot<Image> image) {
if (image.hasData) {
return image.data; // image is ready
} else {
return new Container(); // placeholder
}
},
);
}
Upvotes: 0