Page 1 of 2

Add art borders to a square game.

PostPosted: Sun Nov 10, 2013 5:16 pm
by HacksawUnit
*Edit: This seems to be impossible to do with integer scaling as of version r148*

I would like images around my game instead of ugly black bars. Any tips?HacksawUnit2013-11-11 18:15:55

Re: Add art borders to a square game.

PostPosted: Sun Nov 10, 2013 6:13 pm
by TGeorgeMihai
Editing the file index.html should do the trick.
[QUOTE]<!-- All margins and padding must be zero for the canvas to fill the screen. -->
<style type="text/css">
     * {
          padding: 0;
          margin: 0;
     }
     body {
          background: #000;
          color: #fff;
          overflow: hidden;
          -ms-touch-action: none;
     }
          canvas {
               touch-action-delay: none;
               touch-action: none;
               -ms-touch-action: none;
     }
</style>[/QUOTE]
Replace background: #000 with background-image:url('your_image.png') .

More info here: http://www.w3schools.com/css/css_background.aspTGeorgeMihai2013-11-10 18:15:12

Re: Add art borders to a square game.

PostPosted: Sun Nov 10, 2013 6:32 pm
by HacksawUnit
That's very useful, thanks! My game will be a desktop application, though. Are there any workarounds for that? :-)

Re: Add art borders to a square game.

PostPosted: Sun Nov 10, 2013 11:47 pm
by HacksawUnit
Bump!

Re: Add art borders to a square game.

PostPosted: Mon Nov 11, 2013 12:39 am
by Sushin
Uh...If your game is going to be a desktop application then there will be no black bars...

Re: Add art borders to a square game.

PostPosted: Mon Nov 11, 2013 1:27 pm
by HacksawUnit
If the user resizes the window or enters fullscreen (which will be important because my game is very small pixel-wise), black bars appear.

Re: Add art borders to a square game.

PostPosted: Mon Nov 11, 2013 1:57 pm
by LittleStain
Just add the images you'd like at the sides of your playing field. The dotted line in the editor window.

I'm guessing you are using scale outer, so the images will appear when the window is wider than your project size.

Re: Add art borders to a square game.

PostPosted: Mon Nov 11, 2013 2:02 pm
by HacksawUnit
I am using integer scaling, and the fix you suggested did not work. :-(

Re: Add art borders to a square game.

PostPosted: Mon Nov 11, 2013 5:31 pm
by HacksawUnit
Bump.

Re: Add art borders to a square game.

PostPosted: Mon Nov 11, 2013 5:47 pm
by LittleStain
As you can read here black bars are normal with letterbox integer scale.
Using another scaling option it can be avoided, because you don't limit the scaling.
Probably you dont want other scaling because of pixel-art, if so, your "problem" can't be solved.