如何用颤动在屏幕上的某处轻点以隐藏叠加层

Question

我写了一个包含Widget的Button。轻触此Button时，将显示一个带有一些文本信息的小“盒子”。我用Overlay解决了这个问题。 Overlay的内部是GestureDetector。当您点击Overlay时，Overlay将被隐藏。由于Overlay不能填满整个屏幕，因此如果您点击该Overlay的后面，它将不会关闭。但是我希望当您在屏幕上的某个位置（可能在Overlay之外）点击Overlay时将其隐藏。

这里是叠加层的一部分：

class _OverlayHelpWidgetState extends State<OverlayHelpWidget> {
  OverlayEntry _overlayEntry;
  OverlayState _overlayState;
  bool _isVisible = false;

  @override
  Widget build(BuildContext context) {
    return Row(
      children: [
        Center(
          child: GestureDetector(
            child: Icon(
              Icons.help,
              color: Colors.green[800],
            ),
            onTap: () {
              showHelp();
            },
          ),
        )
      ],
      mainAxisAlignment: MainAxisAlignment.end,
    );
  }

  OverlayEntry _createOverlayEntry() {
    return OverlayEntry(
      builder: (context) => Align(
        alignment: Alignment.center,
        child: GestureDetector(
          child: _createContent(),
          onTap: () {
            hideHelp();
          },
        ),
      ),
    );
  }

  showHelp() async {
    if (!_isVisible) {
      _overlayState = Overlay.of(context);
      _overlayEntry = _createOverlayEntry();
      _overlayState.insert(_overlayEntry);
      _isVisible = true;
    }
  }

  void hideHelp() {
    _isVisible = false;
    _overlayEntry.remove();
  }

有人可以帮我解决吗？

谢谢，Bhuelse

Answer 1

感谢pskink，

即解决方案。更改为此，它的工作原理：

  OverlayEntry _createOverlayEntry() {
    return OverlayEntry(
      builder: (context) => GestureDetector(
        behavior: HitTestBehavior.translucent,
        child: Align(
          alignment: Alignment.center,
          child: _createContent(),
        ),
        onTap: () {
          hideHelp();
        },
      ),
    );
  }