Is there anyway to move the bottom navigation bar, to the top of the screen instead of the bottom?

Issue

I am currently developing in flutter and I am trying to move my navigation bar to the top of my screen rather than the bottom which is the default.

I am using a flutter plugin called salomon_bottom_bar: ^3.1.0
and here is the following code for it.

   bottomNavigationBar:
SalomonBottomBar(
    currentIndex: _currentIndex, onTap: (i) => setState(() => _currentIndex = i),
    items: [
      SalomonBottomBarItem(icon: Icon(Icons.home), title: Text("Home"), selectedColor: Colors.pink, unselectedColor: Colors.white),
      SalomonBottomBarItem(icon: Icon(Icons.add), title: Text("Alarm"), selectedColor: Colors.yellow, unselectedColor: Colors.white),
      SalomonBottomBarItem(icon: Icon(Icons.timer), title: Text("Stopwatch"), selectedColor: Colors.orange, unselectedColor: Colors.white),
      SalomonBottomBarItem(icon: Icon(Icons.watch), title: Text("Timer"), selectedColor: Colors.cyan, unselectedColor: Colors.white)
    ],
),

Solution

You can add this to you appbar:

appbar: AppBar(
   flexibleSpace: SalomonBottomBar(
    currentIndex: _currentIndex, onTap: (i) => setState(() => _currentIndex = i),
    items: [
      SalomonBottomBarItem(icon: Icon(Icons.home), title: Text("Home"), selectedColor: Colors.pink, unselectedColor: Colors.white),
      SalomonBottomBarItem(icon: Icon(Icons.add), title: Text("Alarm"), selectedColor: Colors.yellow, unselectedColor: Colors.white),
      SalomonBottomBarItem(icon: Icon(Icons.timer), title: Text("Stopwatch"), selectedColor: Colors.orange, unselectedColor: Colors.white),
      SalomonBottomBarItem(icon: Icon(Icons.watch), title: Text("Timer"), selectedColor: Colors.cyan, unselectedColor: Colors.white)
    ],
),
)

Answered By – Anas Nadeem

Answer Checked By – Senaida (FlutterFixes Volunteer)