Question

我的应用程序从启动屏幕开始，然后转到主屏幕，在该屏幕上我放置了带有5个选项的底部导航条码，这5个选项的代码被隔离到单独的.dart文件中，这些选项分别为在主屏幕上列出。现在，我需要第3页上的一个按钮，该按钮将打开“导航选项”的第5页，然后在第5页上，在3个选项中进一步打开“ 2nd”选项卡选项。在pub.dev的提供程序包的帮助下，我已经能够使用第3页上的按钮打开第5页我一直在使用3.0.0 + 1版本的提供程序包

提供商类


class BottomNavigationBarProvider with ChangeNotifier {
  int _currentIndex = 2;

  get currentIndex => _currentIndex;

  set currentIndex(int index) {
    _currentIndex = index;
    notifyListeners();
  }

HomeScreen.dart

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: ChangeNotifierProvider<BottomNavigationBarProvider>(
      child: MyBottomNavBar(),
      builder:(BuildContext context) => BottomNavigationBarProvider(),
      ),
    );
  }
}


class MyBottomNavBar extends StatefulWidget {

  @override
  _MyBottomNavBarState createState() => _MyBottomNavBarState();
}

class _MyBottomNavBarState extends State<MyBottomNavBar> {

BottomNavBarOptions

final List<Widget> _widgetOptions = [
    LFGPage(),
    DiscoverPage(),
    HomePage(),
    MessagePage(),
    ProfilePageScreen(),
  ];

使用提供程序构建

 @override
  Widget build(BuildContext context) {
    var homeScreenProvider = Provider.of<BottomNavigationBarProvider>(context);

脚手架

Scaffold(
      body: Navigator(
          onGenerateRoute: (settings) => CupertinoPageRoute(
            settings: settings,
            builder: (context) => _widgetOptions[homeScreenProvider.currentIndex]

          ),
        ),


        bottomNavigationBar: BottomNavigationBar(
          currentIndex: homeScreenProvider.currentIndex,
          items:  <BottomNavigationBarItem>[
            ...
          ]
          onTap: (index) {
///NOTE provider used here 
            homeScreenProvider.currentIndex = index;
          },
        ),
      ),

我正在调用此onTap函数，该函数从底部导航栏导航到第5页，但是我想自动转到3个选项中的“第二个选项卡”选项，但这一次，不是默认值

onTap: (){                      
 varhomeScreenProvider=Provider.of<BottomNavigationBarProvider>(context);
 homeScreenProvider.currentIndex = 4;
                                 
//TODO: Add code to open 2nd tab on 5th bottom navigation Bar Page
},

我的意思是学会回到BNB页面时也要保持状态，页面也要水平和垂直堆叠。预先感谢

如何在flutter应用程序的页面中的底部导航栏页面之间进行切换

0 个答案: