avoid the address bar on Android?

Get help using Construct 2

Post » Sun Aug 19, 2012 10:57 pm

Have a game targeted at the android platform with 480x800 (e.g. the HTC desire or Samsung Galaxy S II).

I set the project and layer width and height to 480x800, and set the fullscreen mode to letterbox scale.

When I view the game on the handset via the built in LAN preview on port 50000, or if I export the files to a normal webserver on port 80, The game comes out wrong as it keeps the address bar at the top, and so puts a big black stripe on the right hand side.

When I go to any other website with the handset, after a few seconds the address bar slides off the top to give the page the entire screen. ive tried probably 100+ sites, mobile and normal, and they all do this except the one generated by the construct 2 system. How is the construct 2 breaking it, when all other sites work?

I have tried all combinations of:
Clear Background
Full Screen in Browser

Any ideas how to fix? It looks terrible.


B
15
S
5
G
2
Posts: 357
Reputation: 3,691

Post » Sun Aug 19, 2012 10:58 pm

Also, it doesnt center the game - the letterbox scale is putting the content on the left, and the black bar on the right. On any PC browser, it centers it. Any ideas how to get this working on Android?
B
15
S
5
G
2
Posts: 357
Reputation: 3,691

Post » Mon Aug 20, 2012 9:08 am

I am not entirely sure that android browser can have no address bar. However after some google fu.

"
function hideAddressBar(){
if(document.documentElement.scrollHeight<window.outerHeight/window.devicePixelRatio)
    document.documentElement.style.height=(window.outerHeight/window.devicePixelRatio)+'px';
setTimeout(window.scrollTo(1,1),0);
}
window.addEventListener("load",function(){hideAddressBar();});
window.addEventListener("orientationchange",function(){hideAddressBar();});"

From http://stackoverflow.com/questions/4068559/removing-address-bar-from-browser-to-view-on-android

As for your size on the fullscreen browser. ok. I could be wrong, but after reading a number of tutorials on the site for C2 about mobile devices; here is your answer.

C2 for mobile devices does not support a 1:1 screen ratio. No matter what choice you use and resolution you set your program cannot and will not be app size wise be 1:1 across all devices :(

The best option that I found is to create the game layout larger than your screen resolution. Then adapt the UI and object spacing to being cropped. As the tutorial suggests is to follow the TV/Movie method. Record in widescreen and crop the edges for older box TV models.

I could be wrong on all of this, but this is as I understand how it is now. So i'm hoping others will now chime in on better ways to do it :)
B
87
S
18
G
9
Posts: 2,455
Reputation: 14,834

Post » Mon Aug 20, 2012 12:23 pm

[QUOTE=jayderyu] I am not entirely sure that android browser can have no address bar. [/QUOTE]

Interestingly most sites on android browser display no address bar once loaded, e.g. will-hill.mobi, or www.google.co.uk

Some sites have the address bar glued to the page after loading, including any game generated by construct 2, www.bbc.co.uk, and even htc.com

I assumed the problem was a bug in construct 2, but perhaps I was hoping too much for out of the box android support.

Thanks for the js. how does one go about putting custom JS like this into the page generated by the export process? Does one just edit the exported pages each time?

I can also try using charles proxy to analyse the difference between sites that work and dont work, but most of the minify the js, so it may not be possible.

Thanks for the help!
B
15
S
5
G
2
Posts: 357
Reputation: 3,691


Return to How do I....?

Who is online

Users browsing this forum: R0J0hound, randomly, spcsmrf and 25 guests