Flutter currentIndex具有onPressed功能

我正在制作一个颤振应用程序，我正在底部导航栏上工作，我想知道我是否可以制作按钮，将用户从应用程序重定向到新的页面UI。我使用了这个“包：bubble\u bottom\u bar/bubble\u bottom\u bar.dart”，我不知道当用户按下图标时如何校准currentIndex=1、2、3、4以重定向到新页面。我试着在我的泡泡床上添加一个onPressed动作，但没有效果。 这是我正在使用的代码

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:tariffo/favoriteProviders.dart';
import 'package:tariffo/messages_list.dart';
import 'package:bubble_bottom_bar/bubble_bottom_bar.dart';
import 'HomePage.dart';

class BarDetail extends StatefulWidget {
  @override
  _BarDetailState createState() => _BarDetailState();
}

class _BarDetailState extends State<BarDetail> {
  int currentIndex;
  @override
  void initState() {
    super.initState();
    currentIndex = 0;
  }

  changePage(int index) {
    setState(() {
      currentIndex = index;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.only(top: MediaQuery.of(context).size.height * 0.8),
      child: BubbleBottomBar(
        opacity: 0.2,
        backgroundColor: Colors.white,
        borderRadius: BorderRadius.vertical(top: Radius.circular(16.0)),
        currentIndex: currentIndex,
        hasInk: true,
        inkColor: Colors.black12,
        hasNotch: true,
        fabLocation: BubbleBottomBarFabLocation.end,
        onTap: changePage,
        items: <BubbleBottomBarItem>[
          BubbleBottomBarItem(
              backgroundColor: Colors.red,
              icon: Icon(Icons.dashboard, color: Colors.black),
              activeIcon: Icon(Icons.dashboard, color: Colors.red),
              title: Text("Home")),
          BubbleBottomBarItem(
              backgroundColor: Colors.red,
              icon: Icon(Icons.favorite_border, color: Colors.black),
              activeIcon: Icon(Icons.dashboard, color: Colors.red),
              title: Text("Saved")),
          BubbleBottomBarItem(
              backgroundColor: Colors.red,
              icon: Icon(Icons.search, color: Colors.black),
              activeIcon: Icon(Icons.dashboard, color: Colors.red),
              title: Text("Search")),
          BubbleBottomBarItem(
              backgroundColor: Colors.red,
              icon: Icon(Icons.send, color: Colors.black),
              activeIcon: Icon(Icons.dashboard, color: Colors.red),
              title: Text("Messages")),
        ],
      ),
      
    );
  }
}

import'包装：flift/cupertino.dart'；
进口“包装：颤振/材料.省道”；
导入“包：tariffo/favoriteProviders.dart”；
导入“package:tariffo/messages_list.dart”；
导入“包装：泡泡底条/泡泡底条.省道”；
导入“HomePage.dart”；
类BarDetail扩展StatefulWidget{
@凌驾
_BarDetailState createState（）=>\u BarDetailState（）；
}
类BarDetailState扩展了状态{
int-currentIndex；
@凌驾
void initState（）{
super.initState（）；
currentIndex=0；
}
更改页（整型索引）{
设置状态（）{
currentIndex=索引；
});
}
@凌驾
小部件构建（构建上下文）{
返回容器(
填充：EdgeInsets.only（顶部：MediaQuery.of（context）.size.height*0.8），
孩子：泡泡壶(
不透明度：0.2，
背景颜色：Colors.white，
边界半径：边界半径。垂直（顶部：半径。圆形（16.0）），
currentIndex:currentIndex，
哈辛克：是的，
inkColor:Colors.black12，
哈斯诺克：是的，
fabLocation:BubbleBottomBarFabLocation.end，
onTap:changePage，
项目：[
泡底气压计(
背景颜色：Colors.red，
图标：图标（Icons.dashboard，颜色：Colors.black），
activeIcon:Icon（Icons.dashboard，颜色：Colors.red），
标题：文本（“主页”），
泡底气压计(
背景颜色：Colors.red，
图标：图标（Icons.favorite_边框，颜色：Colors.black），
activeIcon:Icon（Icons.dashboard，颜色：Colors.red），
标题：文本（“已保存”），
泡底气压计(
背景颜色：Colors.red，
图标：图标（Icons.search，颜色：Colors.black），
activeIcon:Icon（Icons.dashboard，颜色：Colors.red），
标题：文本（“搜索”），
泡底气压计(
背景颜色：Colors.red，
图标：图标（Icons.send，颜色：Colors.black），
activeIcon:Icon（Icons.dashboard，颜色：Colors.red），
标题：文本（“消息”），
],
),
);
}
}

---

这是我希望按钮打开的页面：FavoriteProviders（），MessageList（）

您应该有如下内容：

页面列表：

final List<Widget> _pages = [
  FavoriteProviders(),
  MessageList()
];

其中

\u bubbleBottomNavBar（）

是您的底部栏

或

将onTap上的

功能替换为：

BubbleBottomBar(
    opacity: 0.2,
    backgroundColor: Colors.white,
    borderRadius: BorderRadius.vertical(top: Radius.circular(16.0)),
    currentIndex: currentIndex,
    hasInk: true,
    inkColor: Colors.black12,
    hasNotch: true,
    fabLocation: BubbleBottomBarFabLocation.end,
    onTap: (index) {
     if(index == 1)
       Navigator.push(
         context,
         MaterialPageRoute(builder: (context) => FavoriteProviders()),
       );
     if (index == 2)
       Navigator.push(
        context,
        MaterialPageRoute(builder: (context) => MessageList()),
       );
     },
    items: <BubbleBottomBarItem>[
     [...]
    ]
)

BubbleBottomBar(
不透明度：0.2，
背景颜色：Colors.white，
边界半径：边界半径。垂直（顶部：半径。圆形（16.0）），
currentIndex:currentIndex，
哈辛克：是的，
inkColor:Colors.black12，
哈斯诺克：是的，
fabLocation:BubbleBottomBarFabLocation.end，
onTap：（索引）{
如果（索引==1）
导航器。推(
上下文
MaterialPage路由（生成器：（上下文）=>FavoriteProviders（）），
);
如果（索引==2）
导航器。推(
上下文
MaterialPage路由（生成器：（上下文）=>MessageList（）），
);
},
项目：[
[...]
]
)
另一种方法是使用
PageView
，创建一个
PageController
，并将其分配给名为
controller
的
PageView
的属性

控制器-
PageController\u controller=PageController（）

页面视图本身

PageView(
    controller: _controller;
    children: <Widget>[
        FavoriteProviders(),
        MessageList()
    ]
)

PageView(
控制器：_控制器；
儿童：[
FavoriteProviders（），
MessageList（）
]
)

因此，
FavoriteProviders（）
现在是索引0，
MessageList（）
现在是索引1
您可以在onTap中使用其中一个来导航到该页面

\u控制器。跳线页（索引）
或
controller.animateToPage（索引，持续时间：持续时间（毫秒：500），曲线：Curves.easeIn）

在持续时间和曲线中输入您想要的任何内容。
更新的答案：）我应该在哪里添加此onTap函数？我已经编辑了我的答案。或者您可以保留
changePage
功能，但删除
setState
和onTap。
PageView(
    controller: _controller;
    children: <Widget>[
        FavoriteProviders(),
        MessageList()
    ]
)