flutter - Flutter-如何将进度条赋予按钮的on:Pressed()函数？

Question

我正在通过异步功能从firebase数据库中获取数据，该功能会在按下按钮时触发。数据获取完成后，它将移至下一页(下一个 Activity )。因此，在整个过程中，按下异步功能需要花费时间来执行整个代码。因此，我想显示一个进度条，直到执行完整的代码。谁能建议我如何在新 Activity 开始之前显示进度栏。
这是我的代码:

FlatButton(

              child: Text("Next",style: TextStyle(
              color: Colors.white,
                  fontWeight: FontWeight.bold,
                  fontFamily: "Calibri",
                  fontSize: 20)),
              color: Colors.blue,
              onPressed:() {
                elist.then((value)
             async {



                 for (var item in value) {
                   alleyes.add(new facial(criminal_id: item.criminal_id,
                       part_size: item.part_size,
                       link: item.link));
                   Uint8List bytes = (await NetworkAssetBundle(Uri.parse(item.link)).load(item.link)).buffer.asUint8List();
                   eye_str.add(String.fromCharCodes(bytes));




                 }
                 Navigator.push(context,
                     MaterialPageRoute(builder: (context)=>App()));
             }
                );
              },
            )

Answer 1

您可以从创建一个名为loading的变量开始。

bool loading = false;

此后，您可以在点击按钮时将loading设置为true，并在加载variable为true时显示进度指示器

loading
      ? Center(child: CircularProgressIndicator())
      : FlatButton(
    child: Text("Next",style: TextStyle(
        color: Colors.white,
        fontWeight: FontWeight.bold,
        fontFamily: "Calibri",
        fontSize: 20)),
    color: Colors.blue,
    onPressed:() {
      setState((){
        loading = true;
      }); // set loading to true here
      elist.then((value)
      async {
        for (var item in value) {
          alleyes.add(new facial(criminal_id: item.criminal_id,
              part_size: item.part_size,
              link: item.link));
          Uint8List bytes = (await NetworkAssetBundle(Uri.parse(item.link)).load(item.link)).buffer.asUint8List();
          eye_str.add(String.fromCharCodes(bytes));
        }

        setState((){
          loading = false;
        }); // set it to false after your operation is done
        Navigator.push(context,
            MaterialPageRoute(builder: (context)=>App()));
      }
      );
    },
  )