三星Galaxy S23（Android 15 + One UI 7）底部系统导航栏溢出适配咨询

嗨，我看到你在三星Galaxy S23（Android 15 + One UI 7）上遇到了底部系统导航栏导致应用内容溢出的问题，而且已经尝试用SafeArea来处理了，我来给你几个实用的调整思路：

• 优化SafeArea的使用方式
  你现在用SizedBox固定了80的高度，这其实不够灵活——毕竟One UI的导航栏高度可能和标准Android有差异，固定数值很容易适配失效。不如直接把SafeArea套在页面的最外层（比如Scaffold外面），或者至少作为底部导航栏的父容器，让它自动识别系统安全区域的高度：

SafeArea(
  bottom: true,
  top: false,
  left: false,
  right: false,
  child: Scaffold(
    // 你的页面主体内容
    bottomNavigationBar: MyBottomNavBar(
      onItemSelected: controller.onMenuSelected,
      selectedIndex: controller.selectedIndex,
    ),
  ),
)

这样SafeArea会自动给底部留出刚好的空间，不用硬写固定高度。

• 用MediaQuery获取精确的底部安全边距
  如果还是需要手动控制布局高度，可以通过MediaQuery拿到设备的底部安全区域数值，适配One UI的自定义导航栏：

final bottomSafePadding = MediaQuery.of(context).padding.bottom;

SizedBox(
  height: controller.isVisible.value ? (kBottomNavigationBarHeight + bottomSafePadding) : 0,
  child: MyBottomNavBar(
    onItemSelected: controller.onMenuSelected,
    selectedIndex: controller.selectedIndex,
  ),
)

这里kBottomNavigationBarHeight是Flutter自带的默认底部导航栏高度，加上系统的底部安全边距，就能完美贴合不溢出。

• 试试Scaffold的extendBody属性
  如果你的页面有底部导航栏，还可以开启Scaffold的extendBody: true，让页面内容延伸到导航栏下方，再结合SafeArea确保内容不被遮挡：

Scaffold(
  extendBody: true,
  bottomNavigationBar: SafeArea(
    bottom: true,
    child: MyBottomNavBar(
      onItemSelected: controller.onMenuSelected,
      selectedIndex: controller.selectedIndex,
    ),
  ),
  body: // 你的页面主体内容
)

你可以先试试第一种方法，这种是最省心的适配方式，应该能解决你遇到的溢出问题～

内容来源于stack exchange