Flutter中如何在Row组件内单独居中第二个Widget？

要让第二个Widget保持屏幕水平居中，同时另外两个Widget分别位于它的左右两侧，有两种简洁可靠的实现方式：

方法一：使用Row + Spacer #

通过在左右两侧添加Spacer组件，让它们自动填充屏幕剩余空间，从而确保中间的Widget始终处于屏幕中心：

Row(
  children: [
    Spacer(), // 填充左侧剩余空间
    LeftWidget(), // 左侧组件
    SizedBox(width: 16), // 可选：添加与中间组件的间距
    CenterWidget(), // 居中的中间组件
    SizedBox(width: 16), // 可选：添加与右侧组件的间距
    RightWidget(), // 右侧组件
    Spacer(), // 填充右侧剩余空间
  ],
)

原理：Spacer会平分左右两侧的可用空间，强制中间的Widget处于屏幕水平中心点，不受左右组件宽度的影响。

方法二：使用Row + Expanded + Center #

利用Expanded让中间的Center组件占据左右组件之外的所有空间，从而实现中间Widget的居中：

Row(
  children: [
    LeftWidget(), // 左侧组件
    Expanded(
      child: Center(
        child: CenterWidget(), // 居中的中间组件
      ),
    ),
    RightWidget(), // 右侧组件
  ],
)

原理：Expanded会拉伸中间区域的空间，内部的Center组件则将自身子Widget（即中间组件）定位在该区域的中心，也就是整个屏幕的水平中心。

两种方法都能完美满足需求，你可以根据是否需要给中间组件添加左右间距来选择对应的方案。

内容的提问来源于stack exchange，提问作者Jiehfeng