每行文本背景颜色之间的空间？答案

【问题标题】：Space between background color of text on each line?每行文本背景颜色之间的空间？
【发布时间】：2022-12-23 11:19:11
【问题描述】：

我已经设置了文本小部件的背景颜色，但如果有多行，则颜色在行之间连接。我希望颜色在文本的每一行之间都有空间。

【问题讨论】：

标签： flutter dart

【解决方案1】：

我用棘手的方式解决了这个问题！带有下划线的字体，它会造成差距。

Container(
   color: Colors.red,
   child: Text("Ask Me Anything. but this text will wrap because it's long",
     style: TextStyle(
     fontWeight: FontWeight.w800,
     fontSize: 32,
     height: 1.8,
     color: Colors.transparent, // => 4. remove original text
     backgroundColor: Colors.black,
     decoration: TextDecoration.underline,
     decorationColor: Colors.red, // => 1. make a underline with same color with background. in this case, red.
     decorationThickness: 6, // 2. modify a underline thickness by font "height" so it cover gap between lines.
     shadows: [Shadow(color: Colors.white, offset: Offset(0, -15))] // => 3. make a shadow for making duplicated text on upper side 
 )),

这个解决方案仍然有问题。行与行之间的空格不能修改。此代码仅取决于高度。

但无论如何你都可以得到差距。

【讨论】：

【解决方案2】：

你在行内有空格，你可以将每个文本分隔到它自己的小部件并将它们添加到一个列，你可以在其中设置主题之间的空格 sizedBox ：

        Column(
          children: <Widget>[
            Text("Ask me"),
            SizedBox(height: 20),
            Text("Anything"),
          ],
        ),

还有更多解决方案，您可以使用RichText widget ：

    Text.rich(TextSpan(children: [
          TextSpan(text: "Ask me"),
          TextSpan("
"),
          TextSpan(text: "Anything"),
        ])),

【讨论】：

这不是一个可能的解决方案。文本是动态的，将由用户输入。

【解决方案3】：

我假设您使用 paint() 作为文本背景。

如果是这样，您可以尝试文本行高，它可能会解决您的问题。

【讨论】：

我在 TextStyle 对象上使用 backgorundColor 属性。更改行没有任何作用。