HitTestBehavior.translucent not permitting targets behind it to also receive events

user_12483095 0
Viewed 531

Minimal reproducible code

@override
Widget build(BuildContext context) {
  return Scaffold(
    body: Stack(
      children: <Widget>[
        GestureDetector(
          onTap: () => print('Black'),
          child: Container(
            width: 200,
            height: 200,
            color: Colors.black,
          ),
        ),
        GestureDetector(
          onTap: () => print('White'),
          behavior: HitTestBehavior.translucent,
          child: Container(
            color: Colors.white,
            width: 100,
            height: 100,
          ),
        ),
      ],
    ),
  );
}

Docs says:

HitTestBehavior.translucent: Translucent targets both receive events within their bounds and permit targets visually behind them to also receive events.

As I'm using HitTestBehavior.translucent for my white container (second GestureDetector) but then why clicking on it doesn't print both White and Black?

PS: I am not looking for a way to pass the touch events to the first child, it can easily be done using IgnorePointer.

flutter-layout flutter
1 Answers

onTap didn't work for me, I use onTapDown instead.

@override
Widget build(BuildContext context) {
  return Scaffold(
    body: Stack(
      children: <Widget>[
        GestureDetector(
          onTap: () => print('Black'),
          child: Container(
            width: 200,
            height: 200,
            color: Colors.black,
          ),
        ),
        GestureDetector(
          onTap: () => print('White'),
          onTapDown: (_) { // this one 
            debugPrint("on White pan down");
          },
          behavior: HitTestBehavior.translucent,
          child: Container(
            color: Colors.white,
            width: 100,
            height: 100,
          ),
        ),
      ],
    ),
  );
}
user_101571270
Related