How yo Enter to Fullscreen on mobile?

#1

I was trying to go full screen on mobile after a ‘demo’ event. I tried to do it with this but it’s still not possible hidde navigation bar And enter to Fullscreen mode
:disappointed_relieved:

Fullscreen.prototype.initialize = function() {
    
    this.app.on('demo', function () {
        
   ////// ///full-screen    
    app.enableFullscreen(canvas, function () {
        console.log('Now fullscreen');
    }, function () {
        console.log('Something went wrong!');
    });
#2

Not all browsers support this. (Mobile especially)

#3

If it is for your use or the use of a particular group over which you have some control/influence, you might consider using a so-called “kiosk” browser such as this one for Android:

For end users and the general public, the problem seems to defy solution. For the life of me I don’t understand why that’s the case given that the ability to have a full-screen display seems MOST important on a handheld, mobile device where there is less real estate available.

#4

Ok thanks. Is a diferencia solution, but is usefull now.

#5

Is the script written correctly?

#6

canvas is probably undefined in the code you have written. Just had a quick go myself here: https://playcanvas.com/editor/code/609498?tabs=18804537

Project: https://playcanvas.com/editor/scene/733295

Seems to work fine on desktop.

#7

Thanks for putting that together.

Works fine on Android Chrome.
Works on iPad Safari, but distorts aspect ratio
Fails on iPad Chrome and Firefox

#8

Further note: The product configurator demo posted by Leonidas works and fails on the same mobile platforms - though without the aspect ratio distortion issue (which is probably because the Yaustar’s project is set to fill the window in the render setttings.)

#9

About the stretching issue, it’s fill window that we use as well.

It’s not a canvas issue, but something with how iOS sizes iframes and reports back the width and height.

I agree the Playcanvas container page with the embedded iframe should be fixed at some point. The stretching issue has been there for so long.

If your are self hosting and embedding it as an iframe using CSS (absolute positioned container) you can have it fixed.