flutter长按列表指定位置弹出菜单

最新推荐文章于 2023-09-18 11:43:10 发布

置顶

学屠

最新推荐文章于 2023-09-18 11:43:10 发布

阅读量3.4k

点赞数 5

分类专栏： flutter学习之旅

本文链接：https://blog.csdn.net/mahaiyi2/article/details/116764155

版权

本文介绍如何在Flutter中实现类似安卓微信长按列表弹出菜单的效果，包括在手势位置弹出菜单，根据手势方向判断菜单弹出方向。通过使用GestureDetector获取点击位置，并借助showGeneralDialog实现自定义菜单弹出。

摘要由CSDN通过智能技术生成

flutter长按列表指定位置弹出菜单

效果如图：
在这里插入图片描述

打算弄个像安卓微信列表长按出菜单的效果
要求：
1.长按列表弹出菜单
2.需要在手势位置弹出
3.想微信哪样若手势位置靠上则向下弹出菜单，若点击位置靠下则向上弹出，若点击位置靠左则向右弹，若点击位置靠右则向左弹。
。
实现
本来打算直接用 showMenu 弄来着，但position调来调去都没有办法按照预想位置弹出。
后决定通过 showGeneralDialog 手动弄个。
首先要获取点击位置，常用的 InkWell 只有onLongPress，并没有位置信息，所以选用手势更多的GestureDetector（detail）{}来获取手势位置信息
获取手势位置信息并调用打开菜单方法代码：

GestureDetector(
    onLongPressStart: (olpdt) async {
   
    var menuResult = await showRightMenu(context, 
    olpdt.globalPosition.dx,
    olpdt.globalPosition.dy,
    items: [ MapEntry("修改", eventMenuItems.edit),
             MapEntry("删除", eventMenuItems.delete)]);

弹出菜代码实现：

// 按指定位置弹出菜单
//dx,dy:手势位置
//items菜单选项，keey为显示内容，value为返回值
//如果不传items参数可以自定义菜单样式，需要传size和menu
Future showRightMenu(BuildContext context,dx,dy,{
   List<MapEntry<String,dynamic>> items,Size size,Widget menu}) async{
   
  
  double sw = MediaQuery.of(context