Flutter开发,在一个页面上有多个图标,如何实现长按一个图标,所有图标右上角有叉?

我想实现这样一个功能,在一个页面上有多个图标,实现长按一个图标,所有图标右上角有叉,能够实现删除一些不要的图标

问题描述

问题出现的环境背景及自己尝试过哪些方法

相关代码

粘贴代码文本(请勿用截图)

你期待的结果是什么?实际看到的错误信息又是什么?

阅读 1.9k
1 个回答

1. 长按任意图标,所有图标可编辑

伪代码如下,这样就实现了长按任意一个图标,所有图标右边出现一个x(具体是右边还是右上角之类的,自己写布局代替Row即可)

bool isEdit = false;

List<Widget> list = [
    GestureDetector(
        child: isEdit?
                Row(children:[Icon(a),Icon(close)]):
                Icon(a),
        onLongPress: handleEdit,
    ),
    GestureDetector(
        child: isEdit?
                Row(children:[Icon(b),Icon(close)]):
                Icon(b),
        onLongPress: handleEdit,
    )
]

void handleEdit(){
    setState(()=>isEdit=true);
}

2. 点击删除功能,改造一下每个Widget的Row,伪代码如下

Row(children:[Icon(a),GestureDetector(
                         child: Icon(close),
                         onTap: handleDel(index)
                      )]);

void handleDel(index){
    setState(()=>{
        list.removeIndex(index);
    });
}
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题