Sign in to follow this  
Grantyt3

Scrolling Backgrounds

Recommended Posts

I can't find a good way to put this question into words, but I'll try: I need to fill the entire screen with blocks of an outer space stars image, so it would be the background, but I need it to scroll, so and x and y offset instead of it always startin with 0,0 in the corner and filling from there, the offset could be 4,6. If I did the same thing with 4,6, then I would have 4 unfilled columns and 6 unfilled rows, so how do I loop back to behind the offset and fill that? Back in my Blitz Basic days, I just used TileImage, and that did the work for me, and that's why I don't know how to do it... I'll reword this simpler: How can I fill the whole screen with tiled image?

Share this post


Link to post
Share on other sites
I'm not quite sure I understand you correctly, but I think what you want is this or maybe this?

They're both C++/SDL tutorials from Lazyfoo's site, but you should be able to see how it's done and apply it in your laugage.

On the first link, you basicly have your 'level', and you have your 'screen'. Your sceen is centered on the player and you only draw whats on the screen, as the player + screen scroll through your level.

The second is more particularly for repeating backgrounds, and I'm not quite sure I understand which you want.

Share this post


Link to post
Share on other sites
You could make the size of the surface you're drawing to one tile wider and higher than the actual screen, and then only blit what is needed. So say you have a screen which consists of 8x6 tiles, you would make a surface with dimensions of 9x7 tiles and fill that in with your space stars. Then to the screen, you would blit from the position x: (tileWidth-4) y: (tileHeight-6) (because your offset is 4,6).

Another advantage this method has is only needing to reconstruct your larger surface everytime a new tile comes into it, instead of every frame.

Not sure if this is exactly what you were asking about, but good luck :)


edit: fixed typo

Share this post


Link to post
Share on other sites
Yep, I'm using C++/SDL. I didn't include that information, because I was just looking for the principle behind it, not the code.

For some reason, it looks like Lazy Foo's website is down, I'll check back in a little bit.

And I think Chip's idea is what I'm looking for, once I think about it for a while and understand what he's talking about exactly.

And yes, I want to make a repeating background.

EDIT: Yes, Chip's idea is what i'm looking for. I'll try it later today and tell you if I have any problems.

Share this post


Link to post
Share on other sites
If the background image is precisely the size of the screen, you could tile it around the outer-edges of the screen like so:


+----+----+----+
| | | |
| | | |
+----+----+----+
| | | |
| | X | |
+----+----+----+
| | | |
| | | |
+----+----+----+


The square marked with an X represents the screen; all other squares represent tiles that are offscreen. Simply scroll this tilemap around, appropriately moving tiles over to the opposite side of the grid to maintain the illusion.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this