Indie game storeFree gamesFun gamesHorror games
Game developmentAssetsComics
SalesBundles

When hosting a Unity WebPlayer game on Itch.io, I lose ~12 pixels.

A topic by Reverend Speed created Apr 15, 2018 Views: 237 Replies: 4
Viewing posts 1 to 5

12.5 pixels, according to Unity. =/

First off, Itch is wonderful. The following is more of a curiosity than a serious issue, but it niggles me. I hope someone can explain this to me...

I made an example project to demonstrate my problem - a Unity Webplayer of resolution 960 x 600, using a default WebGL template and hosted on Itch as an embed with the resolution auto-detected. The demonstration only has a single screen with a number of blank, coloured UGUI 'panel' objects inset on top of each other to illustrate usable space at the edge of the screen.

With these settings, the Itch frame shows my project with the default WebGL template (and accompanying full-screen button), but in so doing pushes the top of my webplayer above the viewable space of the frame. You can see the missing space (marked by a blue box on the top of the screen) by clicking on the full-screen button. Additionally, the Unity WebGL label is partially obscured by the bottom of the frame.

When the project is not full-screen, the blue box cannot be seen. When it is full-screen, all the game content is visible.

I can avoid this by switching the web template to 'minimal' in Unity, and I can add a 'full-screen' button on top of the playable area in my Itch hosting settings, but this does not resize the play area to scale to full-screen, ultimately only obscuring the web page and overlaying the game area at an offset.

Is there any way to tidy up the Itch page and clearly show the whole of the play area in addition to the Unity label and fullscreen button?

If my issue is beyond fixing, no harm, no foul, I can adapt to 12 pixels off the top (...but it looks untidy...!). I can't seem to find references to this problem,  so I'm making this thread - but if I've missed a bunch of discussions on this topic and it's a well-known problem with well-known solutions, then I'll apologise and slink back to my cave to implement that solution. =)

I've marked this as a question as I'm not sure if the problem is part of Itch or just my implementation.

Thanks for reading,

 --Rev

Admin(+1)

The web player doesn't seem to have reliable margins, so the auto size detection is off. You can manually set the size to anything you like from the game's edit page. Alternatively, you can edit the output HTML and make the page match the exact size.

Excellent answer, I'm an idiot, switching to Manually Set Size and adding 44 pixels to the height (so 600 => 644) gets me exactly what I want. Thank you, Leafo.

Admin

I updated our auto-size detection code to account for the recent markup changes on unity html5 exports so it should get the correct size now.

(1 edit)

Hey, that's amazing. Thanks so much. =)

 --Rev