Improve recursive routing navigation with 2 FABs

Hellogramming · Oct 31, 2024 · eac7668 · eac7668
1 parent 2f7d77e
commit eac7668
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 12 deletions.
diff --git a/recursive_routing/lib/common/strings.dart b/recursive_routing/lib/common/strings.dart
@@ -9,6 +9,7 @@ library;
 const String appName = 'Flutter Recursive Routing';
 const String recursiveRoutingScreenTitle = 'Recursive Routing';
 String recursiveLevel(int level) => 'Level $level';
-const String goHomeTitle = 'Go home';
-const String goDeeperTitle = 'Go deeper';
+const String goHomeTitle = 'Go back to the first level';
+const String goUpTooltip = 'Go up to the previous level';
+const String goDownTooltip = 'Go down to the next level';
 const String addTooltip = 'Increment counter to check state keeping';
diff --git a/recursive_routing/lib/screens/recursive_routing_screen.dart b/recursive_routing/lib/screens/recursive_routing_screen.dart
@@ -47,7 +47,7 @@ class _RecursiveRoutingScreenState extends State<RecursiveRoutingScreen> {
   }
 
   /// Navigates to a deeper recursive routing screen.
-  void _goDeep() {
+  void _goDown() {
     Navigator.push(
       context,
       MaterialPageRoute(
@@ -56,6 +56,11 @@ class _RecursiveRoutingScreenState extends State<RecursiveRoutingScreen> {
     );
   }
 
+  /// Navigates to a shallower recursive routing screen.
+  void _goUp() {
+    if (widget.level > 1) Navigator.pop(context);
+  }
+
   /// Performs the tasks of the app bar actions.
   void _onAppBarAction(_AppBarActions action) {
     switch (action) {
@@ -92,13 +97,32 @@ class _RecursiveRoutingScreenState extends State<RecursiveRoutingScreen> {
         ),
       ),
 
-      // The floating action button that navigates to a deeper recursive routing screen
-      floatingActionButton: FloatingActionButton.extended(
-        backgroundColor: _accentColor,
-        foregroundColor: contrastColor,
-        onPressed: _goDeep,
-        icon: const Icon(Icons.arrow_drop_down_circle),
-        label: const Text(strings.goDeeperTitle),
+      floatingActionButton: Row(
+        mainAxisSize: MainAxisSize.min,
+        children: <Widget>[
+          // The floating action button that navigates to a shallower recursive routing screen
+          if (widget.level > 1) ...[
+            FloatingActionButton.large(
+              heroTag: 'goUp',
+              backgroundColor: _accentColor,
+              foregroundColor: contrastColor,
+              tooltip: strings.goUpTooltip,
+              onPressed: _goUp,
+              child: const Icon(Icons.arrow_back),
+            ),
+            const SizedBox(width: 16.0),
+          ],
+
+          // The floating action button that navigates to a deeper recursive routing screen
+          FloatingActionButton.large(
+            heroTag: 'goDown',
+            backgroundColor: _accentColor,
+            foregroundColor: contrastColor,
+            tooltip: strings.goDownTooltip,
+            onPressed: _goDown,
+            child: const Icon(Icons.arrow_forward),
+          ),
+        ],
       ),
     );
   }

diff --git a/recursive_routing/lib/utils/color_utils.dart b/recursive_routing/lib/utils/color_utils.dart
@@ -8,11 +8,11 @@ import 'dart:math';
 import 'package:flutter/material.dart';
 
 /// A random number generator used to generate random colors.
-final Random _random = Random();
+final Random _random = Random.secure();
 
 /// Generates a random color.
 Color getRandomColor() {
-  return Color.fromRGBO(_random.nextInt(256), _random.nextInt(256), _random.nextInt(256), 1.0);
+  return Color(0xFF000000 + _random.nextInt(0x1000000));
 }
 
 /// Returns an appropriate contast color for the given color (black or white).