uni-app中navigationStyle设为custom后标题栏不透明，需手动设置padding-top:var(--status-bar-height)、background-color:transparent，并避免下拉刷新时内容穿透；微信小程序不支持该配置，须条件编译。
uni-app 中 navigationStyle 设为 custom 后标题栏不透明？
不是配置没生效，而是 custom 只是「交出控制权」，并不等于「自动透明」。默认情况下，你写的 <view class="nav"> 仍会渲染在普通层级，被状态栏遮挡或与原生导航栏重叠，看起来像“没变”。
关键动作是：必须手动处理状态栏高度 + 设置背景透明 + 避免内容上滑覆盖。
- 在
pages.json里对目标页面设"navigationStyle": "custom" - 页面根容器加
padding-top: var(--status-bar-height)（注意不是固定20px） -
<view class="nav">的background-color必须为transparent，且不能有阴影或边框干扰视觉 - 如果用
uni-nav-bar，它默认带背景色，需显式设:background-color="transparent"
App 端状态栏高度拿不准，getSystemInfo 返回值不稳定？
iOS 和 Android 对状态栏定义不同：iOS 的 statusBarHeight 是真实像素高度；Android 多数机型返回 24 或 25，但全面屏/刘海屏下可能被系统拉高，且 H5 和小程序环境压根不返回该字段。
真正可靠的方式是用 CSS 变量 --status-bar-height —— 这是 uni-app 在 App 端注入的运行时变量，只在 custom 模式下可用，且已适配各平台。
- 不要在
onLoad里调uni.getSystemInfo取高度，时机太早，值可能为0 - 直接在样式中用
height: calc(var(--status-bar-height) + 44px)或padding-top: var(--status-bar-height) - 若需 JS 中使用，等
onReady后再取getComputedStyle(document.documentElement).getPropertyValue('--status-bar-height')
设置了透明导航栏，但下拉刷新时内容穿透、安卓状态栏变黑？
这是原生层叠加逻辑导致的：当开启下拉刷新（"enablePullDownRefresh": true），uni-app 会把 webview 整体下拉，而透明导航栏下的内容就直接露到状态栏区域，此时 Android 常因渲染顺序问题让状态栏背景变黑或闪烁。
根本解法不是调样式，而是约束行为边界：
- 下拉刷新期间禁用自定义导航栏的透明效果，比如加个 class：
:class="{ 'nav-transparent': !isPulling }"，配合onPullDownRefresh和stopPullDownRefresh控制 - 避免在
custom导航栏内放可滚动内容（如搜索框输入时弹软键盘），否则键盘顶起页面会破坏沉浸感 - 真机调试务必用正式打包的 IPA/APK，HBuilderX 的模拟器对状态栏渲染有偏差
微信小程序也能用这套配置？
不能。微信小程序不支持 navigationStyle: custom 下的状态栏变量 --status-bar-height，也不允许 webview 渲染到状态栏区域。即使写了，小程序基础库会忽略或报错 Invalid navigationStyle。
跨端项目里，必须条件编译：
- App 端用
#ifdef APP-PLUS包裹custom配置和透明逻辑 - 微信小程序走默认导航栏，或用
setNavigationBarColor配合浅色背景模拟“近似沉浸” - 别在
pages.json全局设navigationStyle，必须按 page 单独配，否则小程序编译失败
最麻烦的其实是安卓厂商定制系统——比如华为 EMUI 的“全面屏手势”会动态改变状态栏行为，这时候靠 CSS 变量也不保险，得监听 resize 事件做二次校准。不过多数业务场景，老老实实用 --status-bar-height 就够了。
