我试图创建一个没有AppBar的标签栏布局屏幕 . 我已经在这个链接上提到了解决方案:how to create the tab bar without app bar in flutter?但它对我不起作用 . 当我将TabBar放在 appbar:
参数中时,这是我的屏幕的样子:
我的TabBar已经移动到状态栏下方的左上角,并且它全部挤在一个角落里 . 这几乎就好像根本就没有 .
当我使用AppBar类但只传递 bottom:
参数时会发生以下情况:
TabBar顶部有一个丑陋的空间,显然是AppBar Headers . 这是我的代码:
return new Scaffold(
appBar: new TabBar(
tabs: widget._tabs.map((_Page page){
return Text(page.tabTitle);
}).toList(),
controller: _tabController,
isScrollable: true,
),
backgroundColor: Colors.white,
body: new TabBarView(
controller: _tabController,
children: widget._tabs.map((_Page page){
return new SafeArea(
top:false,
bottom: false,
child: (page.page == Pages.cart?new CartHomeScreen():_lunchesLayout())
);
}).toList()
),
);
如何在没有顶部的空间的情况下使用TabBar,是否可以使两个标签项及其指示器伸展并填充侧面空间?
1 回答
你的第一个截图实际上显示它工作得很好 - 问题是“好”并不是你所期望的 . 对于标签栏,默认文本颜色为白色,因此您的标签不显示,而只显示底线,这是您在左上角看到的 . 此外,TabBar已经是一个首选的大小小部件,但它与AppBar的高度不同,所以如果这就是你想要的,它看起来就不像了 .
这是一个让它看起来像应用栏的例子 .
kToolbarHeight
与AppBar使用的常量相同 .结果如下: