Scaling displaygroup

Solar2D General Questions/Discussion
#1

I’m trying this once again since the previous post didn’t get that much attention and I’m still facing this issue.

I’m experimenting with a “stacking” game, I want the entire scene (every displayobject) to appear more and more zoomed out as the game progresses and the stacked tower becomes higher. I’ve been trying to go about this by adding everything to a displaygroup and then I’ve scaled that group. This works and everything appears smaller but it messes with the positioning of said display objects. I’ve read somewhere that I would also need to scale the old x and y coordinates to new scaled x and y coordinates. If this is true can someone help me and point me in the right direction?

Also I’ve tried to scale every object separately, when doing that the objects keep their location but then I have to remove and add the physics bodies again causing the stacked tower to collapse.

Any help is greatly appreciated! :smiley:

#2

Scaling a group happens from the <0,0> coordinate of the group which is typically in the upper-left corner of the screen.
 
So downscaling the group (zooming out) will cause all of the group objects to move left and up.
 
If you want the content to stay in the center of the screen, move your group to the center of the screen and place objects accordingly.
 
What you’re essentially talking about here is a camera system, but an elaborate one.
 
I suggest you forget about the game temporarily and focus on learning the underlying display mechanics first.  Then apply them to your game idea.
 
What you want to do is straightforward, but not simple.  If the focus point never moves it is easy.  But as soon as the focus point moves, the problem becomes harder to grok till you have a stable foundation in how Corona display groups work and in the general math of scaling and translation.
 
This example shows some of the solution, but not all of it.
https://github.com/roaminggamer/RG_FreeStuff/raw/master/AskEd/2018/06/zoomingInAndOut.zip
 
https://www.youtube.com/watch?v=UXH7O0ttcQw&feature=youtu.be

Sorry about the audio! I forgot I had my microphone on. :frowning: You hear my wall clock and me clicking… ugh!

#3

Thank you! No worries about the audio in the video. What you showed is what I’m trying to achieve, I’ll take a look at the example and read some more about display groups. It’s getting late now so I’ll look more at this tomorrow and maybe I’ll come back if I have further questions :slight_smile:

#4

Your zoom works great itself as it is shown on video. But to my skills the code seems a bit complicated with all those SSKs. Anyway, on my project, I have background image and some images, that I want to be zoomed, using + and - buttons, working exactly like on your video. I just have problem with integrating my resources (some images) up to your code. Step by step, how to do that? What must I remove, change etc? Also, how to make feature of smooth scrolling between zoomed stuff with your finger, if it is possible?
Thanks for all help! :)) 

#5

Scaling a group happens from the <0,0> coordinate of the group which is typically in the upper-left corner of the screen.
 
So downscaling the group (zooming out) will cause all of the group objects to move left and up.
 
If you want the content to stay in the center of the screen, move your group to the center of the screen and place objects accordingly.
 
What you’re essentially talking about here is a camera system, but an elaborate one.
 
I suggest you forget about the game temporarily and focus on learning the underlying display mechanics first.  Then apply them to your game idea.
 
What you want to do is straightforward, but not simple.  If the focus point never moves it is easy.  But as soon as the focus point moves, the problem becomes harder to grok till you have a stable foundation in how Corona display groups work and in the general math of scaling and translation.
 
This example shows some of the solution, but not all of it.
https://github.com/roaminggamer/RG_FreeStuff/raw/master/AskEd/2018/06/zoomingInAndOut.zip
 
https://www.youtube.com/watch?v=UXH7O0ttcQw&feature=youtu.be

Sorry about the audio! I forgot I had my microphone on. :frowning: You hear my wall clock and me clicking… ugh!

#6

Thank you! No worries about the audio in the video. What you showed is what I’m trying to achieve, I’ll take a look at the example and read some more about display groups. It’s getting late now so I’ll look more at this tomorrow and maybe I’ll come back if I have further questions :slight_smile:

#7

Your zoom works great itself as it is shown on video. But to my skills the code seems a bit complicated with all those SSKs. Anyway, on my project, I have background image and some images, that I want to be zoomed, using + and - buttons, working exactly like on your video. I just have problem with integrating my resources (some images) up to your code. Step by step, how to do that? What must I remove, change etc? Also, how to make feature of smooth scrolling between zoomed stuff with your finger, if it is possible?
Thanks for all help! :))