gpt4 book ai didi

Flutter Wrap 小部件内的 Row 小部件

转载 作者:行者123 更新时间:2023-12-04 13:09:24 25 4
gpt4 key购买 nike

我想实现这种行为。我在一行中有 4 个项目,但我希望中间的两个文本就像 Wrap 小部件中的 yare 和 text2如果 text1 移动到下一行很长并填充所有空间。
enter image description here
这是我的代码,但它溢出而不是将文本包装成两行


Widget _buildItem(String name, String status) {
return Container(
padding: const EdgeInsets.all(Dimens.unitX2),
child: Row(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
Container(
width: Dimens.unitX5,
height: Dimens.unitX5,
color: Colors.blue,
),
SizedBox(width: Dimens.unitX1),
Wrap(
crossAxisAlignment: WrapCrossAlignment.center,
alignment: WrapAlignment.spaceBetween,
spacing: Dimens.unitX1,
direction: Axis.horizontal,
children: [
Text(name),
Text(status),
],
),
SizedBox(width: Dimens.unitX1),
Container(
color: Colors.red,
width: Dimens.unitX5,
height: Dimens.unitX5,
),
],
),
);
}

最佳答案

包裹 Wrap Flexible 中的小部件:

...
Flexible(
child: Wrap(
crossAxisAlignment: WrapCrossAlignment.center,
alignment: WrapAlignment.spaceBetween,
spacing: 30,
direction: Axis.horizontal,
children: [
Text('Text1'),
Text('Text2 is a long text'),
],
),
),
...

关于Flutter Wrap 小部件内的 Row 小部件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/67177147/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com