TabBar 是基本每个App都会使用到的一个控件,在官方内置的 TabBar 的高度只有两种规格且是不可修改的:
//未设置 Icon 时的高度
const double _kTabHeight = 46.0;
//设置 Icon 之后的高度
const double _kTextAndIconTabHeight = 72.0;
标题与Icon之间的距离也是写死的:
margin: const EdgeInsets.only(bottom: 10.0),
Tab高度/文本与Icon的距离 设置详见 class Tab 源码:
class Tab extends StatelessWidget {
const Tab({
Key key,
this.text,
this.icon,
this.child,
}) : assert(text != null || child != null || icon != null),
assert(!(text != null && null != child)),
super(key: key);
final String text;
final Widget child;
final Widget icon;
Widget _buildLabelText() {
return child ?? Text(text, softWrap: false, overflow: TextOverflow.fade);
}
@override
Widget build(BuildContext context) {
assert(debugCheckHasMaterial(context));
double height;
Widget label;
if (icon == null) {//当没有设置 Icon 时,Tab 高度 height 取值 _kTabHeight
height = _kTabHeight;
label = _buildLabelText();
} else if (text == null && child == null) {//当没有设置 text 和 child 时,Tab 高度 height 取值 _kTabHeight
height = _kTabHeight;
label = icon;
} else {//其它情况, Tab 高度 height 取值 _kTextAndIconTabHeight
height = _kTextAndIconTabHeight;
label = Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Container(
child: icon,
margin: const EdgeInsets.only(bottom: 10.0),//这里设置的是 text 和 Icon 的距离
),
_buildLabelText(),
],
);
}
return SizedBox(
height: height,
child: