UnrealEngineHTML5 / Documentation

530 stars 181 forks source link

Fullscreen button or rescaling does not work in the browser #77

Open Joohansson opened 3 years ago

Joohansson commented 3 years ago

I followed the documentation and any game I try works fine in HTML5, but not going fullscreen. Resizing the browser window just crop the canvas, not doing any rescale. However, this demo works fine using the same browser.

https://epiclearningresources.000webhostapp.com/ActionRPG/ActionRPG-HTML5-Shipping.html

Tried with chrome and brave. Firefox does not work for me, just gives "ReferenceError: SharedArrayBuffer is not defined".

Any ideas? I get this message in the console when resizing: Resizing canvas from 1083x609 to 1083x609. Previous GL viewport size was 0,0,944,528, so autoResizeViewport=false

I use non-compressed build while the demo above uses gzip. Maybe that's the reason? However, I can't figure out how to get gzip working on my apache webserver.

taufiq-dev commented 3 years ago

If you're fine with fullscreen in window mode (basically fullscreen in browser), go to your projectName.UE4.js file

Find this code in the resizeCanvas function:

var cssWidth = canvasRect.right - canvasRect.left;
var cssHeight = Math.max(minimumCanvasHeightCssPixels, canvasRect.bottom - canvasRect.top, window.innerHeight * minimumCanvasHeightFractionOfBrowserWindowHeight);

Change it to this:

var cssWidth = window.innerWidth;
var cssHeight = window.innerHeight;
Joohansson commented 3 years ago

@taufiqsun Thanks for the tip! I had to abandon my project though due to #67