RichText 小部件在文本中内置了垂直填充答案

【问题标题】：RichText widget has vertical padding built into the textRichText 小部件在文本中内置了垂直填充
【发布时间】：2021-04-15 16:55:20
【问题描述】：

我有一个 RichText 小部件，它显示像“5:21”这样的时间，其中分钟以粗体显示，而秒则不是。

我正在使用小部件检查器工具来观察文本的边界。

RichText 小部件的区域在文本上方和下方有大量内边距（例如顶部和底部 10 dp）。在水平面上，根本没有填充，该区域紧贴字体的边缘。使用 RichText 时如何使区域紧贴字体的顶部和底部？

return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        RichText(
          textAlign: TextAlign.center,
          text: TextSpan(
            children: <TextSpan>[
              TextSpan(
                text: "$minutes:",
                style: textStyle,
              ),
              TextSpan(
                text: "$seconds".padLeft(2, '0'),
                style: textStyle.copyWith(fontWeight: FontWeight.w100),
              ),
            ],
          ),
        ),
        Text(
          "time",
        ),
      ],
    );

【问题讨论】：

请分享您的代码片段

标签： flutter flutter-layout

【解决方案1】：

试试这个

Container(
              padding: EdgeInsets.symmetric(horizontal: 16, vertical: 10),
              child: RichText(
                textAlign: TextAlign.center,
                text: TextSpan(
                  children: <TextSpan>[
                    TextSpan(
                      text: "$minutes:",
                      style: textStyle,
                    ),
                    TextSpan(
                      text: "$seconds".padLeft(2, '0'),
                      style: textStyle.copyWith(fontWeight: FontWeight.w100),
                    ),
                  ],
                ),
              ),
            ),
            Text(
              "time",
            ),

【讨论】：