使用 SafeArea widget來包裹tabbar的widget即可解決問題
問題如下
image.png
問題代碼
class HomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
// TODO: implement build
return new DefaultTabController(
length: 3,
child: new Scaffold(
body: new TabBarView(
children: <Widget>[
new FitstTabView(),
new SecondTabView(),
new ThirdTabView(),
],
),
bottomNavigationBar: new TabBar(
tabs: <Widget>[
new Tab(icon: new Icon(Icons.directions_car)),
new Tab(icon: new Icon(Icons.directions_transit)),
new Tab(icon: new Icon(Icons.directions_bike)),
],
labelColor: Colors.blue,
unselectedLabelColor: Colors.white,
indicatorColor: Colors.blue,
),
backgroundColor: Colors.black,
),
);
}
}
解決的關(guān)鍵代碼(使用 SafeArea widget來包裹)
bottomNavigationBar: SafeArea(
child: new TabBar(
tabs: <Widget>[
new Tab(icon: new Icon(Icons.directions_car)),
new Tab(icon: new Icon(Icons.directions_transit)),
new Tab(icon: new Icon(Icons.directions_bike)),
],
labelColor: Colors.blue,
unselectedLabelColor: Colors.white,
indicatorColor: Colors.blue,
),
),
其它相關(guān)資料參考
https://github.com/flutter/flutter/issues/12099
https://github.com/flutter/flutter/issues/12883
https://github.com/flutter/flutter/issues/12895
