Unverified Commit 04c104cc authored by Yash Johri's avatar Yash Johri Committed by GitHub

[BottomNavigationBar] Adds more control to ToolTip (#71079)

parent 7ce8f4ab
...@@ -397,6 +397,9 @@ class _BottomNavigationTile extends StatelessWidget { ...@@ -397,6 +397,9 @@ class _BottomNavigationTile extends StatelessWidget {
// (or zero if the unselected icons are not any bigger than the selected icon). // (or zero if the unselected icons are not any bigger than the selected icon).
final double unselectedIconDiff = math.max(unselectedIconSize - selectedIconSize, 0); final double unselectedIconDiff = math.max(unselectedIconSize - selectedIconSize, 0);
// The effective tool tip message to be shown on the BottomNavigationBarItem.
final String? effectiveTooltip = item.tooltip == '' ? null : item.tooltip ?? item.label;
// Defines the padding for the animating icons + labels. // Defines the padding for the animating icons + labels.
// //
// The animations go from "Unselected": // The animations go from "Unselected":
...@@ -487,9 +490,9 @@ class _BottomNavigationTile extends StatelessWidget { ...@@ -487,9 +490,9 @@ class _BottomNavigationTile extends StatelessWidget {
), ),
); );
if (item.label != null) { if (effectiveTooltip != null) {
result = Tooltip( result = Tooltip(
message: item.label!, message: effectiveTooltip,
preferBelow: false, preferBelow: false,
verticalOffset: selectedIconSize + selectedFontSize, verticalOffset: selectedIconSize + selectedFontSize,
excludeFromSemantics: true, excludeFromSemantics: true,
......
...@@ -32,6 +32,7 @@ class BottomNavigationBarItem { ...@@ -32,6 +32,7 @@ class BottomNavigationBarItem {
this.label, this.label,
Widget? activeIcon, Widget? activeIcon,
this.backgroundColor, this.backgroundColor,
this.tooltip,
}) : activeIcon = activeIcon ?? icon, }) : activeIcon = activeIcon ?? icon,
assert(label == null || title == null), assert(label == null || title == null),
assert(icon != null); assert(icon != null);
...@@ -77,9 +78,7 @@ class BottomNavigationBarItem { ...@@ -77,9 +78,7 @@ class BottomNavigationBarItem {
/// The text label for this [BottomNavigationBarItem]. /// The text label for this [BottomNavigationBarItem].
/// ///
/// This will be used to create a [Text] widget to put in the bottom navigation bar, /// This will be used to create a [Text] widget to put in the bottom navigation bar.
/// and in Material Design [BottomNavigationBar]s, this will be used to display
/// a tooltip on long press of an item in the [BottomNavigationBar].
final String? label; final String? label;
/// The color of the background radial animation for material [BottomNavigationBar]. /// The color of the background radial animation for material [BottomNavigationBar].
...@@ -96,4 +95,13 @@ class BottomNavigationBarItem { ...@@ -96,4 +95,13 @@ class BottomNavigationBarItem {
/// * [Icon.color] and [ImageIcon.color] to control the foreground color of /// * [Icon.color] and [ImageIcon.color] to control the foreground color of
/// the icons themselves. /// the icons themselves.
final Color? backgroundColor; final Color? backgroundColor;
/// The text to display in the tooltip for this [BottomNavigationBarItem], when
/// the user long presses the item.
///
/// The [Tooltip] will only appear on an item in a Material design [BottomNavigationBar], and
/// when the string is not empty.
///
/// Defaults to null, in which case the [label] text will be used.
final String? tooltip;
} }
...@@ -1121,6 +1121,7 @@ void main() { ...@@ -1121,6 +1121,7 @@ void main() {
BottomNavigationBarItem( BottomNavigationBarItem(
label: label, label: label,
icon: Icon(Icons.ac_unit), icon: Icon(Icons.ac_unit),
tooltip: label,
), ),
BottomNavigationBarItem( BottomNavigationBarItem(
label: 'B', label: 'B',
...@@ -1151,6 +1152,45 @@ void main() { ...@@ -1151,6 +1152,45 @@ void main() {
expect(tester.getSize(find.text(label).last), equals(const Size(168.0, 56.0))); expect(tester.getSize(find.text(label).last), equals(const Size(168.0, 56.0)));
}); });
testWidgets('Different behaviour of tool tip in BottomNavigationBarItem', (WidgetTester tester) async {
await tester.pumpWidget(
MaterialApp(
home: Scaffold(
bottomNavigationBar: BottomNavigationBar(
items: const <BottomNavigationBarItem>[
BottomNavigationBarItem(
label: 'A',
tooltip: 'A tooltip',
icon: Icon(Icons.ac_unit),
),
BottomNavigationBarItem(
label: 'B',
icon: Icon(Icons.battery_alert),
),
BottomNavigationBarItem(
label: 'C',
icon: Icon(Icons.cake),
tooltip: '',
),
],
),
),
),
);
expect(find.text('A'), findsOneWidget);
await tester.longPress(find.text('A'));
expect(find.byTooltip('A tooltip'), findsOneWidget);
expect(find.text('B'), findsOneWidget);
await tester.longPress(find.text('B'));
expect(find.byTooltip('B'), findsOneWidget);
expect(find.text('C'), findsOneWidget);
await tester.longPress(find.text('C'));
expect(find.byTooltip('C'), findsNothing);
});
testWidgets('BottomNavigationBar limits width of tiles with long titles', (WidgetTester tester) async { testWidgets('BottomNavigationBar limits width of tiles with long titles', (WidgetTester tester) async {
final Text longTextA = Text(''.padLeft(100, 'A')); final Text longTextA = Text(''.padLeft(100, 'A'));
final Text longTextB = Text(''.padLeft(100, 'B')); final Text longTextB = Text(''.padLeft(100, 'B'));
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment