Flutter - prevent tap/click events from being passed through view hierarchy
Use pointer_interceptor widget, especially if you target Web with complex layouts involving maps, Stack
, drawers
, Positionned
widgets, etc. So in your case it would be something like:
import 'package:pointer_interceptor/pointer_interceptor.dart';
...
return TextFormField(
controller: _textEditingController,
onTap: onEditTextTapped,
decoration: InputDecoration(
suffixIcon: PointerInterceptor(
child: IconButton(
onPressed: onClearTextClick,
icon: Icon(
Icons.clear,
size: 20.0,
),
),
),
),
style: TextStyle(fontWeight: FontWeight.normal, fontSize: 18),
);
![kosiara - Bartosz Kosarzycki](https://i.stack.imgur.com/SiTPw.jpg?s=256&g=1)
kosiara - Bartosz Kosarzycki
I'm a senior Java/Android developer constantly developing his skills more here: https://sites.google.com/site/bkosarzyckiaboutme/
Updated on December 14, 2022Comments
-
kosiara - Bartosz Kosarzycki over 1 year
I'm looking for the best way to stop tap/click events from being propagated up the view hierarchy. Suppose we have a simple scenario with a TextField decorated with a an 'X' clear text button.
When I click the "X" button the click event is propagated up to TextField's onPressed().
final _textEditingController = TextEditingController(text: ""); @override Widget build(BuildContext context) { return TextFormField( controller: _textEditingController, onTap: onEditTextTapped, decoration: InputDecoration( suffixIcon: IconButton( onPressed: onClearTextClick, icon: Icon( Icons.clear, size: 20.0, ), ), ), style: TextStyle(fontWeight: FontWeight.normal, fontSize: 18), ); } void onEditTextTapped() { print('TextField tapped'); } void onClearTextClick() { print('clear text clicked'); }
The result is:
flutter: clear text clicked flutter: TextField tapped
I need something similar to Android's
android:clickable="true"
or Flutter'sAbsorbPointer
that would trap all click events and stop them from being passed through to the view beneath BUT only when I click 'clear text' button. Click event fromTextFormField
should still triggeronEditTextTapped()
Flutter (Channel stable, v1.9.1+hotfix.2, on Mac OS X 10.14.5 18F132)