Flutter 如何防止onTapCancel由子元素触发

搜索Flutter的github问题，我发现了这https://github.com/flutter/flutter/issues/19783#issuecomment-654052524个

将GestureDetector替换为侦听器小部件

class ActionButton extends StatefulWidget {
  const ActionButton({super.key});

  @override
  State<ActionButton> createState() => _ActionButtonState();
}

class _ActionButtonState extends State<ActionButton> {
  bool isPressed = false;

  @override
  Widget build(BuildContext context) {
    return Listener(
      onPointerDown: (e) {
        setState(() {
          isPressed = true;
        });
      },
      onPointerCancel: (_) => setState(() {
        isPressed = false;
        log("tapCancel");
      }),

      onPointerUp: (e) {
        setState(() {
          isPressed = false;
          log("tapUp");
        });
      },

      child: AnimatedContainer(
        duration: const Duration(milliseconds: 100),
        padding: EdgeInsets.only(bottom: isPressed ? 0 : 5),
        decoration: BoxDecoration(
          color: Colors.green,
          borderRadius: BorderRadius.circular(8),
        ),
        child: Container(
          padding: const EdgeInsets.symmetric(horizontal: 30, vertical: 8),
          decoration: BoxDecoration(
            color: Colors.lightGreen,
            borderRadius: BorderRadius.circular(8),
          ),
          child: const Text(
            "Start",
            style: TextStyle(color: Colors.white),
          ),
        ),
      ),
    );
  }
}

编辑

显然，即使指针位于小部件之外，仍会调用onPointerUp.这有点老生常谈，但我认为加一张职位支票就行了；

  bool isOutside(BuildContext context, Offset postion) {
    return postion.dx < 0 ||
        postion.dy < 0 ||
        postion.dx > (context.size?.width ?? 0) ||
        postion.dy > (context.size?.height ?? 0);
  }

onPointerUp: (e) {
  setState(() {
    isPressed = false;
  });

  if (isOutside(context, e.localPosition)) {
    return;
  }

  // Do something when pointer is inside Listener here
  log("hello");
},