Flutter TabBar下方白条隐藏
在Flutter中,TabBar 下方的白条通常是TabBar 的下划线,也就是Indicator。如果你想要隐藏这个白条,可以通过设置TabBar的indicatorWeight属性为0,或者设置indicator为一个透明的Decoration。
以下是隐藏TabBar下方白条的示例代码:
TabBar(
indicatorWeight: 0.0, // 设置为0,隐藏指示器的高度
indicatorColor: Colors.transparent, // 设置指示器颜色为透明
tabs: <Widget>[
Tab(text: 'Tab1'),
Tab(text: 'Tab2'),
// ...更多标签
],
)
如果你想要隐藏TabBar的全部下划线,包括所有标签,可以使用以下代码:
DefaultTabController(
length: 2, // 标签的数量
child: Scaffold(
appBar: AppBar(
bottom: TabBar(
indicator: const BoxDecoration(), // 设置为空Decoration隐藏指示器
tabs: <Widget>[
Tab(text: 'Tab1'),
Tab(text: 'Tab2'),
],
),
title: const Text('TabBar Example'),
),
body: const TabBarView(
children: <Widget>[
Center(child: Text('Tab1')),
Center(child: Text('Tab2')),
],
),
),
)
在这个例子中,我们使用了DefaultTabController来控制标签的数量,并且通过设置indicator为一个BoxDecoration(即一个空的Decoration)来隐藏整个TabBar的下划线。
评论已关闭