Flutter：如何让Column首项居顶，第二项垂直居中？

要让紫色图标和文字与黑色图标处于同一高度，问题核心是紫色分割线占据了垂直空间，导致图标文字整体下移。可以通过以下两种方式解决：

方法一：使用 Stack 布局（推荐） #

将分割线定位在图标文字的顶部上方，不占用图标文字的布局空间，确保图标位置与黑色组对齐：

Stack(
  alignment: Alignment.topCenter, // 分割线居中对齐
  children: [
    // 图标文字组，位置与黑色组完全一致
    const Column(
      children: [
        Icon(
          Icons.home,
          color: Colors.deepPurple,
        ),
        Text(
          'Strona główna',
          style: TextStyle(
              color: Colors.deepPurple
          ),
        )
      ],
    ),
    // 顶部紫色分割线，可调整top值控制与图标的间距
    Positioned(
      top: -10,
      child: Container(
        height: 4,
        width: size.width * 0.22,
        color: Colors.deepPurple,
      ),
    ),
  ],
),

方法二：抵消分割线的高度 #

通过负边距让图标文字向上移动，抵消分割线占据的空间：

Column(
  mainAxisAlignment: MainAxisAlignment.start,
  children: [
    Container(
      height: 4,
      width: size.width * 0.22,
      color: Colors.deepPurple,
    ),
    // 用负margin抵消分割线高度，让图标回到黑色组同一高度
    Container(
      margin: const EdgeInsets.only(top: -4),
      child: const Column(
        children: [
          Icon(
            Icons.home,
            color: Colors.deepPurple,
          ),
          Text(
            'Strona główna',
            style: TextStyle(
                color: Colors.deepPurple
            ),
          )
        ],
      ),
    ),
  ],
),

Stack 布局更灵活，适合后续样式调整；负边距方式简单直接，适合快速修复。

内容的提问来源于stack exchange，提问作者Karol Wiśniewski