uni.getsysteminfosync().statusbarheight 返回设备状态栏实际像素高度(单位px),如iphone 14 pro为59px、部分安卓机为24px或28px,需在onload或onmounted中运行时获取,ssr或过早调用会返回null或错误值。

uni.getSystemInfoSync().statusBarHeight 返回的是什么
它返回的是设备状态栏实际像素高度(单位 px),比如 iPhone 14 Pro 是 59px,部分安卓机可能是 24px 或 28px。这个值不能硬写死,必须运行时获取;在 onLoad 或 onMounted 中调用才可靠,SSR 环境或过早执行会返回 null 或错误值。
uni.getMenuButtonBoundingClientRect() 的 top/bottom 怎么用
这个 API 返回胶囊按钮的布局矩形,关键字段是 top(胶囊上边缘距屏幕顶部距离)、bottom(下边缘距屏幕顶部距离)、height(胶囊自身高度)。注意:top 不等于状态栏高度,它包含状态栏 + 上方空隙;bottom - top 就是胶囊真实高度(通常为 32px 左右)。
-
top - statusBarHeight是状态栏底边到胶囊顶边的空隙(iPhone 14 Pro 约 6px,部分安卓机约 8px) -
bottom - statusBarHeight是状态栏底边到胶囊底边的垂直跨度(即“状态栏+上方空隙+胶囊自身”) - 导航栏总高度不是
statusBarHeight + 44,而是bottom + top - statusBarHeight—— 这个公式覆盖了所有机型,包括上下空隙不等的情况
padding-top 要设成多少才不遮挡内容
如果你要让页面主体内容避开状态栏 + 胶囊区域(比如给 .app-container 加 padding-top),直接用 bottom + top - statusBarHeight 的结果即可。这个值就是从屏幕顶部到胶囊底部的完整高度,也是自定义导航栏应占的垂直空间。
- 别用
(top - statusBarHeight) * 2 + height:它隐含“上下空隙相等”的假设,但 iPhone 14 Pro Max 和某些华为机型实测上下空隙差 2px,会导致内容轻微错位 - 别把
right或left当作宽度依据:它们受窗口缩放、安全区影响,不能反推高度 - H5 / App 端不需要这套逻辑:这些平台无胶囊,
getMenuButtonBoundingClientRect()不可用,应走条件编译分支
为什么 computed 里反复算会出错
因为 getMenuButtonBoundingClientRect() 在部分低端安卓机或微信旧版本中可能返回 null,且该 API 不支持响应式监听。一旦首次调用失败,后续依赖它的计算全崩。
- 务必加判空:
if (!menuRect || !menuRect.height) return 0 - 不要在
computed或watch里反复调用,只在生命周期钩子里取一次存到data或ref - 真机调试时,iOS 模拟器常返回错误的
top值(比如 0),必须用真机验证
实际最稳的 padding-top 计算就一行:menuButtonInfo.bottom + menuButtonInfo.top - statusBarHeight。其余任何简化公式,在 2026 年主流机型(尤其是带灵动岛或挖孔屏的设备)上都有概率导致顶部内容被截断或留白异常。











