且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

Flutter如何从“文本"小部件中删除不需要的填充?

更新时间:2022-06-15 09:51:38

最后我自己找到了解决方案.可以使用StackRow小部件定位.我发现Row的效果比使用Positioned更好,因为可以使用Row小部件将文本居中.

I found the solution myself in the end. It can be positioned using Stack and Row widgets. I found Row works better than using Positioned as the text can be centred using the Row widgets.

  body: Stack(
    children: <Widget>[
      Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Text(
            '0:00.00',
            style: TextStyle(fontSize: 76),
          ),
        ],
      ),
      Padding(
        padding: EdgeInsets.only(top: 56.0),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'Coke',
              style: TextStyle(fontSize: 76),
            ),
          ],
        ),
      ),
    ],
  )

类似于CSS中的负填充,但实际上填充是将底部文本向下而不是向上移动,因为否则它们将占据相同的空间.

It kind of works like the negative padding in CSS but actually it's the padding that moves the bottom text down rather than up since otherwise they occupy the same space.