Flutter-无法使用FAB代替TabBar图标来更改选项卡

时间:2018-10-16 07:24:03

标签: dart flutter

我正在尝试制作一个小型Notes应用程序,但我的想法是,与其在应用程序的创建部分中使用其他页面,不如使用其他选项卡,该选项卡只能由主屏幕中的“添加”工厂访问。 。我也希望这样,当您按下按钮后,它变成一个“后退”按钮,带您回到带有注释列表的原始页面。

class HomePage extends StatefulWidget {
  const HomePage({Key key}) : super(key: key);
  static final _myTabbedPageKey = new GlobalKey<HomePageState>();
  @override
  HomePageState createState() => HomePageState();
}

class HomePageState extends State<HomePage> with SingleTickerProviderStateMixin {
  TabController tController;
  @override
  void initState(){
    super.initState();
    tController = new TabController(vsync: this, length: 2,);
  }

  @override
  void dispose(){
    tController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("NoteMe"),
      ),
      body: Container(
        child: TabBarView(
          physics: NeverScrollableScrollPhysics(),
          controller: tController,
          children: <Widget>[
            new ListPage(),
            new CreationPage(),
          ],
        )
      ),
      floatingActionButton: actionButton(tController),
      floatingActionButtonLocation: FloatingActionButtonLocation.endDocked,
      bottomNavigationBar: BottomAppBar(
        shape: CircularNotchedRectangle(),
        child: Row(
          children: <Widget>[
            new Container(
                child: IconButton(
              icon: Icon(Icons.search),
              onPressed: () {},
            )),
          ],
        ),
      ),
    );
  }
}


//Implementing the ADD/RETURN Button as func
FloatingActionButton actionButton(TabController tC){
  bool isListPage = true;
  goToCreation(){
    if(isListPage == true){
      tC.animateTo(tC.index+1);
      isListPage = false;
    }
    else{
      tC.animateTo(tC.index - 1);
      isListPage = true;
    }
  }
  FloatingActionButton theButton = FloatingActionButton(
        backgroundColor: kColorPink,
        elevation: 2.0,
        child: isListPage == true ? Icon(Icons.add) : Icon(Icons.arrow_back),
        onPressed: goToCreation(),
  );
  return theButton;
}

如您所见,显示的fab由上面的函数返回,该函数也将tabcontroller作为参数。运行此程序时未收到任何错误消息。它根本行不通。我试过不通过tabController而是通过类似的方式访问它     HomePage._myTabbedPageKey.tController.animateTo(...)

我在另一篇文章中找到的

,但是那是当我收到一条错误消息,指出诸如在null上调用tController之类的消息时。 对不起,如果我格式化得不够好。这是我的第一篇文章

1 个答案:

答案 0 :(得分:0)

可能是对 tc 或事件 goToCreation 的引用为空。

您可以在方法中放置一个断点,并检查是否调用了该方法以及 tc 对象是否不为空。