image.png
Flutter TabBar 在设置【isScrollable: true】后存在左侧边距和底部黑线
TabBar(
tabs: [
Text("第一个"),
Text("第2个"),
Text("第一个"),
Text("第一个"),
Text("第一个"),
Text("第一个"),
Text("第一个"),
],
controller: _tabController,
isScrollable: true,
)
去除方法
dividerHeight: 0,
tabAlignment: TabAlignment.start,
例子代码👇
TabBar(
dividerHeight: 0,
tabAlignment: TabAlignment.start,
tabs: [
Text("第一个"),
Text("第2个"),
Text("第一个"),
Text("第一个"),
Text("第一个"),
Text("第一个"),
Text("第一个"),
],
controller: _tabController,
isScrollable: true,
)
问题原因
image.png
左侧边距问题
TabBar源码中 如果 tabAlignment 不设置，默认是TabAlignment.startOffset，会使用【const double _kStartOffset = 52.0;】设置左侧偏移量52。导致左侧存在很大边距
底侧黑线问题
dividerHeight 和 dividerColor 可以设置线的高度和颜色，高度改成0 或者 将颜色改成透明即可
