Flutter 在多行中对齐文本

Posted 2023-02-23

【中文标题】Flutter 在多行中对齐文本

【英文标题】：Flutter align text in multiple rows

【发布时间】：2021-12-30 13:32:16

【问题描述】：

我有这张卡：

这是一行的代码（我有6行）：

Row(
  mainAxisAlignment: MainAxisAlignment.spaceBetween,
  children: [
    ClipOval(
      child: Container(
        height: 20,
        width: 20,
        color: Colors.lightBlue,
      ),
    ),
    Text('Example 1'),
    Text('96\'')
  ],
),
SizedBox(height: 8),
...

这些行位于容器内的列内（全部包装在卡片中） 我应该改变什么以获得照片中显示的结果

我想要什么： 我怎样才能做到这一点？

【参考方案1】：

您可以使用Expanded 和Spacer 来实现这种行为。 只需将您的 Row 更改为以下内容

Row(
      children: [
        ClipOval(
          child: Container(
            height: 20,
            width: 20,
            color: Colors.lightBlue,
          ),
        ),
        const Spacer(),
        Expanded(
          child: Text(text1),
        ),
        Expanded(
          child: Text(text2),
        ),
      ],
    )