How to check if screen is fully loaded?

Viewed 475

Problem: One of screen in my app has bunch of network images that are being fetched from an API. When user navigates to that screen some images load faster than others, hence users sees a screen that is not fully loaded.

Expected behaviour: I want to show a CircularProgressIndicator until all the network images are fully loaded.

P.S. Below code doesn't do what I wanted, as it executes the function while images are still loading.

void initState() {
    super.initState();
    WidgetsBinding.instance.addPostFrameCallback((_) => yourFunction(context));
}

Also I am using SvgPicture.network from flutter_svg package.

1 Answers
final Widget networkSvg = SvgPicture.network(
  'https://site-that-takes-a-while.com/image.svg',
  semanticsLabel: 'A shark?!',
  placeholderBuilder: (BuildContext context) => Container(
      padding: const EdgeInsets.all(30.0),
      child: const CircularProgressIndicator()),
);

Maybe this could help Flutter image preload

Related