Flutter ListTile在longLongPress上启用多选

问题描述:

我想在Google Keep中实现类似的功能.

I would like to achieve the similar things like in Google Keep.

如何在长按时启用多个选择并更改标题按钮,以便以后可以删除那些选择的项目?

How can I enable multiple selections on long press and change the header buttons, so that I can delete those selected items later ?

我当前的Dart代码:

My current Dart code :

@override
  Widget build(BuildContext context) {
    return new Card(
      child: new Column(mainAxisSize: MainAxisSize.min, children: <Widget>[
        new ListTile(
          leading: const Icon(Icons.info),
          title: new Text(item.name),
          subtitle: new Text(item.description),
          trailing: new Text(item.dateTime.month.toString()),
          onTap: () => _openEditDialog(context, item),
          onLongPress: // what should I put here,
        )
      ]),
    );
  }

当用户长按 ListTile 必须将所选属性更改为true,反之亦然,并且卡片颜色必须更改为

when the user do a long press the ListTile must change the selected property to true and vise versa and the Card Color must be Changed to Something like Grey[300]

class cardy extends StatefulWidget {
  @override
  _cardyState createState() => new _cardyState();
}

class _cardyState extends State<cardy> {
  var isSelected = false;
  var mycolor=Colors.white;

  @override
  Widget build(BuildContext context) {
    return new Card(
      color: mycolor,
      child: new Column(mainAxisSize: MainAxisSize.min, children: <Widget>[
        new ListTile(
            selected: isSelected,
            leading: const Icon(Icons.info),
            title: new Text("Test"),
            subtitle: new Text("Test Desc"),
            trailing: new Text("3"),
            onLongPress: toggleSelection // what should I put here,
            )
      ]),
    );
  }

  void toggleSelection() {
    setState(() {
      if (isSelected) {
        mycolor=Colors.white;
        isSelected = false;
      } else {
        mycolor=Colors.grey[300];
        isSelected = true;
      }
    });
  }
}

如果要获得边框"着色效果,请在容器"内创建一列,并将装饰属性设置为变量,然后将其命名为 border 并编辑选择方法

EDIT : if you want to get the Border coloring effect make the column Inside the a Container and set the decoration property to a variable and call it border and Edit the select method

void toggleSelection() {
    setState(() {
      if (isSelected) {
        border=new BoxDecoration(border: new Border.all(color: Colors.white));
        mycolor = Colors.white;
        isSelected = false;
      } else {
        border=new BoxDecoration(border: new Border.all(color: Colors.grey));
        mycolor = Colors.grey[300];
        isSelected = true;
      }
    });
  }