Flutter文本无法对齐到起始位置，嵌套Column后未生效如何解决？

根因说明 #

你代码中Rp. 10.000文本属于最外层Column的直接子节点，Flutter的Column组件默认交叉轴对齐属性为CrossAxisAlignment.center，因此价格文本会默认居中显示，和上层Row内已设置左对齐的Name文本无法对齐。

解决方法 #

方案一：修改外层Column全局对齐规则 #

给最外层Column添加crossAxisAlignment: CrossAxisAlignment.start配置，让其所有子元素默认沿左侧对齐，修改后的完整代码如下：

child: Column(
  // 新增此行配置
  crossAxisAlignment: CrossAxisAlignment.start,
  children: [
    Row(
      children: [
        Expanded(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(
                "Name",
                style: primaryTextStyle.copyWith(
                    fontSize: 18, fontWeight: semiBold),
              ),
              SizedBox(
                height: 8,
              ),
            ],
          ),
        ),
        Container(
          width: 18,
          height: 18,
          decoration: BoxDecoration(
            shape: BoxShape.circle,
            image: DecorationImage(
                image: AssetImage('assets/tripple_dot.png')),
          ),
        )
      ],
    ),
    Text(
      "Rp. 10.000",
      style:
          primaryTextStyle.copyWith(fontSize: 12, fontWeight: medium),
    )
  ],
)

方案二：单独给价格文本指定对齐规则 #

如果不想修改外层Column的全局对齐规则，也可以单独给价格文本包裹Align组件指定左对齐：

Align(
  alignment: Alignment.centerLeft,
  child: Text(
    "Rp. 10.000",
    style: primaryTextStyle.copyWith(fontSize: 12, fontWeight: medium),
  ),
)

内容的提问来源于stack exchange，提问作者Alifa Al Farizi