Flutter Tooltip on One Tap / Hold Down

Question

My app has several textfields and I want to have a tooltip so that users know can see the definition of each field.

I came across this answer, but it wasn't helpful: Flutter Tooltip on One Tap . Therefore I decided to try and fix it myself .

Answer 1

Here is how to do it:

First add GestureDetector as child for Tooltip,

TooltipTriggerMode.manual for triggerMode.

add onTapDown , onTapUp , and onTapCancel as follows

Widget build(BuildContext context) {
    final tooltipkey = GlobalKey<TooltipState>();
    return Tooltip(
      key: tooltipkey,
      message: message,
      triggerMode: TooltipTriggerMode.manual, // make it manual
      child: GestureDetector(
        behavior: HitTestBehavior.opaque,
        onTapDown: (_) => _onTapDown(tooltipkey), // add this
        onTapUp: (_) => _onTapUpAndCancel(tooltipkey), // add this
        onTapCancel: () => _onTapUpAndCancel(tooltipkey), // add this
        child: Icon(EvaIcons.questionMarkCircleOutline),
      ),
    );
}

and the helper functions shown inside the code above:

void _onTapDown(GlobalKey<TooltipState> tooltipkey) {
    tooltipkey.currentState?.ensureTooltipVisible();
}

void _onTapUpAndCancel(GlobalKey<TooltipState> tooltipkey) {
    tooltipkey.currentState?.deactivate();
}

Hooray, it works. Now you can hold down the icon to display the tooltip immediately instead of holding it down for a while (the default configuration of tooltip).