flutter 长按弹出菜单,删除,分享,更多,撤回.

最新推荐文章于 2024-05-30 09:45:37 发布

张漂亮2号

最新推荐文章于 2024-05-30 09:45:37 发布

阅读量1.3k

点赞数 1

分类专栏： flutter 文章标签： flutter 长按菜单仿微信删除更多

本文为博主原创文章，未经博主允许不得转载。

本文链接：https://blog.csdn.net/beyondforme/article/details/104100657

版权

在开发IM软件中，需要实现长按操作显示包括删除、分享、更多和撤回等选项的菜单。本文展示了如何在Flutter中创建这样的功能，并提供了相关代码示例WPopupMenu.dart，以及原文链接和其他学习资源。

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

最近在开发IM软件,需要做:长按弹出菜单,删除,分享,更多,撤回.

先看看效果是不是你想要的

使用处的代码

_menuView() {
    bool isCanRecall = DateTime.now().millisecondsSinceEpoch -
            dateTime.millisecondsSinceEpoch <
        12000;
    var _data = ['复制', '转发', '删除'];
    var menuWidth = 150.0;
    if (isCanRecall && direct == 1) {
      _data.add('撤回');
      menuWidth = 200.0;
    }
    return WPopupMenu(
        menuWidth: menuWidth,
        menuHeight: 30,
        decoration: ShapeDecoration(
          shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.all(Radius.circular(5))),
        ),
        onValueChanged: (int selected) {
          switch (_data[selected]) {
            case '复制':
              ToastUtils.toast(context, msg: '复制成功');
              Clipboard.setData(ClipboardData(text: text));
              break;
            case '转发':
              _selectMemberPage();
              break;
            case '删除':
              _deleteMsg();
              break;
            case '撤回':
              _recallMsg();
              break;
          }
        },
        pressType: PressType.longPress,
        actions: _data,
        child: _backView(context));
  }

WPopupMenu.dart

import 'package:flutter/material.dart';
import 'package:wechat/common/view/triangle_painter.dart';

const double _kMenuScreenPadding = 8.0;

class WPopupMenu extends StatefulWidget {
  WPopupMenu({
    Key key,
    @required this.onValueChanged,
    @required this.actions,
    @required this.child,
    this.pressType = PressType.longPress,
    this.pageMaxChildCount = 5,
    this.backgroundColor = Colors.black,
    this.menuWidth = 250,
    this.menuHeight = 42,
    this.alignment,
    this.padding,
    Color color,
    Decoration decoration,
    this.foregroundDecoration,
    double width,
    double height,
    BoxConstraints constraints,
    this.margin,
    this.transform,
  })  : assert(onValueChanged != null),
        assert(actions != null && actions.length > 0),
        assert(child != null),
        assert(margin == null || margin.isNonNegative),
        assert(padding == null || padding.isNonNegative),
        assert(decoration == null || decoration.debugAssertIsValid()),
        assert(constraints == null || constraints.debugAssertIsValid()),
        assert(
            color == null || decoration == null,
            'Cannot provide both a color and a decoration\n'
            'The color argument is just a shorthand for "decoration: new BoxDecoration(color: color)".'),
        decoration =
            decoration ?? (color != null ? BoxDecoration(color: color) : null),
        constraints = (width != null || height != null)
            ? constraints?.tighten(width: width, height: height) ??
                BoxConstraints.tightFor(width: width, height: height)
            : constraints,
        super(key: key);

  final BoxConstraints constraints;
  final Decoration decoration;
  final AlignmentGeometry alignment;
  final EdgeInsets padding;
  final Decoration foregroundDecoration;
  final EdgeInsets margin;
  final Matrix4 transform;
  final ValueChanged<int> onValueChanged;
  final List<String> actions;
  final Widget child;
  final PressType pressType; // 点击方式 长按 还是单击
  final int pageMaxChildCount;
  final Color backgroundColor;
  final double menuWidth;
  final double menuHeight;

  @override
  _WPopupMenuState createState() => _WPopupMenuState();
}

class _WPopupMenuState extends State<WPopupMenu> {
  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      child: Container(
        key: widget.key,
        padding: widget.padding,