Jump to content

  • Log In with Google      Sign In   
  • Create Account


How can I add a parallax effect into my side-scrolling game?


Old topic!
Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.

  • You cannot reply to this topic
8 replies to this topic

#1 Mehmet Turan   Members   -  Reputation: 103

Like
0Likes
Like

Posted 16 May 2012 - 03:32 PM

How can I add a parallax effect into my side-scrolling game? I read a lot about parallax scrolling so I know what the logic is and what parallax is but I can't create a dynamic parallax effect.

I have draw and update functions like this:
Camera2D guiCam = new Camera2D();

updateWorld(){

guiCam.position.x+=7f;
}



public class Background extends DynamicGameObject {


int dirX=-1;


public Background(float x, float y, float width, float height,float velX) {
super(x, y, width, height);
velocity.x = velX;

}
public void update(float deltaTime,float cameraX) {


position.x = cameraX * 0.3f; // magic number to make the background move slowly
if(position.x + bounds.width-1200 <= 0)
position.x+= 2400;

}

}

 void render()
	{
     batcher.beginBatch(Assets.background);
        
        batcher.drawSprite(world.onKatman.position.x, 240, 2400, 480, Assets.backgroundRegion);
       
        if(world.onKatman.position.x + world.onKatman.bounds.width-1200 < 800)
         batcher.drawSprite(world.onKatman.position.x + world.onKatman.bounds.width, 240, 2400, 480, Assets.backgroundRegion);
        
     
        
        batcher.endBatch();
	}
So this draws a parallax effect with two background objects but it draws it statically. I'm creating a 2D side-scrolling game and I'm translating my character and my camera position along x axis. So I have to translate my parallax effect with my camera but when I add to background `position.x` it doesn't work. How can I solve this?

Edited by Mehmet Turan, 17 May 2012 - 05:11 AM.


Sponsor:

#2 ApochPiQ   Moderators   -  Reputation: 14664

Like
2Likes
Like

Posted 16 May 2012 - 04:35 PM

The trick to 2D parallax is to just move the background at a slower rate than the foreground. Try something like moving your "back" layer 1 pixel every time the foreground scrolls 2 pixels (i.e. divide the rate of foreground scroll by 2 to get the rate of background scroll).

#3 Mehmet Turan   Members   -  Reputation: 103

Like
0Likes
Like

Posted 16 May 2012 - 04:40 PM

The trick to 2D parallax is to just move the background at a slower rate than the foreground. Try something like moving your "back" layer 1 pixel every time the foreground scrolls 2 pixels (i.e. divide the rate of foreground scroll by 2 to get the rate of background scroll).


Thanks for your reply.I know how to simulate parallax but my problem is different i think.When i move my camera and character my background don't scroll.I have to scroll them but i couldn't do it.It draws continuously at same position.When i translate them with same amount with my camera translate,parallax effect don't work.

#4 ApochPiQ   Moderators   -  Reputation: 14664

Like
0Likes
Like

Posted 16 May 2012 - 05:02 PM

Can you post your actual code for how you move the background? Are you using integer coordinates? (In which case you might just be getting rounding errors that truncate 1/2 to 0 and thus the background never moves, etc.)

#5 Mehmet Turan   Members   -  Reputation: 103

Like
0Likes
Like

Posted 16 May 2012 - 05:06 PM

Can you post your actual code for how you move the background? Are you using integer coordinates? (In which case you might just be getting rounding errors that truncate 1/2 to 0 and thus the background never moves, etc.)


My code is the same with in my first post.I'm translating it with back.x+=7f;

I'm using floats.

#6 ApochPiQ   Moderators   -  Reputation: 14664

Like
0Likes
Like

Posted 16 May 2012 - 05:58 PM

Have you tried stepping through the code in a debugger and looking at the values of the variables you are using?

#7 alnite   Crossbones+   -  Reputation: 2061

Like
0Likes
Like

Posted 16 May 2012 - 07:13 PM

This looks like a translation issue. Can you post more code other than the above? It's really hard to tell with just those two methods. Show us how you create the backgrounds, the camera, and the update and paint processes. Most likely you reset the translate coordinate or something.

#8 Mehmet Turan   Members   -  Reputation: 103

Like
0Likes
Like

Posted 17 May 2012 - 05:12 AM

This looks like a translation issue. Can you post more code other than the above? It's really hard to tell with just those two methods. Show us how you create the backgrounds, the camera, and the update and paint processes. Most likely you reset the translate coordinate or something.

Have you tried stepping through the code in a debugger and looking at the values of the variables you are using?


I have updated my codes.

#9 ApochPiQ   Moderators   -  Reputation: 14664

Like
0Likes
Like

Posted 17 May 2012 - 05:21 AM

Step through the code in your debugger and look at what values the variables hold each time you draw the background.




Old topic!
Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.



PARTNERS