dart - 改变 AppBar 的高度

Question

我正在开发一个 Flutter 应用程序。在此应用程序中，我在应用程序栏中使用了 TabBarController。我没有为 AppBar 使用图标和标题，所以高度显示的超出预期。我需要帮助才能达到所需的尺寸。我正在使用以下代码:

class Dashboard extends StatefulWidget{
  @override
  State<StatefulWidget> createState() => new _DashboardState();
}

class _DashboardState extends State<Dashboard> with SingleTickerProviderStateMixin{

  final List<Tab> myTabs = <Tab>[
    new Tab(text: 'page1.',),
    new Tab(text: 'page2.'),
  ];

  TabController _tabController;

  @override
  void initState() {
    super.initState();
    _tabController = new TabController(length: 3, vsync: this
    );
  }

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: new AppBar(
        bottom: new TabBar(
          indicatorSize:TabBarIndicatorSize.tab,
          controller: _tabController,
          tabs: myTabs,
          labelStyle: styleTabText,

        ),
      ),
      body:  new TabBarView(
        controller: _tabController,
        children: myTabs.map((Tab tab) {
          return new Center(
              child: new Text(
                  tab.text
              )
          );
        }).toList(),
      ),
    );
  }
}

另外，为了引用，我添加了应用程序的屏幕截图。

Answer 1

您可以使用 PreferredSize调整 TabBar 的高度:

  @override
  Widget build(BuildContext context) {

    TabBar _tabBar = new TabBar(
      indicatorSize:TabBarIndicatorSize.tab,
      controller: _tabController,
      tabs: myTabs,
      labelStyle: styleTabText,
    );

    return Scaffold(
      appBar: new AppBar(
        bottom: PreferredSize(
          preferredSize: Size.fromHeight(_tabBar.preferredSize.height - 50),
          child: _tabBar,
        ),
      ),

      // (...)

    );
  }