I’ve gone through the various older posts on a similar subject, but seem unable to find a working solution.
When changing orientation on safari on iOS the screen canvas doesn’t properly adjust, and results in a ‘squished’ canvas (when using FillWindow and Auto Resolution). It seems like on Safari it doesn’t account for the browser header/foot correctly when calculating the window height after orientation change? It does seem to correctly get the dimensions if refreshing/reloading the whole window.
Any idea on workaround?
This is due to the window width and height changing after the orientation and resize events on iOS Safari. I can’t reproduce this on iOS 14 but I assume it is related.
The way I’ve seen to get around it is to force a DOM reflow a few times after the orientation change as seen here:
It can be added as file in project like so: https://playcanvas.com/editor/scene/1153495
If using the publish build link, please use the iframeless version where an
/e is added before the
eg https://playcanv.as/p/eFAeNR4O/ -> https://playcanv.as/e/p/eFAeNR4O/
There’s a bunch of fixes/workarounds/refactor that I’m intending to do over the next month or so related to this type of thing.