I have a flutter website with a bottom navigation bar, the bar however is white with white text. I don't know how to fix it so the icons and text can be visible. I tried setting the background colour but it keeps ignoring me and setting it to white.
Here is the code for the screen:
bottomNavigationBar: BottomNavigationBar(
type: BottomNavigationBarType.shifting,
items: const <BottomNavigationBarItem>[
BottomNavigationBarItem(
icon: Icon(Icons.edit_note_sharp),
label: 'txt1',
),
BottomNavigationBarItem(
icon: Icon(Icons.checklist_outlined),
label: 'txt2',
),
],
currentIndex: _selectedIndex,
onTap: onItemTapped,
backgroundColor: kPrimaryColor,
mouseCursor: SystemMouseCursors.click,
selectedFontSize: 20,
selectedIconTheme: const IconThemeData(color: Colors.amberAccent, size: 40),
selectedItemColor: Colors.amberAccent,
selectedLabelStyle: const TextStyle(fontWeight: FontWeight.bold, color: Colors.black),
unselectedIconTheme: const IconThemeData(
color: kPrimaryLightColor,
),
unselectedItemColor: Colors.blueGrey,
),
Looks like the backgroundcolor
variable of BottomNavigationBar
is ignored when the type
is set to BottomNavigationBarType.shifting
.
Changing that to BottomNavigationBarType.fixed
enabled me to set my background colors accordingly.