在加载页面之前显示加载微调器 (Flutter)

Question

I have a page that takes to long to load ( I don't know why, maybe a question for another thread). So I want to let the user know that the page is loading. But for some reason, I'm only able to make the spinner show indefinitely or not show at all. The page takes 10 seconds to load in debug mode.

 onPressed: () async {
                        showDialog(
                            context: context,
                            builder: (context) {
                              return Center(
                                child: CircularProgressIndicator(
                                    color: Colors.white),
                              );
                            });

                        await Navigator.push(context,
                            MaterialPageRoute(builder: (context) {
                          return FormIncident();
                        }));

                        Navigator.of(context).pop();
                      }

I also tried using showModal instead Navigator, and I still face the same problem

Answer 1

You are pushing new page before data loading and your spinner doesn't showing. In your case, you need to add loader (spinner) to page where are you loading data. Without additional information I can't make example of your case, but if you are using Future , your FormIncident can be similar like this:

Widget build(BuildContext context) {
  return FutureBuilder<TypeOfYourFuture>(
    future: yourFuture,
    builder: (context, snapshot) {
      // If your data is not loading show loader
      if (!snapshot.hasData) {
        return LoaderWidget();
      // If your data is not loading show loader
      } else if (snapshot.hasError) {
         return ErrorWidget();
      }
      // In other cases you have a valid data and you can shot content
      return ContentWidget();
    }
  );
}

Add more info and we will try to find solution that specific to you.