从 Firebase 获取数据时如何显示加载屏幕

Posted 2023-02-23

【中文标题】从 Firebase 获取数据时如何显示加载屏幕

【英文标题】：How to show a loading screen while we fetch data from firebase

【发布时间】：2022-01-15 16:03:35

【问题描述】：

在这里，我想在我们从 firebase 获取数据时显示 spinkit 或任何一些文本。 现在我在登录时没有得到 spinkit。所以请帮助我。

TextButton(
                      onPressed: () 
                        FutureBuilder(
                          future: loadFirebase(),
                          builder: (context,datasnap)
                            if(datasnap.connectionState==ConnectionState.waiting)
                              return SpinKitRotatingCircle(
                                duration: Duration(seconds: 1),
                                size: 50,
                              );
                            
                            else if(datasnap.connectionState==ConnectionState.active)
                              return SpinKitRotatingCircle(
                                duration: Duration(seconds: 2),
                                size: 50,
                              );
                            
                            else if(datasnap.connectionState==ConnectionState.none)
                              return Text('nulll');
                            
                            else return Text('else null');

                          
                        );
                      ,
                      child: Text(
                        'Sign-in',
                        style: TextStyle(
                          fontSize: 17,
                          color: Colors.white,
                        ),
                      ),
                  ),

下面是我在 onpressed 中使用的 loadfirebase 函数。

 Future<void> loadFirebase() async 
    FirebaseAuth.instance.signInWithEmailAndPassword(email: User_email_id.text, password: user_Passowrd.text)
        .then((value) => 
      Navigator.push(
          context,
          MaterialPageRoute(builder: (context)=>Page_First())
      )
    ).catchError((e)
      Fluttertoast.showToast(msg: e!.message);
    );
  

【问题讨论】：

看看这个***.com/questions/61664222/…

【参考方案1】：

您需要在 loadFirebase 函数中等待 signInWithEmailAndPassword 调用：

Future<void> loadFirebase() async 
  try 
    await FirebaseAuth.instance.signInWithEmailAndPassword(email: User_email_id.text, password: user_Passowrd.text);
    Navigator.push(context, MaterialPageRoute(builder: (context)=>Page_First());
   catch (error, trace)
    Fluttertoast.showToast(msg: e!.message);
  

【讨论】：

我尝试使用 await ，但这也不起作用@Stefan

究竟是什么不工作？

我没有得到加载屏幕，在等待 firebase 签名时，我在同一个屏幕上，然后在成功登录后出现我正在导航的下一个屏幕