Scaling problem when adding group as Child

[skodone]

Hello everyone!

Ive been tinkering around happily with phaser CE now for my latest browser app.

I'm feature complete since yesterday and stumbled upon one last problem i cannot figure out how to address...

i tried a couple of things but do not understand why things behave like they do.

Basically i have a group of sprites, which i add as a child to another sprite.

Now the problem i have is, i calculate a scalefactor for my app to scale it accordingly to the browser/device size and 

the group seems to scale in a very weird way (the scaling is very inconsistent, on a super small window it gets scaled down super much, on scalefactors close to 1 it is ok...)

so what i do (i reduced the code to the affected lines):

 

class MapScreen extends Phaser.Sprite

  this.anchor.setTo(0.5, 0.5);
  this.mapSize = 0.52; //0.52
  this.scale.setTo(App.scaleFactor * this.mapSize);

  this.mapGroup = this.game.add.group();

  this.stationButtons = [];
  this.stationButtons.push(this.game.add.sprite(App.gameWidth/2 + (480 * App.scaleFactor), App.gameHeight/2 + (370 * App.scaleFactor), 'point1')); // Anfang 0

   // enable animations for buttons and add function
   for (let i = 0; i < this.stationButtons.length; i++) {
     this.stationButtons[i].anchor.setTo(0.5, 0.5);
     this.stationButtons[i].scale.setTo(App.scaleFactor * (this.mapSize + 1.8));
     this.stationButtons[i].animations.add("pulse", [0, 1, 2, 3, 4, 5, 6]);
     this.stationButtons[i].animations.play("pulse", 8, true);
     this.stationButtons[i].inputEnabled = true;
     this.stationButtons[i].input.useHandCursor = true;
     this.stationButtons[i].events.onInputDown.add(function(){this.stationClicked(i)}, this);
     this.mapGroup.add(this.stationButtons[i]);
    }

   this.addChild(this.mapGroup);

so, when i leave the last line and do not add the group to the MapScreen, its fine, but as soon as i do it it starts to scale weirdly...?!

And i cant figure out how to keep the scale the same when the scaleFactor changes...

 

Thanks in advance

[samme]

You're scaling the mapGroup members twice. They're already receiving a scale transformation from the MapScreen sprite.

[skodone]

hmm i tried that now... also a friend of mine suggested dividing the scale by the scalefactor of the parent.

Neither is giving me good results...

I think my main problem is that i do not understand what exactly happens when i add an object as a child. 

How exactly the transformation from global to local transformation works.

I tried this:

this.stationButtons.push(this.game.add.sprite((this.x/2) / this.scale.x, (this.y/2) / this.scale.y, 'point1'));

also dividing the whole thing through the parents scale and i tried it without dividing and only placing it according to the
parent with:

this.stationButtons.push(this.game.add.sprite(this.x/2 + 350, this.y/2 +370, 'point1')); // Anfang 0

everything still gives me in my eyes random results. I mean i do understand that its not random but i just dont understand how it works mathematically,

and why stuff gets offset so different everytime i scale the window....

 

 

oh my god.... i think i got it now... my brain was melting trying to wrap itself aroudn it in the most complicated ways... -.-

this.stationButtons.push(this.game.add.sprite(480, 370, 'point1'));

i removed every scale, multiplication every whatever and not it seems to work... sigh

 

ill test that now

thanks btw i wasnt seeing the trees from all the forest anymore...

[skodone]

and it works nicely... thanks samme

 

- closed-