Flutter中如何缩小NavigationRail高度？容器高度固定为140像素

要在140px高度的容器内放下3个导航项的NavigationRail，核心是调整NavigationRail的内边距和项间距——默认的内边距和间距会导致整体高度超标，具体修改方案如下：

1. 压缩NavigationRail上下内边距 #

给NavigationRail添加padding属性，大幅减小顶部和底部的空白区域，比如设置为EdgeInsets.symmetric(vertical: 8)，直接降低整体占用高度。

2. 缩小导航项之间的垂直间距 #

通过Theme包裹NavigationRail，修改navigationRailTheme中的destinationSpacing，将默认的24px改为更小的值（比如8px），压缩项与项之间的距离。

3. 简化图标尺寸控制（可选） #

直接给Icon设置size属性，替代用Container包裹的方式，更简洁地控制图标大小。

修改后的完整代码示例 #

class PATWidget extends StatefulWidget {
  const PATWidget({super.key});

  @override
  State<PATWidget> createState() => _PATWidgetState();
}

class _PATWidgetState extends State<PATWidget> {
  int index = 0;

  @override
  Widget build(BuildContext context) {
    return Column(children: [
      Row(
        //Headline
      ),
      Row(
        children: [
          Column(
            children: [
              Container(
                height: 140,
                width: 30,
                child: Theme(
                  data: Theme.of(context).copyWith(
                    navigationRailTheme: NavigationRailThemeData(
                      destinationSpacing: 8, // 缩小项间距
                    ),
                  ),
                  child: NavigationRail(
                    padding: EdgeInsets.symmetric(vertical: 8), // 压缩上下内边距
                    selectedIconTheme:
                        IconThemeData(color: Theme.of(context).primaryColor),
                    unselectedIconTheme: IconThemeData(color: fumigruen_accent),
                    backgroundColor: Theme.of(context).scaffoldBackgroundColor,
                    labelType: NavigationRailLabelType.none,
                    selectedIndex: index,
                    onDestinationSelected: (index) =>
                        setState(() => this.index = index),
                    destinations: [
                      NavigationRailDestination(
                        icon: Icon(Icons.abc, size: 20),
                        selectedIcon: Icon(Icons.pin_drop, size: 20),
                        label: Text(""),
                      ),
                      NavigationRailDestination(
                        icon: Icon(Icons.abc, size: 20),
                        selectedIcon: Icon(Icons.abc, size: 20),
                        label: Text(""),
                      ),
                      NavigationRailDestination(
                        icon: Icon(Icons.abc, size: 20),
                        selectedIcon: Icon(Icons.abc, size: 20),
                        label: Text(""),
                      ),
                    ],
                  ),
                ),
              ),
            ],
          ),
          Expanded(
            child: buildPages(),
          ),
        ],
      )
    ]);
  }
}

如果调整后仍有轻微溢出，可以微调padding和destinationSpacing的数值（比如把垂直内边距改为6px，项间距改为6px），直到完全适配140px的容器高度。

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