How to navigate to sibling item in Flutter Cupertino Bottom Navigation Bar

Question

I'm using Cupertino design in Flutter and using CupertinoTabBar. I want to visit to different tab item when coming from different screen.

For example, I've 2 items: Home and Profile. CupertinoTabBar is defined in main screen. From HomeScreen, I want to have a button to visit ProfileScreen tab. How to navigate in this situation?

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class MainScreen extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _MainScreenState();
  }
}

class _MainScreenState extends State<MainScreen> {

  @override
  Widget build(BuildContext context) {
    return Material(
      child: CupertinoTabScaffold(
        tabBar: CupertinoTabBar(
          items: const <BottomNavigationBarItem>[
            BottomNavigationBarItem(
              icon: Icon(Icons.home),
              title: Text("Home")
            ),
            BottomNavigationBarItem(
              icon: Icon(Icons.user),
              title: Text("My Appointments")
            )
          ],
        ),
        tabBuilder: (BuildContext context, int index) {
          switch (index) {
            case 0:
              return CupertinoTabView(
                builder: (BuildContext context) {
                  return HomeScreen();
                },
                defaultTitle: 'Home',
              );
              break;
            case 1:
              return CupertinoTabView(
                builder: (BuildContext context) => ProfileScreen(),
                defaultTitle: 'Profile',
              );
              break;
          }

          return null;
        },
      ),
    );
  }
}

class HomeScreen extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return Container(
      child: CupertinoButton(
            child: Text("Check Profile"),
            onPressed: () {
              // Pop this page and Navigate to Profile page
            },
          )
    );
  }
}

class ProfileScreen extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return Container(
      child: Text("Profile")
    );
  }
}

Did you find a solution for your issue?.. if so, can you shared — user2570135, Jun 19 '19 at 13:15

Gabriel · Answer 1 · 2020-08-28T00:49:16.957

Maybe can help you

int currentTabIndex = 0;

  onTapped(int index) {
    setState(() {
      currentTabIndex = index;
    });
  }


  List<Widget> tabs = [
    InicioPage(),
    OfertasPage(),
    FavoritosPage(),
    Login(),
  ];

 tabBuilder: (context, index) {
        switch (index) {
          case 0:
            return InicioPage();
            break;
          case 1:
            return OfertasPage();
            break;
          case 2:
            return FavoritosPage();
            break;
          case 3:
            return Login();
          default:
            return InicioPage();
            break;
        }
      }

You may want to provide some context outside of the code snippet. — 223seneca, Aug 22 '20 at 13:27

How to navigate to sibling item in Flutter Cupertino Bottom Navigation Bar

1 Answers1