我有这个List view.builder
child: ListView.builder(
itemCount: coins.length,
itemBuilder: (BuildContext context, int index) {
return ListTile(
leading: iconsList[index],
title: Wrap(children: [
Row(children: [
Text(
coins[index],
style: const TextStyle(color: Colors.white),
),
Text(
value[index],
style: TextStyle(color: Colors.white),
),
]),
]),
subtitle: Align(
alignment: Alignment.bottomRight,
child: Text(
value[index],
style: TextStyle(color: Colors.white),
),
),
);
}),
在手机屏幕上显示时如下所示:
我想将欧元金额放在硬币找零上方的右上角,如下所示:
我应该如何将金额以欧元表示,以便它看起来像我显示的示例图像?
最佳答案
只需在Row
下使用mainAxisAlignment: MainAxisAlignment.spaceBetween
和crossAxisAlignment: CrossAxisAlignment.center,
,无需使用字幕,只需绑定(bind)右侧即可带有 Column
的侧边元素并根据需要更改文本样式
ListTile(
leading: Icon(Icons.add),
title: Wrap(children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text(
"coins[index]1",
style: const TextStyle(color: Colors.white),
),
Column(
children: [
Text(
"value[index]2",
style: TextStyle(color: Colors.white),
),
Text(
"value[index]3",
style: TextStyle(color: Colors.white),
),
],
)
]),
]),
)
输出:
关于flutter - 如何将行对齐到固定位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/70479880/