麦狐人
麦狐人
  • 发布:2023-03-30 16:58
  • 更新:2024-10-24 19:52
  • 阅读:1375

【报Bug】在横屏的设备上把app底部导航栏隐藏(虚拟按键)后,打开页面出现高度异常(不能全屏显示)

分类:uni-app

产品分类: uniapp/App

PC开发环境操作系统: Mac

PC开发环境操作系统版本号: 12.5.1

HBuilderX类型: 正式

HBuilderX版本号: 3.8.12

手机系统: Android

手机系统版本号: Android 7.1.1

手机厂商: 商米

手机机型: T2

页面类型: vue

vue版本: vue2

打包方式: 云端

项目创建方式: HBuilderX

示例代码:
// 没有任何逻辑代码,就是简单的uni-app中自带的页面跳转  
uni.navigateTo()  

操作步骤:

从A到B再到C页面

预期结果:

最后出现全屏的红色C页面

实际结果:

最后出现红色C页面和底部48px的蓝色B页面,见附件

bug描述:

demo为3个干净的空页面ABC,背景色分别为黄色、蓝色、红色

在横屏设备上把app设置为霸屏模式(全屏,隐藏底部导航栏(虚拟按键) )后

app启动页为A,点击前往B页面,再点击前往C页面,跳转方式均为:navigateTo。

A和B页面都是满屏的背景色,但是最后C页面的高度并不是屏幕高度,少了48px,下面会多一个48px的高度显示了B页面的底部

我用uni.getWindowInfo分别在3个页面上打印,发现只有A页面的screenHeight和windowHeight是751,B和C页面的都是703,少了48px。

所以猜测是不是dcloud在获取屏幕高度的时候有问题,在全屏的这种情况下

2023-03-30 16:58 负责人:DCloud_Android_ST 分享
已邀请:

最佳回复

DCloud

DCloud

HBuilderX 4.31.2024102414-alpha 已修复。

  • z***@grjjr.com

    我的帖子 问啥一直没人回复。。。。

    2024-10-31 15:32

m***@qq.com

m***@qq.com

真他妈服了,这bug这么明显,翻了论坛,我翻到20年,20年都有人提出了,现在还没解决,真他妈垃圾,20年的那篇帖子说去掉跳转动画就好了,这也太恶心了,垃圾uniapp,里面解答的就会说 没有设备,没有设备,你他妈随随便便找个设备就能复现

  • 麦狐人 (作者)

    哈哈 冷静冷静。毕竟免费开源的东西,官方可能没精力管那么多。我是从APICloud转过来的,有点想简单了,大部分是好的,官方能力如何不了解,但是解决问题的速度确实不敢恭维。。

    2023-06-25 10:04

  • l***@qq.com

    我也正好遇到这个问题, 之前还有遇到过权限的问题, 很多他们也都是有方案的, 奈何文档上也没写出来, 论坛上也没啥人气

    2023-07-31 15:46

  • 麦狐人 (作者)

    回复 l***@qq.com: 解决了吗?

    2023-08-29 10:03

retrocode

retrocode - 现已加入旺旺大礼包全家桶

我给后来者填个坑, 我测试发现出现此类情况都是过早启用霸屏导致的, 如在启动第一个页面/App.vue 的onload中直接启动霸屏导致, 我反复调试后发现, 尽量往后挪延迟启动霸屏, 如给一个 500 毫秒的 settimeout 即可解决此类问题. 时间可以个人自己调试.

猜测是 uniapp 启动时在某处会提前计算 页面高度做类似缓存的操作. 导致后续页面高度全部异常

  • 俞19

    大哥,你说的霸屏是指全屏的意思吗

    2024-12-02 08:19

2***@qq.com

2***@qq.com

我一开始都怀疑我样式写的有问题,怀疑自己了,后来一查,真坑,8.9号遇到这破问题,这个低级的重大bug居然不修复

用了楼上的解决方式,勉强解决了
跳转前A页面plus.navigator.showSystemNavigation(),将虚拟按钮显示,重新计算屏幕高度
目标B页面出现后再次隐藏虚拟按钮hideSystemNavigation,就可以了

缺点,跳转时下方有闪烁,勉强接受

yuje

yuje

现在解决了吗

DCloud_Android_ST

DCloud_Android_ST

测试项目提供下 和操作步骤

  • 麦狐人 (作者)

    最新回复下已经给出源码及视频

    设备开启全屏(霸屏模式)下

    2023-05-31 16:55

  • DCloud_Android_ST

    回复 麦狐人: 收到 我们这边需要一段时间寻求设备

    2023-05-31 17:07

  • DCloud_Android_ST

    回复 麦狐人: 我这边平板设备没有“霸屏模式”配置项 我将应用设置全屏 但是为能复现你的描述的问题 你那边有其他设备可以复现问题吗

    2023-06-01 15:38

  • 麦狐人 (作者)

    回复 DCloud_Android_ST: 我们有设备可以复现,如果需要配合,可以随时联系

    2023-06-07 10:00

  • DCloud_Android_ST

    回复 麦狐人: 提供下QQ或者钉钉即时通讯

    2023-06-07 11:22

  • 麦狐人 (作者)

    回复 DCloud_Android_ST: QQ:124552053

    2023-06-14 15:57

麦狐人

麦狐人 (作者)

源码及操作视频见附件

Mainzxx

Mainzxx

我也碰到了,一直没等到官方来处理

星星不怕黑

星星不怕黑

20年那个帖子好像就是我发的。解决办法就是使用关闭式跳转uni.reLaunch() 不要使用uni.navigateTo() @Mainzxx

  • Mainzxx

    感谢回复,uni.reLaunch() 是可以,目前看来只能用这个办法了

    2023-11-21 11:10

失去梦想的咸鱼

失去梦想的咸鱼

遇到同样的问题,工业用的安卓系统。

1***@163.com

1***@163.com

解决了没 我也遇到了

  • 2***@qq.com

    我这边有一个设备,在安卓系统上设置自动隐藏导航按钮。进入程序之后,我发现用手指从下向上滑动,唤出导航按钮,然后导航按钮会挤压一下页面,然后等导航自动隐藏之后,页面会恢复原状。然后这个程序在关闭之前都不会再出现底部有留白的问题,你看要不要试一下。如果可以的话,我这边的解决方案就是,让程序启动的时候通过代码自动的唤醒导航按钮,然他去挤一下页面。

    2024-01-28 17:20

  • 2***@qq.com

    回复 2***@qq.com: 我感觉我这边能正常的最终原因,应该是程序启动了之后页面被导航按钮挤过,也就是说程序完全启动之后,会再次去获取视窗的高度。我这边似乎在进入首页之后,再去隐藏导航按钮也能解决这个问题。

    2024-01-28 17:34

m***@qq.com

m***@qq.com

已经转flutter了,稳定好用,谷歌出品,性能不需要考虑,插件也够,唯一需要的就是要自学一段时间,uniapp就做做html了

7***@qq.com

7***@qq.com

结合大家上面提供的解决方案,我都一一试过了,还是有问题

1.使用uni.reLaunch()虽然可以满屏,但系统自带的返回键就失效了

2.让程序启动的时候通过代码自动的唤醒导航按钮,然他去挤一下页面,在App.vue里onLaunch方法里调用plus.navigator.showSystemNavigation() //显示系统虚拟按键(导航栏),不起作用

3.uni-app官方真的是很多坑,反馈了还得不到解决,一直拖延

  • DCloud_Android_ST

    方便内侧一下吗 方便的话可以提供下QQ

    2024-08-13 18:50

  • 7***@qq.com

    回复 DCloud_Android_ST: 719816921

    2024-08-20 08:52

  • 7***@qq.com

    我目前暂时的解决方案是去掉跳转动画就好了,直接使用默认的uni.navigateTo(),跳转某个页面,页面底部就会出现显示BUG

    2024-08-20 08:56

1***@qq.com

1***@qq.com

经过测试,关闭页面进入动画后没有产生问题,所以目前应该是动画检测页面高度导致的,希望官方能尽快修复。@uni-ad客服

  • DCloud_Android_ST

    方便内侧一下吗 方便的话可以提供下QQ

    2024-08-13 18:18

1***@163.com

1***@163.com - 大家好

啥时候修复啊

一只眠羊

一只眠羊

24年了解决了吗

  • 1***@163.com

    没解决 只能把跳转动画关了将就用

    2024-10-10 13:44

要回复问题请先登录注册