时间戳

首页 > 解决方案 > 颤振：如何在登录前显示加载动画？

flutter - 颤振：如何在登录前显示加载动画？

问题描述

我正在使用颤振。输入我的id和密码后，我想log in animation在进入主页之前显示一个。我使用 adialog但我觉得我的代码非常生硬并且有潜在的错误。有更好的解决方案吗？

// this part is for the input content is legal
else {
        showDialog(
            context: context,
            barrierDismissible: false,
            builder: (BuildContext context) {
              return LoadingStyle.buildWidget();  // this is a simple loading animation
            });
        service.createSession(context, code, id).then((response) { // log in part
          if (response != null) {
            this.saveUser(response);   // something about saving user info
          } else {
            print('null respose');
          }
        }).catchError((e) {
          if (e is GrpcError && e.code == StatusCode.unauthenticated) {
            setState(() {
              this.errorMessage = "grpc network error";
            });
          }
        }).whenComplete(() {
          Navigator.of(context).pop();  // pop dialog here, is this right?
          MyRoutersl.goNewPage(context); // enter the new page
        });
      }

标签： flutterdart

解决方案

我建议使用FutureBuilder。还有一些默认的加载小部件，例如CircularProgressIndicator()可以在进行时使用。

因为登录是某种异步进程，你可以像下面这样使用 FutureBuilder：

FutureBuilder(
  future: service.createSession(...  // Use Async function to return the result
  builder: (context, snapshot) {
    if(snapshot.hasData && snapshot.connectionState == done ){

      // return widget after login successfully
      // result should equal to snapshot.data

    } else {

      // return CircularProgressIndicator();

    }
  }
)

如果你需要更多花哨的加载指示器，你可以查看这个包flutter_spinkit

推荐阅读