Flutter：多行文本小部件上的空间过多

Question

我的文本小部件受到具有 BoxConstraints 的容器的约束，并且我注意到当文本有多行时，由于溢出而存在多余的间距（在右侧）。

去掉样式后，此代码很简单：

Container(
  constraints: BoxConstraints(maxWidth: MediaQuery.of(context).size.width * (2/3)),
  child: Padding(
    padding: const EdgeInsets.symmetric(vertical: 15, horizontal: 20),
    child: Text(
      message
    ),
  ),
)

您可以看到文本右侧的空格。看看覆盖图，看起来这就是预期的行为，但是有什么方法可以限制 Widget 删除多余的空间吗？

Answer 1

您正在寻找属性：textWidthBasis。设置它TextWidthBasis.longestLine，文本宽度将根据longestLine删除右侧的空白区域来调整大小。

Text("Why don't you I set up an appointment and we can discuss this further...",
                  textWidthBasis: TextWidthBasis.longestLine,),

完整代码：

class MultiLinee extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Container(
          color: Colors.grey,
          child: Container(
            constraints: BoxConstraints(maxWidth: MediaQuery
                .of(context)
                .size
                .width * (2 / 3)),
            child: Padding(
              padding: const EdgeInsets.symmetric(vertical: 15, horizontal: 20),
              child: Container(
                color: Colors.yellow,
                child: Text("Why don't you I set up an appointment and we can discuss this further...",
                  textWidthBasis: TextWidthBasis.longestLine,),
              ),
            ),
          ),
        ),
      ),
    );
  }
}