Flutter ListView 删除和撤销操作

4 dart flutter

我如何实现ListView具有Dismissible小部件的a ,并且当我滑动时,我可以删除该项目,但是如何在点击 say aSnackBar的操作时将其恢复。谁能给我举个例子?这是我在State课堂上的情况。

List<String> _list = List.generate(10, (index) => "${index}");

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(title: Text("App")),
    body: ListView.builder(
      itemCount: _list.length,
      itemBuilder: (context, index) {
        return Dismissible(
          key: Key(_list[index]),
          background: Container(color: Colors.red,),
          child: ListTile(title: Text(_list[index])),
          onDismissed: (direction) => setState(() => _list.removeAt(index))
        );
      },
    )
  );
} 
Run Code Online (Sandbox Code Playgroud)

Cop*_*oad 12

所有你需要的是

_list.insert(index, yourDeletedItem);
Run Code Online (Sandbox Code Playgroud)

这是SnackBar添加的完整代码。

GlobalKey<ScaffoldState> _key = GlobalKey(); // added
List<String> _list = List.generate(10, (index) => "${index}");

@override
Widget build(BuildContext context) {
  return Scaffold(
    key: _key, // added
    appBar: AppBar(title: Text("App")),
    body: ListView.builder(
      itemCount: _list.length,
      itemBuilder: (context, index) {
        return Dismissible(
          key: Key(_list[index]),
          child: ListTile(title: Text(_list[index])),
          background: Container(color: Colors.red),
          onDismissed: (direction) {
            setState(() {
              // added this block 
              String deletedItem = _list.removeAt(index);
              _key.currentState
               ..removeCurrentSnackBar()
               ..showSnackBar(
                SnackBar(
                  content: Text("Deleted \"${deletedItem}\""),
                  action: SnackBarAction(
                    label: "UNDO",
                    onPressed: () => setState(() => _list.insert(index, deletedItem),) // this is what you needed
                  ),
                ),
              );
            });
          },
        );
      },
    ),
  );
}
Run Code Online (Sandbox Code Playgroud)

截屏

在此处输入图片说明