颤抖如何从子窗口小部件更改父BottomNavigationBar索引

时间:2019-02-08 02:10:29

标签: user-interface dart flutter scaffold

因此,我最近开始了自己的第一个项目,我完成了完整的UI布局,现在正在做前端的整个逻辑部分,我的大多数onTap行为都在起作用,但是我遇到了以下情况我不知道该怎么解决。

我有四个包含所有UI的文件。
widget0.dart
widget1.dart
widget2.dart

这些文件每个都包含由BottomNavigationBar构建的StatefullWidget。

main.dart
该文件包含我的main()=> runApp类和函数。我的MaterialApp包含一个带有BottomNavigationBar的脚手架。这可以按预期工作,并且我可以在3个小部件之间进行切换。

但是在我的 widget0.dart 文件中,我有一个按钮,该按钮应将main.dart文件中BottomNavigationBar的索引从0更改为2(以便从widget2.dart构建小部件)。

我试图将保存导航栏索引的值包装在一个单独的静态类中,因此我可以在按钮onTap()中setState((){ StaticClass.index = 2}),但这不起作用,并且实际上冻结了导航栏恢复为其初始值。

在stackoverflow上某处的答案表明,每个小部件都应具有自己的脚手架和导航栏,但是我确信必须有一种更简洁的方法。

那么实现我的目标的最振奋人心的方法是什么?

谢谢。

1 个答案:

答案 0 :(得分:1)

您可以将函数作为参数传递给widget0,并且在该函数中可以像这样更改索引值:

class ParentWidgetState extends State<ParentWidget> {

  int _index = 0;

  void goToWidget2() {
    setState(() {
          _index = 2;
        });
  }

  Widget body() {
    switch(_index) {
      case 0: 
        return Widget0(goToWidget2);
        break;
      case 1: 
        return Widget1();
        break;
      case 2: 
        return Widget2();
        break;
    }
  }

  @override
    Widget build(BuildContext context) {
      return Scaffold(
        body: body(),
        bottomNavigationBar: BottomNavigationBar(
        currentIndex: _index,
        items: [
          BottomNavigationBarItem(
            icon: Icon(Icons.home),
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.home),
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.home),
          ),
        ],
      ),
      );
    }
}

class Widget0 extends StatelessWidget {
  Widget0(this.goToWidget2);
  final Function goToWidget2;
  @override
    Widget build(BuildContext context) {
      return Center(child: FlatButton(
        onPressed: goToWidget2,
        child: Text("Go To Widget 2"),
      ),);
    }
}
class Widget1 extends StatelessWidget {
  @override
    Widget build(BuildContext context) {
      return Center(child: Text("widget 1"),);
    }
}
class Widget2 extends StatelessWidget {
  @override
    Widget build(BuildContext context) {
      return Center(child: Text("widget 2"),);
    }
}