如何在不使用应用程序栏的情况下创建标签栏? [英] how to create the tab bar without app bar in flutter?

问题描述

我希望在主屏幕上添加标签应用程序而不是应用程序栏.如何创建它.目前，我的标签栏已添加到应用程序栏的底部，并且我已删除了标题和高程.同时，我不能说appBar: null，因为我在标签栏顶部需要一些空间.

I wish to add the tab app instead of app bar on my home screen. How to create it. Currently, my tab bar added at the bottom of app bar and I have removed the title and elevation. At the same time, I can't say appBar: null as I need some space on the top of the tab bar.

Widget HomeTap = new Scaffold(

appBar: new AppBar(
bottom: new TabBar(

    indicatorColor: Colors.pinkAccent[100],
    labelColor: Colors.pinkAccent[100],
    indicatorWeight: 0.5,
    unselectedLabelColor: Colors.grey[400],
    tabs: [
      new Tab(text: 'Album',),
      new Tab(text: 'Artist'),
      new Tab(text: 'Playlist'),
      new Tab(text: 'Songs'),
      new Tab(icon: new Icon(Icons.search))
    ]),
title: null,
elevation: 0.0,
),
body: new TabBarView(
children: [
  new Center(
    child: new AlbumWidget(),
  ),
  new Container(),
  new Container(),
  new Container(),
  new Container(),
],
),
);

推荐答案

Flutter可与合成一起使用.您几乎可以用其他东西替换任何小部件.他们不仅限于一个特定的孩子.

Flutter works with composition. You can pretty much replace any widget with something else. They are not limited to one specific child.

所以你可以简单地做

new Scaffold(
   appBar: new TabBar(
      ...
   ),
   ...
)

唯一的要求是您的小部件必须具有正确的界面. 脚手架需要appBar和PreferredSizeWidget.

The only requirement is for your widget to be of the right interface. Scaffold requires as appBar a PreferredSizeWidget.

幸运的是，默认情况下TabBar已经是PreferredSizeWidget.因此无需更改

Fortunately, TabBar is already a PreferredSizeWidget by default. So no change needed

这篇关于如何在不使用应用程序栏的情况下创建标签栏?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！