Resize Sprite/Container with children - the proper way?!

[jinzo7]

Hello, nerds ! Happy v.5 release also !
 

So I`m making pinch to resize(zoom like), stretch and shrink(which is basicly resizing to constant values) over class that extends Sprite or Container. I`m not defently sure what I should extend. 

My class has methods resize(newWidth, newHeight), stretch() and shrink() . For ease I will call the class Player which extends Sprite or Container with the 3 additional methods. 

Everything was okay when the parent was Sprite with texture. Then I had to add as child different sprites. So the composition went complex and the algorithm went to the trash.

The composition is:

• Player - extends Sprite or Container, methods resize(newW, newH), reposition(newX, newY), stretch(), shrink(); 
  • Background1 -  extends Sprite, has texture; visible only when stretch() is called; size - 50x50
  • Background2 - extends Sprite, has texture; visible only when shrink() is called; size - 100x100
  • Video - extends Sprite, has texture; always visible; initial size - 500x500
  • Label - extends Sprite, has texture; visible some times only; size - 70x70
    •  Text 

1. At the begining the Player instance has to be shrinked. So the size has to be 50x50. If user tab it, it has to stretch with size 100x100.

2. If user use pinch when it is stretched it has to resize.

The question is: 

In my methods resize(newWidth, newHeight), stretch() and shrink() which children I have to scale, change width and height and so on. 

Where the factors are -  the Background sprites are with different sizes and changing its visibility and the Video sprite is with bigger size than the need.

 

Additional(useless):

I tried a lot of things but there is no success. And maybe I`m wrong with something small. If the problem is not clearly defined I`ll make changes! Thank you very much !

 

[ivan.popelyshev]

Yeah, we know of that problem. We even want to make example like that soon, because v5 is ready and its time to cover it with tutorials.

Its difficult to make if you dont understand how exactly PixiJS Transform works (almost the same as Flash transform). `width` and `height` are secondary calculated properties, be vary cautious if you use them! If you dont know how exactly PixiJS reflects "I want this element to have 100px width" - dont use it.

There's no layout engine inside PixiJS.

There are hundreds of ways to make a mistake in your case. My telepathy doesnt give any answers except "he uses "width" somewhere wrongly", maybe you should post the full demo. Again, the time of response depends on how clear you make it. Big demo = wait for a month before someone gets it. Small obfuscated demo = week. Small demo = day or two.

[jinzo7]

21 minutes ago, ivan.popelyshev said:

Yeah, we know of that problem. We even want to make example like that soon, because v5 is ready and its time to cover it with tutorials.

Its difficult to make if you dont understand how exactly PixiJS Transform works (almost the same as Flash transform). `width` and `height` are secondary calculated properties, be vary cautious if you use them! If you dont know how exactly PixiJS reflects "I want this element to have 100px width" - dont use it.

There's no layout engine inside PixiJS.

There are hundreds of ways to make a mistake in your case. My telepathy doesnt give any answers except "he uses "width" somewhere wrongly", maybe you should post the full demo. Again, the time of response depends on how clear you make it. Big demo = wait for a month before someone gets it. Small obfuscated demo = week. Small demo = day or two.

Thanks for the answer !

I will continue to try tomorrow and will post some demo next days regardless of the success/fail.