dart flutter -如何添加一个加载文本时，项目正在从数据库中删除

xn1cxnb4 于 2022-12-15 发布在 Flutter

关注(0)|答案(2)|浏览(212)

我正在使用ListView构建器，它从数据库中获取数据并将其显示在列表中。

Future<dynamic> data = Database.getItems();

child: FutureBuilder(
              future: data,
              builder: (BuildContext context, AsyncSnapshot snapshot) {
                if (snapshot.data == null) {
                  return Center(
                      child: LoadingAnimationWidget.staggeredDotsWave(
                          color: Colors.blueAccent, size: 50));
                } else {
                  return ListView.builder(
                    itemCount: snapshot.data.length,
                    itemBuilder: (BuildContext context, int index) {
                      print(snapshot.data[index]);
                      return ItemWidget(
                          onEditTap: () {
                            setState(() {
                              Navigator.push(
                                context,
                                MaterialPageRoute(
                                    builder: (context) => ItemEditPage(
                                          user: user,
                              
                                        )),
                              );
                              data = Database.getItems();
                            });
                          },
                          onDeleteTap: () async {
                            await Database.delete(snapshot.data[index]["_id"]);
                            setState(() {
                              data = Database.getItems();
                            });
                          },
                  
                    },
                  );

有没有可能当我按下一个项目的删除按钮时，它会等待该项目（显示任何加载文本或任何内容），然后刷新列表视图？

onDeleteTap: () async {
             await Database.delete(snapshot.data[index]["_id"]);
 
            // ANY KIND OF LOADING TEXT HERE, A PAUSE THEN CALL setState
             setState(() {
                data = Database.getItems();
             });
          },

看起来像这个

dart

来源：https://stackoverflow.com/questions/74809573/flutter-how-to-add-a-loading-text-when-the-item-is-being-deleted-from-database

2条答案

按热度按时间

fkaflof61#

首先在主类中定义新变量，如下所示：

int _selectedItem = -1;

然后将此变量添加到ItemWidget的onDeleteTap中，如下所示：

onDeleteTap: () async {
    
    setState(() {
       _selectedItem = index; // add this
    }); 

    await Database.delete(snapshot.data[index]["_id"]);
    await Future.delayed(Duration(seconds: 3));

    setState(() {
       _selectedItem = -1; // add this
       data = Database.getItems();
    });
},

然后将列表视图更改为：

itemBuilder: (BuildContext context, int index) {
    print(snapshot.data[index]);
    return Stack(
      children: [
        ItemWidget(
          ...
        ),
        _selectedItem == index
            ? Positioned(
                left: 0,
                right: 0,
                top: 0,
                bottom: 0,
                child: Center(
                    child: LoadingAnimationWidget.staggeredDotsWave(
                        color: Colors.blueAccent, size: 50)))
            : SizedBox()
      ],
    );
}

这将显示你点击的特定项目的加载。

赞(0）回复(0）举报 2022-12-15

j2datikz2#

你可以使用这个技巧：通过弹出加载对话框

/// create this function in your helper file
showLoaderDialogLoading(BuildContext context) {
  AlertDialog alert = AlertDialog(
    content: Row(
      children: [
        const CircularProgressIndicator(),
        Container(
            margin: const EdgeInsets.only(left: 7),
            child: const Text("Loading...")),
      ],
    ),
  );
  showDialog(
    barrierDismissible: false,
    context: context,
    builder: (BuildContext context) {
      return alert;
    },
  );
}

并使用它：

onDeleteTap: () async {
   showLoaderDialogLoading(context);
   await Database.delete(snapshot.data[index]["_id"]);

   setState(() {
     data = Database.getItems();
   });
   // when its done, close the dialog
  
   Navigator.pop(context);
  // loading dialog will be closed 

},

赞(0）回复(0）举报 2022-12-15

我来回答

dart flutter -如何添加一个加载文本时，项目正在从数据库中删除

2条答案

相关问题

热门标签

最新问答