Add onTap callback to tab bar. (#107)

* Add onTap callback to tab bar. * Update changelog. * make onTap fire on all taps * Fix CHANGELOG schema --------- Co-authored-by: Nico Vidoni <[email protected]>
SchweizerischeBundesbahnen · May 28, 2024 · ec2a6a1 · ec2a6a1
1 parent 1af18ab
commit ec2a6a1
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 23 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -13,15 +13,17 @@ It is expected that you keep this format strictly, since we depend on it in our
 
 - Added the release github actions workflow.
 - (#110) Match typography specifications from [design.sbb.ch](design.sbb.ch) by adding extraSmallFont.
+- (#107) `SBBTabBar`: Added field `onTap`, which allows for reacting to taps on tab items.
+- (#106) `FontScripts`: Added utils to update the SBB Icon fonts with a script.
 
 ### Changed
 
-- Changed the test flow to include CHANGELOG.md validation.
+- (#118) Changed the test flow to include CHANGELOG.md validation.
 
 ### Fixed
 
 - (#115) Golden Tests by replacing golden_toolkit package.
-- Support Flutter 3.22 by replacing `TextTheme.subtitle` getter.
+- (#114) Support Flutter 3.22 by replacing `TextTheme.subtitle` getter.
 
 ## [1.2.0] - 2023-12-19
 

diff --git a/example/lib/pages/tab_bar_page.dart b/example/lib/pages/tab_bar_page.dart
@@ -21,28 +21,34 @@ class _TabBarPageState extends State<TabBarPage> {
   late TabBarController controller = TabBarController(items.first);
 
   @override
-  Widget build(BuildContext context) => Column(
-        children: [
-          const Padding(
-            padding: const EdgeInsets.all(sbbDefaultSpacing),
-            child: ThemeModeSegmentedButton(),
+  Widget build(BuildContext context) {
+    final sbbToast = SBBToast.of(context);
+    return Column(
+      children: [
+        const Padding(
+          padding: const EdgeInsets.all(sbbDefaultSpacing),
+          child: ThemeModeSegmentedButton(),
+        ),
+        Expanded(child: Container()),
+        if (visible)
+          SBBTabBar(
+            items: items,
+            showWarning: true,
+            onTabChanged: (task) async {},
+            controller: controller,
+            warningSemantics: 'Warning',
+            onTap: (tab) {
+              sbbToast.show(message: 'Tab tapped: Item ${tab.id}');
+            },
           ),
-          Expanded(child: Container()),
-          if (visible)
-            SBBTabBar(
-              items: items,
-              showWarning: true,
-              onTabChanged: (task) async {},
-              controller: controller,
-              warningSemantics: 'Warning',
-            ),
-          Expanded(child: Container()),
-          SBBPrimaryButton(
-            label: 'toggle',
-            onPressed: () => setState(() => visible = !visible),
-          ),
-        ],
-      );
+        Expanded(child: Container()),
+        SBBPrimaryButton(
+          label: 'toggle',
+          onPressed: () => setState(() => visible = !visible),
+        ),
+      ],
+    );
+  }
 }
 
 class _DemoItem extends TabBarItem {

diff --git a/lib/src/tab_bar/sbb_tab_bar.dart b/lib/src/tab_bar/sbb_tab_bar.dart
@@ -12,11 +12,13 @@ import 'tab_item_widget.dart';
 /// The TabBar for SBB themed apps with multiple tabs.
 /// Items is a list of all tabs that should be shown in the TabBar.
 /// OnTabChanged defines what happens when a tab is selected.
+/// OnTap gets called when a tab is tapped.
 class SBBTabBar extends StatefulWidget {
   const SBBTabBar({
     required this.items,
     required this.onTabChanged,
     Key? key,
+    this.onTap,
     this.controller,
     this.initialItem,
     this.warningSemantics,
@@ -27,6 +29,7 @@ class SBBTabBar extends StatefulWidget {
 
   final List<TabBarItem> items;
   final Future<void> Function(Future<TabBarItem> tabTask) onTabChanged;
+  final void Function(TabBarItem tab)? onTap;
   final TabBarController? controller;
   final TabBarItem? initialItem;
   final String? warningSemantics;
@@ -141,6 +144,7 @@ class _SBBTabBarState extends State<SBBTabBar> with SingleTickerProviderStateMix
                             child: GestureDetector(
                               key: Key('${tab.id}_button'),
                               onTap: () {
+                                widget.onTap?.call(tab);
                                 if (snapshotData.selectedTab == tab) return;
                                 widget.onTabChanged(_controller.selectTab(tab));
                               },