如何在 Flutter 中创建加载屏幕？

如何解决如何在 Flutter 中创建加载屏幕？

我在我的应用中添加了 firestore 和使用谷歌自动登录。所以现在当用户启动应用程序时，他会看到几秒钟的灰色屏幕。如何创建加载屏幕，以便用户看到发生的事情而不是灰屏？

我启动应用程序时的代码如下所示：

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  FireBaseHandler handler = new FireBaseHandler();
  GoogleSignIn _googleSignIn = GoogleSignIn();
  print("Debug 1");
  _googleSignIn.isSignedIn().then((logged) async => {
        print("Debug 2" + logged.toString()),if (!logged)
          {
            print("Debug 3"),runApp(MyApp(screen: WelcomeScreen())),}
        else
          {
            print("Debug 4"),_googleSignIn.signInSilently().then((user) => {
                  print(user.toString()),handler
                      .is_user_registered(user.email.toString())
                      .then((value) => {
                            print("Debug 5"),print(value.docs[0].data().toString()),UserManager.userdata = value.docs[0].data(),runApp(MyApp(screen: NavBar())),})
                })
          }
      });
}

解决方法

您应该将异步调用移至 MyApp 小部件并使用 FutureBuilder 等待结果。

然后当数据为空时显示加载指示器。

查看此代码更新：

import 'package:flutter/material.dart';
import 'package:google_sign_in/google_sign_in.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  MyApp({Key key}) : super(key: key);

  FireBaseHandler handler = new FireBaseHandler();
  GoogleSignIn _googleSignIn = GoogleSignIn();

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: FutureBuilder<bool>(
        future: _googleSignIn.isSignedIn(),builder: (BuildContext context,AsyncSnapshot<bool> signInSnapshot) {
          if (signInSnapshot.data == null) {
            return Scaffold(
              body: Center(
                child: CircularProgressIndicator(),),);
          } else {
            bool isLoggedIn = signInSnapshot.data;

            if (!isLoggedIn) {
              return WelcomeScreen();
            } else {
              return FutureBuilder<GoogleSignInAccount>(
                  future: _googleSignIn.signInSilently(),builder: (_,AsyncSnapshot<GoogleSignInAccount>
                          signInSilentlySnapshot) {
                    if (signInSilentlySnapshot.data == null) {
                      return Scaffold(
                        body: Center(
                          child: CircularProgressIndicator(),);
                    } else {
                      GoogleSignInAccount user = signInSilentlySnapshot.data;
                      return FutureBuilder(
                          future:
                              handler.is_user_registered(user.email.toString()),isUserRegisteredSnapshot) {
                            if (isUserRegisteredSnapshot.data == null) {
                              return Scaffold(
                                body: Center(
                                  child: CircularProgressIndicator(),);
                            } else {
                              var value = isUserRegisteredSnapshot.data;
                              UserManager.userdata = value.docs[0].data();
                              return NavBar();
                            }
                          });
                    }
                  });
            }
          }
        },);
  }
}