What is the best way to create a parallax effect in an XNA game? I would like the camera to follow my sprite as it moves across the world, that way I can build in effects like zoom, panning, shake, and other effects. Anybody have a solid example of how this is done, preferably in a GameComponent?
C# – XNA 2D Camera Engine That Follows Sprite
ccameraspritexna
Related Solutions
Basically you want to use your high school level physics equations of motion (Wikipedia article).
For projectile motion, this is the important equation:
s = s₀ + v₀t + ½at²
(Displacement equals: initial displacement, plus initial velocity multiplied by time, plus half acceleration multiplied by time squared.)
Say you have a projectile moving in 2D. You basically run this equation for each dimension. In the X direction you will have an initial position and some initial velocity but no acceleration.
In the Y direction you will have an initial position, initial velocity, and the acceleration downwards due to gravity.
All you have to do is keep track of the time since your projectile was fired, and draw your sprite at the calculated position.
Here is some rough XNA code - as you can see I can just calculate both axes at once:
Vector2 initialPosition = Vector2.Zero;
Vector2 initialVelocity = new Vector2(10, 10); // Choose values that work for you
Vector2 acceleration = new Vector2(0, -9.8f);
float time = 0;
Vector2 position = Vector2.Zero; // Use this when drawing your sprite
public override void Update(GameTime gameTime)
{
time += (float)gameTime.ElapsedGameTime.TotalSeconds;
position = initialPosition + initialVelocity * time
+ 0.5f * acceleration * time * time;
}
With a little algebra, you can use those same equations of motion to do things like calculating what velocity to launch your projectile at to hit a particular point.
Games like Diablo or Sims 1, 2, SimCity 1-3, X-Com 1,2 etc. were actually just 2D games. The 2.5D effect requires that tiles further away are exactly the same size as tiles nearby. Your rotation around these games are restricted to 90 degrees.
How they draw is basically painters algorithm. Drawing what is furthest away first and overdrawing things that are nearer. Diablo is actually pretty simple, it didn't introduce layers or height differences as far as I remember. Just a flat map. So you draw the floor tiles first (in this case back to front isn't too necessary since they are all on the same elevation.) Then drawing back to front the walls, characters effects etc.
Everything in these games were rendered to bitmaps and rendered as bitmaps. Even though their source may have been a 3D textured model.
If you want to add perspective or free rotation then you need everything to be a 3D model. Your rendering will be simpler because depth or render order isn't as critical as you would use z-buffering to solve your issues. The only main issue is to properly render transparent bits in the right order or else you may end up with some odd results. However even if your rendering is simpler, your animation or in memory storage is a bit more difficult. You need to animate 3D models instead of just having an array of bitmaps to do the animation. Selection of items on the screen requires a little more work since position and size of the elements are no longer consistent or easily predictable.
So it depends on which features you want that will dictate which sort of solution you can use. Either way has it's plusses and minuses.
Best Answer
So I figured it out using a combination of the tutorials above and have created the class below. It tweens towards your target and follows it around. Try it out.
And Here is how you would use it with
SpriteBatch
:Let Me know if this helps you out, and thanks to StackOverflow and the community. W00t!