dart - Flutter ListView 删除和撤消操作

Question

如何实现ListView具有小部件的 a ，并且当我滑动时，我可以删除该项目，但是当点击 a的动作Dismissible时如何将其恢复。SnackBar谁能给我举个例子吗？这就是我在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))
        );
      },
    )
  );
} 

标签： dartflutter

Answer 1

你所需要的只是

_list.insert(index, yourDeletedItem);

这是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
                  ),
                ),
              );
            });
          },
        );
      },
    ),
  );
}

截屏