是否可以通过单击 flutter 中的图标来触发 CupertinoContextMenu？

Question

我已经CupertinoContextMenu设置好并且运行良好。但是，我在单独的小部件中有一个图标，当点击（单击）时也会触发上下文菜单的打开。

这样的事情可能吗？

Answer 1

我从 PopupMenuButton 材料中编写了一些有点遥远的东西。也许它可以帮助您作为造型的基础。

import 'package:flutter/material.dart';

class IosLikePopupMenuButton extends StatelessWidget {
  final double borderRadius;
  final Color _backgroundColor = const Color.fromARGB(209, 235, 235, 235);
  final List<IosLikePopupMenuItem> Function(BuildContext) itemBuilder;

  const IosLikePopupMenuButton({
    Key? key,
    this.borderRadius = 24.0,
    required this.itemBuilder,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return PopupMenuButton<String>(
      icon: const Icon(Icons.more_horiz),
      itemBuilder: (context1) {
        /// give the current context and map the IosLikePopupMenuItem dtos to PopupMenuEntry while splicing in dividers
        return itemBuilder(context1)
            .map((e) => e.popupMenuItems())
            .toList()
            .fold(
                List<PopupMenuEntry<String>>.empty(growable: true),
                (p, e) => [
                      ...p,
                      ...[e, const PopupMenuDivider()]
                    ])

          /// delete the last divider
          ..removeLast();
      },
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.all(
          Radius.circular(borderRadius),
        ),
      ),
      color: _backgroundColor,
    );
  }
}

class IosLikePopupMenuItem {
  final double menuItemHeight, minSpaceBtwnTxtAndIcon;
  final String lableText;
  final IconData icon;
  final void Function() onTap;

  final TextStyle _textStyle =
      const TextStyle(color: Colors.black, fontSize: 22.0);

  IosLikePopupMenuItem({
    this.menuItemHeight = 24.0,
    this.minSpaceBtwnTxtAndIcon = 48.0,
    required this.lableText,
    required this.icon,
    required this.onTap,
  });

  PopupMenuItem<String> popupMenuItems() => PopupMenuItem<String>(
        height: menuItemHeight,
        textStyle: _textStyle,
        onTap: onTap,
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Text(
              lableText,
            ),
            SizedBox(width: minSpaceBtwnTxtAndIcon),
            Icon(icon),
          ],
        ),
      );
}