Hi Ok my Artist/Game Designer has asked me to make an engine where we can have multiple layers on the screen and they all scroll at different speeds. It''s a space based game and he wants the space background to scroll really slowly and the planets etc to scroll faster so that it gives a feeling of depth. Now how would you guys go about this??? Have a separate co-ordinate system for each layer and increase the co-ordinates for the higher layers by a greater value than the lower ones when the screen moves? You''d oviously have to have a much bigger map area for the higher layers then aswell... This might make object selection with a mouse a bit complicated though. I was also thinking of cutting down the viewable area somehow.. So if the screen width is 800x600 on the base layer, the viewable area is reduced to 600x400 say for the layer above that but streched to 800x600. So then if you start with both layers fully on the left an slowly move right, the smaller "window" will have to move faster so that they both hit the right side of the map at the same time. But I don''t think you''d get enough of a speed difference out of it? (Hope that made some sence Any ideas or comments? Thanks a lot TUna

I believe this effect is called paralax

Anyway a common and simple way to do this is for the lower layer that goes slower use one large, tileable image. And just slowly scroll through it. You can also use a smaller image and just use Blt()''s stretching capabilites to fill out the screen, stretching also creates an effect that the lower layer is out of focus or blurred.

That could have been described better but you probably know what I mean.

Hey

Yeap I understand what your saying but I'd like to support more then 2 "layers" if possible. Therefore I need a more general case for the layers above the tileable background


Edited by - TUna on 1/27/00 6:02:21 AM

Yes. the effect is parallax scrolling.

You don''t have to stop at two layers. Just make another that scrolls at the speed in between the two

There is a tutorial somewhere but I forgot the link. It is documented in many books too, like the Black Art of 3d game programming by lamothe

Ok so then for each level up, the map would have to be bigger so that it can scroll by faster... Or is there an easier way involving some maths?

Here''s an approach using square tiled graphics. I''m not sure if it will work:

Lets take the screen at 800x600 and assume there is a 200x600 pixel toolbar on one side. This leaves us with a 600x600 viewable area.

We decide that the top layer tiles would be 60x60pixels. This lets us have a 10x10 tile grid.

We decide that the middle layer tiles will be 30x30, giving us 20x20 tiles

We decide the lower level will be 20x20 pixels. giving us 30x30.



So we do a for(y < 30) for(x < 30) loop for the botom layer, looking at m_tileMap[x][y].bottom for the correct image to blit. Then we do a for(y<20,x<20) loop for the middle layer, looka at m_tileMap[x][y].middle for the correct image. Then we do a for (y < 10, x<10 loop for the top layer, looking at m_tileMap[x][y].top for the correct image.

This lets you store all the data in the same map.. then just increment the map offset for each layer to keep up with the scrolling speed you want.