我是 flutter 的新手,最近我遇到了一个场景,我必须不恰本地对齐行中的元素。我有 3 个子元素,我们称之为 A、B 和 C。我的要求是将 A 和 B 放在行的最左边,将元素 C 放在最右边。
我的代码:
Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
CircleAvatar(
backgroundImage: NetworkImage(''),
radius: 30,
),
SizedBox(
width: 10,
),
Flexible(
child: Text('name', overflow: TextOverflow.ellipsis,),
),
SizedBox(
width: 10,
),
Container(
child: ButtonTheme(
height: 25.0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(100.0)),
child: RaisedButton(
child: Text(
'Challenge',
style: TextStyle(color: Colors.white, fontSize: 12),
),
onPressed: () {},
),
),
),
],
),
任何人都可以帮我解决这个问题。提前致谢。
最佳答案
用 Expanded 小部件包裹您的文本,并将文本小部件的 textAlign 设置为 TextAlign.start,如下代码所示:
Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
CircleAvatar(
backgroundImage: NetworkImage(''),
radius: 30,
),
SizedBox(
width: 10,
),
Expanded(
child: Text(
'name',
overflow: TextOverflow.ellipsis,
textAlign: TextAlign.start,
),
),
SizedBox(
width: 10,
),
Container(
child: ButtonTheme(
height: 25.0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(100.0)),
child: RaisedButton(
child: Text(
'Challenge',
style: TextStyle(color: Colors.white, fontSize: 12),
),
onPressed: () {},
),
),
),
],
),
关于flutter - 在 flutter 行/列中独立对齐元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61578849/