【发布时间】：2021-03-13 08:39:50
【问题描述】：
布局被定义为傻瓜：
Flexible(child: new Container(
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
child: Row(
children: <Widget>[
Padding(
padding: EdgeInsets.only(right: 8.0),
child: Text(categoryIcon,
style: TextStyle(
color: Colors.lightBlue,
fontFamily: 'Fontawesome',
fontWeight: FontWeight.normal))),
Flexible(
child: Text(categoryName,
maxLines: 3,
style: TextStyle(
color: Colors.lightBlue,
fontWeight: FontWeight.normal))),
Text("#33088",
style: TextStyle(
color: Colors.black26,
fontWeight: FontWeight.normal))
]),
padding: EdgeInsets.only(
bottom: 3.0, left: 8.0, top: 10.0, right: 5.0),
),
Padding(
child: Text(title,
maxLines: 3,
overflow: TextOverflow.ellipsis,
style: TextStyle(
fontWeight: FontWeight.normal, fontSize: 16)),
padding: EdgeInsets.only(
bottom: 3.0, left: 8.0, top: 10.0, right: 5.0),
),
Padding(
child: new Text(address,
style: TextStyle(fontStyle: FontStyle.normal)),
padding: EdgeInsets.only(
bottom: 10.0, left: 8.0, top: 10.0, right: 5.0),
),
Visibility(
child: Padding(
child: new Text("⬤ " + statusName,
style: TextStyle(
fontStyle: FontStyle.normal,
color: HexColor(statusColor))),
padding:
EdgeInsets.only(bottom: 10.0, left: 8.0, top: 0.0),
),
visible: type == ResponseMessageType.MESSAGE_TYPE_EVENT ||
type == ResponseMessageType.MESSAGE_TYPE_MY_EVENT,
)
],
),
));
我得到了结果：
所以总是当第二行小部件（标签）是文本包装时，标签右对齐，如果不是，标签根本不对齐。如果我尝试：
Row(
children: <Widget>[
Padding(
padding: EdgeInsets.only(right: 8.0),
child: Text(categoryIcon,
style: TextStyle(
color: Colors.lightBlue,
fontFamily: 'Fontawesome',
fontWeight: FontWeight.normal))),
Flexible(
child: Text(categoryName,
maxLines: 3,
style: TextStyle(
color: Colors.lightBlue,
fontWeight: FontWeight.normal))),
Spacer(),
Text("#33088",
style: TextStyle(
color: Colors.black26,
fontWeight: FontWeight.normal))
])
当标签文本未换行时，我得到的标签换行不正确并且标签仍然没有右对齐：
我需要我的列表看起来像第一张图片，但标签“#33088”需要始终右对齐，无论类别标签是否被包裹。类别标签在没有剩余空间的情况下需要包裹，也由“#33088”标签占用。
如何正确地做到这一点？
[编辑]
部分基于以下回复，它看起来有效：
Row(
children: <Widget>[
Padding(
padding: EdgeInsets.only(right: 8.0),
child: Text(
categoryIcon,
style: TextStyle(color: Colors.lightBlue, fontFamily: 'Fontawesome', fontWeight: FontWeight.normal))),
Flexible(
child: Row(
children: [
Flexible(
child: Text(categoryName,
maxLines: 3,
style: TextStyle(color: Colors.lightBlue, fontWeight: FontWeight.normal)),
),
],
)),
Visibility(
visible: type == ResponseMessageType.MESSAGE_TYPE_EVENT,
child: Expanded(
flex: 0,
child: Text("#" + id, style: TextStyle(color: Colors.black26, fontWeight: FontWeight.normal)),
),
)
])
（抱歉，现在包含一些逻辑）。但我对此并不满意，尤其是，我不明白我为什么需要这个：
Flexible(
child: Row(
children: [
Flexible(
child: Text(categoryName,
maxLines: 3,
style: TextStyle(color: Colors.lightBlue, fontWeight: FontWeight.normal)),
),
],
)),
如果我用单个 Flexible 代替：
Flexible(
child: Text(categoryName,
maxLines: 3,
style: TextStyle(color: Colors.lightBlue, fontWeight: FontWeight.normal)),
)
再次 #id 标签未对齐。包含单个 Flexible 的行，再次用 Flexible 包装，它似乎正在工作。
【问题讨论】：
标签： flutter layout alignment row