关键代码:
Scaffold中设置floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked和extendBody: true，
BottomAppBar中设置shape: const CircularNotchedRectangle()
dart
Scaffold(
extendBody: true,//body是否延伸脚手架底部，在底部导航栏的边缘添加了凹口时，确保能看到body内容
body: _body(),
floatingActionButton: FloatingActionButton(
backgroundColor: Colors.transparent,
onPressed: () {
isLogin().then((value) {
if (value == true) {
Utils().postDialog(context);
} else {
NavigatorUtil.push(LoginPage());
}
});
},
child: Image.asset(PathConfig.iconPublishGreen,width: 112.w,height: 112.w),
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
bottomNavigationBar: _bottomNavigationAppBar(),
);
//中间凸出的底部导航栏(和floatingActionButton配合使用)
_bottomNavigationAppBar(){
return SizedBox(
height: 110.w,
child: BottomAppBar(
color: Colors.white,
shape: const CircularNotchedRectangle(),//添加一个凹口的形状
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
// 首页底部图标
Expanded(child: GestureDetector(
child: _currentIndex == 0
? Image.asset(PathConfig.iconLogoRound,width: 64.w,height: 64.w)
: Container(
color: Colors.transparent,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Container(
width: 40.w,
height: 40.w,
margin: EdgeInsets.only(bottom: 4.w),
child: Image(
image: AssetImage(PathConfig.iconUnselectAtui),
),
),
Text(S.of(context).atui,
style: TextStyle(
fontSize: 20.sp,
color: _currentIndex == 0 ? Color(0xffe63850) : Color(0xffD2D5D4)))
],
),
),
onTap: (){
_changePage(0);
}
)),
// 商城底部图标
Expanded(child: GestureDetector(
child: Container(
color: Colors.transparent,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Container(
width: 40.w,
height: 40.w,
margin: EdgeInsets.only(bottom: 4.w),
child: Image(
image: AssetImage(
_currentIndex == 1 ? PathConfig.iconSelectedMarket : PathConfig.iconUnselectMarket),
),
),
Text(S.of(context).market,
style: TextStyle(
fontSize: 20.sp, color: _currentIndex == 1 ? JadeColors.green_2 : Color(0xffD2D5D4)))
],
),
),
onTap: (){
_changePage(1);
}
)),
// 发布图标
Expanded(child: GestureDetector(
child: Column(
children: <Widget>[
Container(
width: 40.w,
height: 40.w,
),
/*Text(
S.of(context).publish,
style: TextStyle(
fontSize: 13,
color: JadeColors.green_2),
)*/
],
),
onTap: (){
//_changePage(2);
}
)),
// 消息底部图标
Expanded(child: GestureDetector(
child: Container(
color: Colors.transparent,
// alignment: Alignment.center,
child: Stack(
alignment: Alignment.center,
children: <Widget>[
Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
width: 40.w,
height: 40.w,
margin: EdgeInsets.only(bottom: 4.w),
child: Image(
image: AssetImage(_currentIndex == 3 ? PathConfig.iconSelectedMessage : PathConfig.iconUnselectMessage),
),
),
Text(
S.of(context).xiaoxi,
style: TextStyle(
fontSize: 20.sp,
color: _currentIndex == 3 ? JadeColors.green_2 : Color(0xffD2D5D4)),
)
],
),
Positioned(
right: 40.w,
top: 6.w,
child: _messageCountView())
],
),
),
onTap: (){
_changePage(3);
},
)),
// 我的底部图标
Expanded(child: GestureDetector(
child: Container(
color: Colors.transparent,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Container(
width: 40.w,
height: 40.w,
margin: EdgeInsets.only(bottom: 4.w),
child: Image(
image: AssetImage(_currentIndex == 4 ? PathConfig.iconSelectedMine : PathConfig.iconUnselectMine),
),
),
Text(
S.of(context).wode,
style: TextStyle(
fontSize: 20.sp,
color: _currentIndex == 4 ? JadeColors.green_2 : Color(0xffD2D5D4)),
)
],
)
),
onTap: (){
_changePage(4);
},
))
],
),
),
);
}