@override
Widget build(BuildContext context) {
return Container(
padding: EdgeInsets.symmetric(horizontal: 3,vertical: 1),
decoration: BoxDecoration(
color: widget.tagBackGroundColor,
borderRadius: BorderRadius.circular(3)),
child: Text(
widget.tagString,
textAlign: TextAlign.center,
style: TextStyle(color: widget.tagTextColor, fontSize: 10),
),
);
}
测试阶段发现,标签在不同的机器上,标签的样式都不一样。如果什么都不设置就会导致字体偏下。基于之前的React开发经验,基本可以确定是字体行高导致的问题。但是Flutter Text组件没有直接设置行高的地方,这就比较蛋疼,后来找到了解决方案,只需Text设置strutStyle,指定fontSize和外层style设置的字体一致就可以了。
child: Text(
widget.tagString,
textAlign: TextAlign.center,
strutStyle: StrutStyle(fontSize: 10),
style: TextStyle(color: widget.tagTextColor, fontSize: 10),
)
网友评论