• Hey Guest! Ever feel like entering a Game Jam, but the time limit is always too much pressure? We get it... You lead a hectic life and dedicating 3 whole days to make a game just doesn't work for you! So, why not enter the GMC SLOW JAM? Take your time! Kick back and make your game over 4 months! Interested? Then just click here!

Make Objects of Different Scales Line Up at Screen X Center as Parallax Across Screen

I need objects with different scales to move at the same speed off-screen, but change speed and position so that later the horizontal center of their sprites line up in the middle of the screen if the objects were placed at the same x coordinate in the Room Editor. Creating parallax, but allowing things to be placed so they come at predictable times that you can them line up without parallax changing the timing. The game only scrolls forward, never backward.

I think this is how it could work in principle below, but I can't figure out the programming formula.

Sprites

-different sizes(move at same speed on screen)
-horizontal centered images because it probably makes screen centering easier
-largest sprite might be screen sized at scale of 1, smallest might be 32*32 at scale of 1

Objects

-different scales(move at different speed onscreen)

-a scale of 1 would not jump at all it's properly aligned by definition
-probably scales of 1,0.75,0.5,0.25 would be common, but I'd like it to do any scale

-each jumping position once when approaching the screen
if a smaller scale to catch up before they go slower
to meet at the horizontal center of the screen
-probably means a sprite with smaller scale jumps
greater distance toward screen border when it is
further away from it than sprite with greater scale

Scrolling Speed

-changeable in game
-when block start moving at different speeds their speed would be scale*scroll_speed

I'm sure this would work in principle, but I can't seem to nail the formula programming.
 

obscene

Member
I've done similar however I don't use scale, it's all depth-based. It's been a while, and I probably can't explain it well, but here's how my game is set up.

First, my camera handles all parallax scrolling of objects and every object is parallaxed according to it's depth. My player is at depth 0 and everything less than 0 is foreground and everything greater than 0 is background. I also have a 'safe zone' between 20 and -20 where no objects are parallaxed and that's where all the interactive stuff is placed as to not mess up collisions and such. Importantly, this is where the camera is.

There are two steps. When I enter a room, everything has to best to intial positions, again based on their depth, so the foreground stuff spreads out and the background stuff closes in, all with a horizon point at the center of the view. It looks something like this...

Code:
     // Objects in -20 to 20 are unaffected
    if abs(depth)>20 
        {
        // Multiply objects's depth by depthfactor
        var depthoffset=(depth*obj_camera.depthfactor);   
        
        // Recalculate positions     
        x=x-(x-view_wview*.5)*depthoffset       
        y=y-(y-view_hview*.5)*depthoffset
    
        }
So the depthfactor variable is important here as it just give me a number to tweak the 'strength' of the effect based on how deep the room is. I use .003 in most cases but in tigher quarters I may decrease that just so the background seems closer. So, in this code, everything is moved based on it's position from the center of the view multipled by the object's own depth and the 'depthfactor.' So two objects at the center, one in front of the other, will still be in perfect line with each other.

Next, my camera moves every object in it's step event, this time by seeing how much the camera moved and then moving the instances that distance multipled by the depth factor.

Code:
// Calculate view movement since last step
xmoved=view_xview-xview_previous
ymoved=view_yview-yview_previous

//if room_width==1920 && room_height=1080 exit;

if xmoved!=0 || ymoved!=0
    {
    
    // Objects
    var d=depthfactor;
    var xm=xmoved;
    var ym=ymoved;
      
    with all
         {
            // Objects in -20 to 20 are unaffected
            if depth>20 || depth<-20
                 {
                 // Multiply objects's depth by depthfactor
                 var depthoffset=(depth*d);   
                
                 // Recalculate positions     
                 x=x+xm*depthoffset       
                 y=y+ym*depthoffset
                 }

    }
Negaive depth objects (in front of the playfield) will now pass by the screen faster and positive depth objects will move slower, everthing lining up as I would expect.

...

I don't really have any good videos showing it exactly but this might help a bit... you'll see that there are wood roof supports in front of and behind the player field which have the exact same x and y at room start, and even now as they pass camera center they are lined up.

 
In my game the speed should be directly proportional to the scale. Scale=1 would be full speed, Scale=0.75 would 0.75 speed. What number would the depthfactor or scale factor in my case be then? I probably will have a stationary view with level objects approaching the screen at the scroll speed.
 
(obscene) Thanks this bit helped me come up with an idea that worked. Multiply the scale to get the new position. Why didn't I think of that?

// Recalculate positions
x=x-(x-view_wview*.5)*depthoffset
y=y-(y-view_hview*.5)*depthoffset
 
Top