Flutter 如何创建堆叠的标签栏？答案

【问题标题】：Flutter how can you create a stacked tab bar?Flutter 如何创建堆叠的标签栏？
【发布时间】：2019-03-26 01:54:18
【问题描述】：

我正在寻找创建一个堆叠的应用栏，包括规范。

appbar 的底部没有一列或任何允许我将两个标签栏堆叠在一起的小部件，所以我想知道是否有人已经这样做了。如果没有，我想是时候深入研究 tabBar 和 AppBar 并自己构建它了。谢谢大家

【问题讨论】：

【解决方案1】：

TabController tabController;
  TabController tabController2;

  @override
  void initState() {
    super.initState();
    tabController = TabController(length: 2, vsync: this);
    tabController2 = TabController(length: 3, vsync: this);
  }






@override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Title"),
        bottom: PreferredSize(
          child: Column(
            children: <Widget>[
              TabBar(
                controller: tabController,
                tabs: [
                  Tab(text: "BROWSE",),
                  Tab(text: "WATCHLIST",),
                ],
              ),
              TabBar(
                controller: tabController2,
                tabs: [
                  Tab(text: "TRADES",),
                  Tab(text: "STOCKS",),
                  Tab(text: "INSIDERS",),
                ],
              ),
            ],
          ),
          preferredSize: Size.fromHeight(80),
        ),
      ),
    );
  }

您可以根据需要设置preferredSize: Size.fromHeight(80) 值

【讨论】：