Impact

This forum is read only and just serves as an archive. If you have any questions, please post them on github.com/phoboslab/impact

1 decade ago by BennyT

Hi all,

After downloading the latest build and looking at the new jump and run platformer game - I am having some trouble with the dynamic screen size and the level I have built in weltmeister.

my tilesize is 64 and the dimensions are 40 x 20. Therefore my level is 2560 wide and 1280 height.

But it doesn't work out right on a smaller screen size.

I have looked through the code and cannot figure out how he gets it looking so go no matter the screensize.

Any understanding of the logic would be great!

1 decade ago by dominic

The size of the your level shouldn't matter at all for the screen and viewport size.

What do you mean with "But it doesn't work out right on a smaller screen size."? What do you see? What did you expect to see?

Make a screenshot maybe :)

1 decade ago by BennyT

Hi Dominic,

Sorry for the lack of clarity, I have a screenshot attached

/><br /> <br /> So hopefully this makes a bit more sense.<br /> <br /> 1. I took the code that grabs the window.width and window.height<br /> 2. I built the attached demo level in weltmeister (i have been playing around with sizes).<br /> 3. On my macbook air, obviously there is not enough width and height to fill the screen, so there is lots of empty space in my game.<br /> <br /> I had a look at the new demo game, and the weltmeister level is really big to cover the big screens pixel counts.<br /> <br /> But how does it scale down when I am running the demo game on a smaller screen? Or scale up to fill the bigger screens?<br /> <br /> Hopefully that clarifies it some more! </div> </div> <div class=

1 decade ago by collinhover

ImpactJS does not scale dynamically by itself, you'll need to direct it to do that. I've usually just hooked into the resize event in my game's init method:

var myGame = ig.Game.extend({
init: function () {
   // init code here
   // such as level loading
   // then we listen for a resize event
   ig.global.addEventListener('resize', this.resize.bind(this), false);
},
resize: function () {
   // now we ask the system to resize
   // for example, fit the level in the screen
   var width = ig.global.innerWidth;
   var height  = ig.global.innerHeight;
   // note here that we're comparing
   // the current window width/height
   // to our expected width/height of 320 x 240
   // and forcing the value to an integer no less than 1
   var scale = Math.floor( Math.max( Math.min( width / 320, height / 240), 1 ) );
   ig.system.resize( width / scale, height / scale, scale );
}
});

or, even better, you should debounce the resize so you only resize the game once after the browser has stopped resizing for some time, because resizing is very expensive:

ig.global.addEventListener('resize', debounce(this.resize.bind(this), 0.5), false);

where debounce is some function you've defined and 0.5 is the delay. For more info on debouncing, check out https://github.com/collinhover/impactplusplus/blob/master/lib/plusplus/helpers/utils.js#L346

(p.s. I should note that the new jump and run platformer with v1.23 does not scale dynamically with screen size, so perhaps I'm misunderstanding your question).
Page 1 of 1
« first « previous next › last »