AppBar BackButton Tooltip interferes with clicking button when TooltipThemeData set to TooltipTriggerMode.tap #152315
Description
Steps to reproduce
On mobile platforms when using the Tooltip widget, there are instances where a single tap is wanted to show the tooltip instead of a long press. The logical solution for this is to make the change using a theme:
TooltipThemeData(triggerMode: TooltipTriggerMode.tap)
However, this creates an issue with the AppBar default BackButton that includes a Tooltip by default.
When tapping the BackButton straight on, a Tooltip pops up that says "Back", instead of popping the current route. Sometimes the Inkwell on the button activates as if the button was tapped, but it doesn't. To get the button to activate, you must tap outside of the button. Tapping just to the right of the button seems to always work.
The issue appears to be with the default Tooltip on the button overriding the tap. Disabling it by using a custom button without a Tooltip, or wrapping the widget in a TooltipVisibility widget resolves the issue.
I would propose a theme option to remove the tooltip from the button. Manually inserting a back button for every screen in a large app can be cumbersome to avoid the tooltip issue, if you also want to enable tooltip taps in the app.
Expected results
Tooltip should not appear on back button and Navigator route should pop.
Actual results
Tooltip Back appears when button is tapped straight on.
Code sample
Code sample (BROKEN)
class TestScreen extends StatefulWidget {
const TestScreen({super.key});
@override
State<TestScreen> createState() => _TestScreenState();
}
class _TestScreenState extends State<TestScreen> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text(
'Test Screen',
),
),
body: const Text('Body'),
);
}
}Code sample (BROKEN)
class TestScreen extends StatefulWidget {
const TestScreen({super.key});
@override
State<TestScreen> createState() => _TestScreenState();
}
class _TestScreenState extends State<TestScreen> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text(
'Test Screen',
),
leading: IconButton(
icon: Icon(Icons.arrow_back_outlined),
onPressed: () {
Navigator.pop(context);
},
tooltip: 'Test',
),
),
body: const Text('Body'),
);
}
}Code sample (WORKING)
class TestScreen extends StatefulWidget {
const TestScreen({super.key});
@override
State<TestScreen> createState() => _TestScreenState();
}
class _TestScreenState extends State<TestScreen> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text(
'Test Screen',
),
leading: IconButton(
icon: Icon(Icons.arrow_back_outlined),
onPressed: () {
Navigator.pop(context);
},
),
),
body: const Text('Body'),
);
}
}Code sample (WORKING)
class TestScreen extends StatefulWidget {
const TestScreen({super.key});
@override
State<TestScreen> createState() => _TestScreenState();
}
class _TestScreenState extends State<TestScreen> {
@override
Widget build(BuildContext context) {
return TooltipVisibility(
visible: false,
child: Scaffold(
appBar: AppBar(
title: const Text(
'Test Screen',
),
),
body: const Text('Body'),
),
);
}
}Screenshots or Video
Screenshots / Video demonstration
[Upload media here]
Logs
Logs
[Paste your logs here]Flutter Doctor output
Doctor output
[Paste your output here]Metadata
Metadata
Assignees
Labels
Type
Projects
Status