在设计底部浮动导航栏时,我需要一些帮助。
目前,我拥有第一张图片,并且想要样式像第二张图片
基本上。我想在上方画一条线,选择该项目时该线会更粗
Widget _bottomNavigationBar(int selectedIndex) {
return BottomNavigationBar(
backgroundColor: Palette.TAUPE,
onTap: (int index) {
setState(() {
userModel.selectedIndex = index;
});
},
currentIndex: userModel.selectedIndex,
items: <BottomNavigationBarItem>[
BottomNavigationBarItem(
icon: Container(
margin: EdgeInsets.only(top: 20.0),
child: Image.asset(
"assets/images/search_nav_icon.png",
height: 20.0,
width: 20.0,
),
),
title: Text(''),
),
BottomNavigationBarItem(
icon: Container(
margin: EdgeInsets.only(top: 20.0),
child: Image.asset(
"assets/images/fav_nav_icon.png",
height: 20.0,
width: 20.0,
),
),
title: Text('')),
BottomNavigationBarItem(
icon: Container(
margin: EdgeInsets.only(top: 20.0),
child: Image.asset(
"assets/images/user_nav_icon.png",
height: 20.0,
width: 20.0,
alignment: Alignment.center,
),
),
title: Text(''),
),
],
);
}
如您所见,在底部导航栏上方有一行,并且在选中项目为bar时该行较粗