3.7.3 IOS17.1.2中Safari转屏后ui适配不正常

Creator 3.x
#1

  • Creator 版本： CocosCreator 3.7.3

  • 目标平台： H5web safari

  • 手机型号： iphone13pro， ios 17.1.2

  • 手机浏览器：safari

  • 编辑器操作系统：win11

  • 重现概率：100%可重现

  • 适配设置：1280 * 720 适配宽度

导出h5web，在新版本的ios的safari上，正常显示为图1
横屏 转 竖屏 再转 横屏，会出现整个ui显示区域缩小成一小块， 如图2.
再转回竖屏，ui就显示一半，如图3
旧版本的safari是正常的，有人有相同的情况吗？

photo_2023-12-13_16-10-13 (2)
photo_2023-12-13_16-10-46
photo_2023-12-13_16-10-13

#2

自己顶一下

#3

先设置朝向 cc.view.setOrientation
再设置 cc.view.setDesignResolutionSize
再设置 cc.view.setFrameSize
相同的代码，手机扫二维码预览有问题，直接打web包测

#4

可是我是打包时候锁了横屏，没有用代码setOrientation，这个问题，无论是预览还是打包出来都百分百复现

#5

手机开了自动旋转屏幕

#6

对的，但是cocos内锁横屏，手机自动旋转后，不是应该也是画布横屏显示吗？之前版本的safari也是正常的，只有更新ios系统后的新版本safari中会出现这个问题

#7

屏幕旋转后你打印下cc.view.getFrameSize()大小

#8

还有就是看你怎么横屏适配竖屏了，
你横屏是 1280 * 720 要把横屏的画面旋转后，在竖屏完整的显示出来，不介意上下黑一块的话，canvas 的 FitWidth 和 FitHeight 都改成 false

#9

我将canvas 的 FitWidth 和 FitHeight 都改成 false，打印了下cc.view.getFrameSize()
启动时后横屏frameSize是340 * 750，如图1
转到竖屏再转回横屏，frameSize是177 * 390了，小了将近一倍，如图2，所以出现了问题中横屏ui变小的问题了
975026cee10f53b7026ccdeccb2a51a

8cf7fde8f4e56b105519409320d34f8

#10

补充一个信息，只有在新版本的safari是这样的，同一个iphone上面的edge，firefox，chrome都没问题

3.7.3旋转问题
#11

再顶一下，等解决方案

1赞
#12

3.8.1中也是同样的问题

#13

image
需要修改引擎源码
我这边把这个延时增大为500就没问题了

1赞
#14

不知道有没有不修改源码的方法

#15

大哥牛皮啊…

#16

6啊！！！

#18

不修改源代码的情况下，我这样改了，是有效果。
let dispatch_event = true

window.addEventListener("orientationchange", (event: any) => {

    if (dispatch_event) {

        setTimeout(()=>{

            let event = document.createEvent("HTMLEvents")

            event.initEvent("orientationchange", true, true)

            window.dispatchEvent(event)

            dispatch_event = true

        },400)

        dispatch_event = false

    }

});
1赞
#19

又解决了 这么解决的