Flutter:容器中的文本居中而不是左对齐
Flutter: Texts in container are centered instead of left-aligned
我想在容器中显示几行文本。文本以 AutoSizedText 形式编写,因此它们可以超过一行。所有文本都应该左对齐,所以我使用 textAlign: TextAlign.left。但如果容器中有多个AutoSizedText,文本将居中显示,而不是左对齐。
有人知道我的错误是什么吗?
new Container(
width: double.infinity,
margin: const EdgeInsets.all(30.0),
padding: const EdgeInsets.all(10.0),
decoration: BoxDecoration(
border: Border.all(width: 3),
borderRadius: BorderRadius.all(Radius.circular(5.0)),),
child: Column(
children: <Widget>[
AutoSizeText("Title", textAlign: TextAlign.left, overflow: TextOverflow.ellipsis,
maxLines: 20,),
AutoSizeText("Date: 01.01.2000", textAlign: TextAlign.left,
overflow: TextOverflow.ellipsis, maxLines: 20,),
AutoSizeText("Author: John Doe", textAlign: TextAlign.left,
overflow: TextOverflow.ellipsis, maxLines: 20,),
AutoSizeText("This is the message which should be displayed.",
textAlign: TextAlign.left, overflow: TextOverflow.ellipsis, maxLines: 20,),
]))
发生这种情况是因为 Column 的 crossAxisAlignment
属性,默认情况下 居中
read this in offcial docs
要解决此问题,请在 Column
、
中写入以下代码
Column(
crossAxisAlignment = CrossAxisAlignment.start
...
)
找到完整的solution here gist
输出:
我想在容器中显示几行文本。文本以 AutoSizedText 形式编写,因此它们可以超过一行。所有文本都应该左对齐,所以我使用 textAlign: TextAlign.left。但如果容器中有多个AutoSizedText,文本将居中显示,而不是左对齐。
有人知道我的错误是什么吗?
new Container(
width: double.infinity,
margin: const EdgeInsets.all(30.0),
padding: const EdgeInsets.all(10.0),
decoration: BoxDecoration(
border: Border.all(width: 3),
borderRadius: BorderRadius.all(Radius.circular(5.0)),),
child: Column(
children: <Widget>[
AutoSizeText("Title", textAlign: TextAlign.left, overflow: TextOverflow.ellipsis,
maxLines: 20,),
AutoSizeText("Date: 01.01.2000", textAlign: TextAlign.left,
overflow: TextOverflow.ellipsis, maxLines: 20,),
AutoSizeText("Author: John Doe", textAlign: TextAlign.left,
overflow: TextOverflow.ellipsis, maxLines: 20,),
AutoSizeText("This is the message which should be displayed.",
textAlign: TextAlign.left, overflow: TextOverflow.ellipsis, maxLines: 20,),
]))
发生这种情况是因为 Column 的 crossAxisAlignment
属性,默认情况下 居中
read this in offcial docs
要解决此问题,请在 Column
、
Column(
crossAxisAlignment = CrossAxisAlignment.start
...
)
找到完整的solution here gist
输出: