3

I have an OutlinedButton wrapped in a Tooltip widget, I added a margin to the tooltip to position it to the right of the button.

When I hover the button, it's supposed to change the cursor to the hand click icon and set the button to the hovered state (blue border).

The problem is, since the tooltip and its margin appear in front of the button, the button is no longer in a hovered state, it is no longer blue and not clickable.

I have tried IgnorePointer, AbsorbPointer, GestureDetector, etc.

My last option is to build a custom layout and stop using the Tooltip. Any other option?

Sample code:

class ToolTipTest extends StatelessWidget {
  const ToolTipTest({
    super.key,
  });

  @override
  Widget build(final BuildContext context) {
    return Tooltip(
      message: 'name',
      verticalOffset: -5.0,
      margin: const EdgeInsets.only(left: 60.0),
      child: Container(
        color: Colors.white10,
        width: 50.0,
        height: 50.0,
        child: TextButton(
          onPressed: () {},
          child: const Text('test'),
        ),
      ),
    );
  }
}

Mouse hover over the tooltip Mouse hover on an area where the tooltip is not

4
  • Could you attach some code samples to work with.. Commented Dec 6, 2023 at 8:03
  • Added a sample widget that shows the issue. Commented Dec 7, 2023 at 19:22
  • I have the same issue. Any luck? Commented Jul 16, 2024 at 8:50
  • @MayaAmor unfortunately, no. Commented Oct 28, 2024 at 15:45

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.