flutter listview实现滑动删除——方式一

很多时候列表需要做滑动删除功能，在flutter中官方也有相应的控件Dismissible可以方便做到这一功能，但有些时候这个控件和我们需要做的功能不太符合，所有我们就需要自己动手去实现了

方式：

1.使用Dismissible。

2.自己动手实现。

下面先介绍第一种方式Dismissible，首先看一下效果

那接下来看一下代码是怎么实现的：
''' 很多时候列表需要做滑动删除功能，在flutter中官方也有相应的控件Dismissible可以方便做到这一功能，但有些时候这个控件和我们需要做的功能不太符合，所有我们就需要自己动手去实现了

方式：

1.使用Dismissible。

2.自己动手实现。

下面先介绍第一种方式Dismissible，首先看一下效果

[图片上传中...(image-b31479-1578306703446-0)]

那接下来看一下代码是怎么实现的：

class ListRemoveFirstPage extends StatefulWidget {
  @override
  _ListRemoveFirstPageState createState() => _ListRemoveFirstPageState();
}

class _ListRemoveFirstPageState extends State<ListRemoveFirstPage> {

  List<Result> listBank=new List();

  int positionNow=0;
  List<GlobalKey<RemoveItemState>> listKey=[];//通过给各个item设置key，点击其它item的时候，打开的item关闭

  @override
  void initState(){
    super.initState();
    initList();
  }

  void initList(){
    listBank=List.generate(10, (index){
      Result result=new Result("title $index","detail $index");
      return result;
    });
    updateView(listBank);
  }



  void updateView(List<Result> list){
    listKey.clear();
    listKey.addAll(setKey(list.length));
    setState(() {});
  }

  List<GlobalKey<RemoveItemState>> setKey(int length){
    var list=<GlobalKey<RemoveItemState>>[];
    for (int i = 0; i < length; i++) {
      var key=GlobalKey<RemoveItemState>();
      list.add(key);
    }
    return list;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(appBar: AppBar(title: Text("List滑动删除"),centerTitle: true,elevation:0),
      body:ListView.builder(itemCount:listBank.length,itemBuilder: (BuildContext context, int index){

        return Dismissible(key: listKey[index],//如果Dismissible是一个列表项 它必须有一个key 用来区别其他项
            background: new Container(color: Colors.red,margin: EdgeInsets.only(top: 15),),
            // 滑动回调
            onDismissed: (direction) {
              // 根据位置移除
              positionNow=index;
              _deleteBank();
              // 提示
              Scaffold.of(context).showSnackBar(SnackBar(content: Text("已移除 $positionNow")));
            },
            child:Container(height:100,padding: EdgeInsets.only(top: 15),width:MediaQuery.of(context).size.width,child: RemoveWidget(listBank[index]),) );
      }),
    );
  }

代码很简单，需要注意的是Dismissible要设置key 否则会报错。
下一篇介绍如何手动实现有删除按钮的滑动删除效果