小程序去除导航栏让webview全屏显示的问题

Question

需求是想不使用小程序的标题栏而使用webview页面自身的标题栏，在小程序的配置中添加了navigationStyle: custom后去掉了小程序的标题栏(右侧的胶囊按钮依然保留)。正常的效果是这样的：

但很多手机的系统还是会在胶囊那里加上标题栏，导致webview页面无法顶到上面去铺满全屏：

还有一个问题是如上图，很多手机下面有虚拟导航栏，并且虚拟导航栏是浮动在页面上的，导致页面底部的内容被遮挡住了。比如我页面底部有个按钮，这个时候由于系统标题栏和虚拟导航栏的存在导致按钮看不见了。

请问有没有遇到类似情况的，如何解决？

Answer 1

6.6以上版本才支持navigationStyle，低版本铺不满没有什么办法。。。

至于虚拟导航栏，可以给页面加个 padding-bottom。