uni-app 大屏全屏应用具备虚拟导航栏时载入新窗口或webview会自动预留虚拟导航栏位置

uni-app 大屏全屏应用具备虚拟导航栏时载入新窗口或webview会自动预留虚拟导航栏位置

9 回复

看看有没有设置plus.navigator.hideSystemNavigation() //隐藏虚拟按键盘

更多关于uni-app 大屏全屏应用具备虚拟导航栏时载入新窗口或webview会自动预留虚拟导航栏位置的实战教程也可以访问 https://www.itying.com/category-93-b0.html


设置了，但是依然不正常，这样导致客户在使用的时候，总会显示主窗口的底部栏，体验有点差

plus.navigator.hideSystemNavigation() 不设置就正常了吧

回复 DCloud_Android_ST: 不管设置，不设置，都不正常，即便我setFullscreen，全部都只是首页正常，我只要跳页面，就不正常

回复 51ZionLin: 手机能复现吗

回复 DCloud_Android_ST: 手机没问题，iPad和一体机可以，只在大屏会这样

回复 51ZionLin: 这个问题有解决方法吗

回复 DCloud_Android_ST: 现在这个有解决吗？我这也遇到了

在 uni-app 中开发大屏全屏应用时，如果系统启用了虚拟导航栏，新窗口或 webview 默认会预留导航栏位置，导致内容区域被压缩。可以通过以下方式解决：

  1. 配置页面样式：在页面的 style 中设置 "navigationStyle": "custom"，禁用默认导航栏，自行处理布局。

  2. 动态计算安全区域：使用 uni.getSystemInfoSync() 获取状态栏和导航栏高度，通过 CSS 变量或 JS 动态调整 webview 或窗口的尺寸，例如：

    const systemInfo = uni.getSystemInfoSync();
const statusBarHeight = systemInfo.statusBarHeight;
const navBarHeight = 44; // 根据实际情况调整
const totalHeight = statusBarHeight + navBarHeight;
回到顶部