• Hey Guest! Ever feel like entering a Game Jam, but the time limit is always too much pressure? We get it... You lead a hectic life and dedicating 3 whole days to make a game just doesn't work for you! So, why not enter the GMC SLOW JAM? Take your time! Kick back and make your game over 4 months! Interested? Then just click here!

[SOLVED] Problems with drawing and the screen orientation in Mobile + HTML5

N

Nathan Archer

Guest
SOLVED: It was related to drawing the surface. Just needed to stop accessing the code that drew the surface and it was okay.

Hi, I'm having problems with the way my app is drawing on mobile when accessed through a browser. I'm not entirely sure what's causing this behavior because up until this point I have no code that I can find that is causing this behavior. It's different in my main screen vs later rooms despite both rooms being the same size and despite not (knowingly) doing anything that would change the viewport.

When I switch the orientation in the main room it looks like this (stretched):


When I switch the orientation in the app later on, it looks like this (missing half of the screen):




I'd like it to look like the latter two, without half of the screen cropped out.

The only thing I've been using to change screen size is the following, copy-pasted from GM (see below). But I don't understand how this could possibly change the behavior since the room sizes are the same. I suspect that it's elsewhere but the only other code I have that changes the viewport and what not isn't called until I try to save the image, which works perfectly when done.

Is it possible drawing the surface is causing this? I have some of that in there for the same application on desktop, but I don't think that would explain this behavior either.

The only other thing I can suspect is that some view manipulation is getting called where I don't want it based on the room, however I wouldn't know which function to CTRL+F for, so if you have an idea which one could cause it to look like this, please advise :)

Code:
if (browser_width != width || browser_height != height)
    {
    width = browser_width;
    height = browser_height;
    canvas_fullscreen(base_size, width, height);
    }
Code:
/// canvas_fullscreen(base, browser_width, browser_height)
// argument0 = base value for scaling
// argument1 = the current browser width
// argument2 = the current browser height

view_wport[0] = argument1;
view_hport[0] = argument2;

window_set_size(argument1, argument2);
window_center();

var aspect = (argument1 / argument2);
if (aspect < 1)
    {
    view_hview[0] = argument0;
    view_wview[0] = (argument0 * aspect);
    }
else
    {
    view_hview[0] = (argument0 / aspect);
    view_wview[0] = argument0;
    }

surface_resize(application_surface, view_wview[0], view_hview[0]);
 
Last edited by a moderator:
Top