如何使用库比蒂诺标签栏移动标签?与材料标签栏不同,我们没有标签控制器来切换标签



我在主页选项卡上,我需要使用 CupertinoTabBar 切换到我的第二个选项卡。我没有选项卡控制器可以使用全局键(如材料选项卡栏)进行切换。你能建议选项吗?

我尝试使用全局键并更改选项卡的当前索引。但是,没有运气。已经没有选择。

HomeScreen.dart - 包含选项卡

```Widget build(BuildContext context) {
    return new CupertinoTabScaffold(
      tabBar: CupertinoTabBar(
        key: HomeScreen._myTabbedPageKey,
        backgroundColor: Colors.black,
        currentIndex: _currentIndex,
        items: <BottomNavigationBarItem>[
          BottomNavigationBarItem(
              icon: new Icon(Icons.home, color: Colors.white),
              activeIcon: new Icon(Icons.home,
                  color: Color.fromARGB(198, 39, 169, 227)),
              title: new Text(
                'Home',
                style: TextStyle(color: Color.fromARGB(198, 39, 169, 227)),
              )),
          BottomNavigationBarItem(
              icon: new Icon(Icons.track_changes, color: Colors.white),
              activeIcon: new Icon(Icons.track_changes,
                  color: Color.fromARGB(198, 39, 169, 227)),
              title: new Text(
                'Trips',
                style: TextStyle(color: Color.fromARGB(198, 39, 169, 227)),
              )),
          BottomNavigationBarItem(
              icon: new Icon(Icons.traffic, color: Colors.white),
              activeIcon: new Icon(Icons.traffic,
                  color: Color.fromARGB(198, 39, 169, 227)),
              title: new Text('Track',
                  style: TextStyle(color: Color.fromARGB(198, 39, 169, 227)))),
          BottomNavigationBarItem(
              icon: new Icon(Icons.settings, color: Colors.white),
              activeIcon: new Icon(Icons.settings,
                  color: Color.fromARGB(198, 39, 169, 227)),
              title: new Text('Settings',
                  style: TextStyle(color: Color.fromARGB(198, 39, 169, 227))))
        ],
      ),
      tabBuilder: (BuildContext context, int index) {
        if (_currentIndex != -1) {
          _currentIndex = index;
          return _children[_currentIndex];
        } else {
          return _children[index];
        }
      },
    );
  }```

HomeTab.dart - 包含"查看更多行程"按钮。单击按钮应该将我带到第二个选项卡

 Widget build(BuildContext context) {
     return new CupertinoPageScaffold(
         backgroundColor: Colors.white,
         navigationBar: new CupertinoNavigationBar(
           middle: title,
           backgroundColor: Colors.black,
           automaticallyImplyLeading: false,
         ),
         child: new RefreshIndicator(
             key: _homeRefreshIndicatorKey,
             onRefresh: _refresh,
             child: new SingleChildScrollView(
               child: new Container(
                 child: new Center(
                   child: new Column(
                     // center the children
                     mainAxisAlignment: MainAxisAlignment.start,
                     children: <Widget>[
                       CupertinoButton(
                           color: Color.fromARGB(198, 39, 169, 227),
                           disabledColor: Colors.grey,
                           child: Text('SEE MORE TRIPS',
                               style: TextStyle(
                                   fontSize: 12,
                                   color: Colors.white,
                                   fontFamily: 'Lato')),
                           onPressed: () {
                             //to call second tab
                           }),
                       new SizedBox(
                         height: 16,
                       )
                     ],
                   ),
                 ),
               ),
             )));
 }```
To be navigated to second tab


你应该

使用CupertinoTabController按预期更改标签栏索引,将CupertinoTabController的实例传递给controller CupertinoTabScaffold属性。

最后,以编程方式更改索引。

setState(() {
     _tabController.index = 0;
});

最新更新