如何使用“文本”小部件设置多行文本？

Question

我试图以多行显示文本，我的意思是这样的：

“我是一条短信

我在这里完成”

当我尝试执行此操作时，我看到一条条显示“右侧溢出443像素”。我有这个UI结构：

@override
  Widget build(BuildContext context) {
    return Card(
        child: Scaffold(
          body: Row(
            mainAxisSize: MainAxisSize.min,
            children: <Widget>[
              Column(
                children: <Widget>[
                  Container(
                    padding: EdgeInsets.all(15.0),
                    child: Image.asset('images/place.png'),
                  )
                ],
              ),
              Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  Container(
                      padding: EdgeInsets.fromLTRB(0.0, 0.0, 0.0, 15.0),
                      child: Text(
                        _placeCard.description,
                        style: TextStyle(),
                        softWrap: true
                      )
                  )
                ],
              ),

            ],
          ),
        )
    );
  }

_placeCard.description类似于：“自1500年代以来，当未知的打印机拿起一个厨房类型并将其打乱到时”

有人可以帮助我还是给我任何反馈？

Answer 1

Text使用Flexible小部件包装小部件。

喜欢，

//updated read: aziza comment
  Flexible(//newly added
    child: Container(
      padding: EdgeInsets.fromLTRB(0.0, 0.0, 0.0, 15.0),
      child: Text(
        _placeCard.description,
        style: TextStyle(),
        softWrap: true
      ),
    )
  )

以下链接中的一个简单示例：

https://gist.github.com/Blasanka/264510a0e7e5aaa151f02ada19fd466d

更新：

上面的解决方案包装了Text小部件，但是在您的问题代码片段中，问题是您Column在Row 中使用了两个s，并且没有添加约束。因此，Column使用Flexible小部件包装这两个小部件的简单解决方案。

像下面一样

Row(
  mainAxisSize: MainAxisSize.min,
  children: <Widget>[
    Flexible(
      child: Column(
      //...
      ),
    ),
    Flexible(
      child: Column(
      //...
      ),
    ),
  ],
),