😺

【Flutter】GestureDetectorで囲んだときに、空白部分もDetectしてほしいとき

2021/03/20に公開

問題

GestureDetectorを使ってアクションを追加したいときに、

sample.dart
var _size = MediaQuery.of(context).size;
GestureDetector(
  child: Container(
    width: _size.width,
    child: Center(
      child: Text('Button'),
    )
  )
)

と書くと、「Button」って書いてあるところはタップが反応するけれど、横の空白をタップしても反応しない。

解決策

sample.dart
var _size = MediaQuery.of(context).size;
GestureDetector(
+ behavior: HitTestBehavior.translucent,
  child: Container(
    width: _size.width,
    child: Center(
      child: Text('Button'),
    )
  )
)

behaviorにパラメータを設定することでタップすることができるようになります。

Discussion