如何使选项卡栏在Flutter中默认从中心开始

Question

我正在使用Flutter中的选项卡栏。我有3个标签内底部导航栏，当应用程序开始的第一个标签将被默认选择。输入图片描述

我希望应用程序以中心标签作为默认标签打开。

输入图片描述

我怎样才能做到这一点?

我的代码

class MyStatefulWidget extends StatefulWidget {
MyStatefulWidget({Key key}) : super(key: key);
@override
_MyStatefulWidgetState createState() => _MyStatefulWidgetState();
}
class _MyStatefulWidgetState extends State<MyStatefulWidget>
with SingleTickerProviderStateMixin {
TabController _tabController;
@override
void initState() {
super.initState();
_tabController = TabController(vsync: this, length: 3);
}
@override
void dispose() {
_tabController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: TabBarView(
controller: _tabController,
physics: NeverScrollableScrollPhysics(),
children: <Widget>[
WallpaperLandingPage(),
SetUpLandingPage(),
SettingPage(),
],
),
bottomNavigationBar: Container(
height: 65.0,
decoration: BoxDecoration(
borderRadius: BorderRadius.only(
topRight: Radius.circular(30), topLeft: Radius.circular(30)),
boxShadow: [
BoxShadow(color: Colors.black38, spreadRadius: 0, blurRadius: 10),
],
),
child: ClipRRect(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(30.0),
topRight: Radius.circular(30.0),
),
child: BottomAppBar(
child: Container(
child: TabBar(
indicatorSize: TabBarIndicatorSize.label,
isScrollable: false,
indicator: BoxDecoration(
shape: BoxShape.circle,
color: Colors.green,
),
tabs: <Widget>[
Container(
height: 45.0,
width: 45.0,
child: Icon(AntDesign.picture),
),
Container(
height: 45.0,
width: 45.0,
child: Icon(AntDesign.home),
),
Container(
height: 45.0,
width: 45.0,
child: Icon(Entypo.grid),
),
],
controller: _tabController,
),
),
),
),
),
);
}
}

Answer 1

try this:

_tabController = TabController(initialIndex: 1, vsync: this, length: 3);

Answer 2

您也可以使用DefaultTabController

查看官方Flutter文档https://api.flutter.dev/flutter/material/TabBar-class.html

中如何使用的示例