how to make a basic side scroller game ? (the side scrolling part)

[graveyard filla 605]

high, im wondering, how is the sidescrolling done in a basic 2d side scrolling game like mario? ok, so i skimmed through the tutorial at cone3d.gamedev.net about the side-scrolling space shooter. so basically you just have a background which scrolls constantly, and enemies which move towards you constantly, giving you the illusion that your moving. but what about for a side scroller like mario? ok, so same concept, you make a scrollable background image, and enemies which move toward you. but in mario, this isnt how it is. in mario, you could move through the screen, and the "camera" would move with you. how is this done? how do i move to the right of my screen and have the background scroll with me?? i could imagine having a huge background image, then, if i move to the right, have this (sliced) image move to the left. then it would look like im actually moving, and i could move the screen with me. this is fine if i dont want any collision in my game (yeah right), but how the hell do you scroll a screen full of tiles? i could easily see how to scroll one large background image, but a whole screen full of tiles!!?? this is the part that really confuses the hell out of me heres my thoery: note: when i say map, i mean a array [25][19] big, with 32x32 tiles, which filles an 800x600 screen. we first draw the map[25][19] array to the screen. the player is drawn on top of it. when the player presses the right arrow key (to move right), all the values of the map array are shifted to the left somehow??? hmmm i could see a system like this in my head: //for map[y][x] map[1][1] would become map[1][0] map[1][2] would become map[1][1] etc... map[2][1] would become map[2][0] map[2][2] would become map[2][1] etc... then at the end... map[1][18] = next_map[1][0] map[2][18] = next_map[2][0] map[3][18] = next_map[3][0] etc. etc. is the how the arrays would link with each other? then, what about the 15+ map arrays for each level? i would have to make maybe a 3 dimensional array to store all the 'maps' that would make up an entire level? on that issue, i allready have made a map editor for my pacman style game, so, do i just make about a million maps, and connect them all? then do the scrolling background to go with it? is this how mario style games are made? it seems like, even for just one mario level, it would take probably 15 or more maps connected to each other. do i really have to make 15 or more maps for each level? is this how its done? so, is this how its done? could you please give me advice/hints/tips/ anything?? recommended tile size? screen res? links or something?? come on man!!! i want to start coding my first side scroller soon and would just like some general advice. does this system seem ok? am i doing it totally wrong? am i a complete idiot? thanks for any help guys!!! [edited by - graveyard filla on April 6, 2004 4:15:41 AM]

[cairnswm 181]

In my games I use large tile maps. These maps are stored in an array. I also have a camera position. The position is independant from the map itself.

On screen refresh I calculate which tile is under the cemera position and draw it in the top left corner of the screen. Then based on the screen size I calculate the number of tiles to draw and draw them in a loop.

As the player moves I update the camera position based on the player s movement.

[RuneLancer 253]

Basically, it depends on what you want.

If you''re writing a tile-based game, you''d just store your tiles somehow (it''s up to you; the populare method is to just stuff them one by one in an array, but old NES games used pre-determined chunks to save space) and render them to the screen as needed.

Imagine this: you have EVERY single tile drawn, and place a sheet of graphing paper over a part of the level. Then, you draw what''s under the paper on that sheet. When you move forward, the paper slides forward; you draw new stuff. Just imagine a sliding window sliding along the level.

Mario I had a background and a tile layer. It would draw the background first, then the tiles (blocks, vines...), then the sprites (coins, mario...) as the "sliding window" passed over stuff.

[ghosted 445]

http://jnrdev.weed-crew.net/

might help.

[graveyard filla 605]

quote:

---

Original post by cairnswm
In my games I use large tile maps. These maps are stored in an array. I also have a camera position. The position is independant from the map itself.

On screen refresh I calculate which tile is under the cemera position and draw it in the top left corner of the screen. Then based on the screen size I calculate the number of tiles to draw and draw them in a loop.

As the player moves I update the camera position based on the player s movement.

---

ok... so your saying, instead of making many small map arrays like [19]x[25], you would just make one huge map array? like [19][250]??? then, you figure out what part of this array the player is standing on??? could you reccomend a tile size to use? also, how could you make a map editor with such a huge array size? obviously a [19][250] array could fill like 10 screens, so how do you crunch it down to one screen to make the map?? thanks for any help !!

[edited by - graveyard filla on April 6, 2004 12:59:07 PM]

[marcus12024 162]

Okay, I''ll take a stab @ answering your questions...

Yes, you can just make a huge array to hold all of the tiles for your level. This way you can create maps of any size, that you can make scroll in any/all directions.

And yes, then you need to figure out what part of the map the player is currently on...all though you''re really figuring out what part of the map is actually being displayed on-screen. Forget about a "character" right now, and just think in terms of the map itself. Try to implement scrolling by using the arrow keys to move around the map - you don''t need to display a character.

And to make your map, you don''t need to "crunch it down" to fit on one screen, as any decent map editor will allow you to scroll around the level. Think of a large essay in Microsoft word - you don''t need to view all the pages at once, you can scroll around and look at one part at a time. Ditto for a map editor.

So first off just try to display a screen full of tiles. Then try rigging up a key to "scroll right"... In other words, just move the screen x co-ordinate of your tiles one pixel to the left at a time. It doesn''t matter if your value is less than 0, it should be okay - you can clean up the code later. Then get scrolling to the left working also. Now think about what you have done, and how you would only paint what''s currently on the screen.

Hope that helps a little bit.

[Peon 276]

I''m writing a sidescroller right now, so I have a little advice:

- To scroll, I have a map class with a getCurrentMap() function. It returns a 20x15 (50 pixel tiles for (roughly) 1024x768) array that tells me what tiles to display. So let''s say the map has a 2D array called mapData that is a 90x15 array. Initially, I will return x-values from 0 to 19. However, if I press the right button, my map class is notified and next time it will return 1 to 20, etc...

- It might be worth it to have "layers" in your map. In my sidescroller, I am working on implementing 9 layers, which can be turned on or off, depending whether or not you need them. Layers 0-2 are for tiles "behind" the player, 3-5 are tiles at are checked for collision detection, and 6-8 are "on top" of the player. It gives a much nicer look to the game, IMO.

- When scrolling the background, it might looks a little funny if the screen moves at the same rate as the player. In my game, I use a technique called "parallax scrolling" to scroll the background at a slower rate than the player himself.

- Whoever said that your map editor should just scroll as needed is correct. No need to "scrunch it up"

- For 1024x768 resolution, I think that 50x50 tiles work well, but it''s a judgement call. I use 50x50 for the "building blocks" of my levels, but find that larger tiles -- 200x200 and upward -- are good for other things (like trees) My characters are currently 100x100.

[graveyard filla 605]

about the scrolling map-editor, how is such a thing accomplished? do i have to learn the win API to make the map editor? (so i can make a scroll thingy like in your internet browser ------------------->)

or, is this possible with SDL? obviously, i could scroll through my map editor the same way i scroll through the map when i move in-game. so i guess thats what ill wind up doing since im not learning the dirty win API. thanks for your help guys and anymore tips or advice would be appreciated!

[Peon 276]

Well for my editor, I just have it set up so that if the mouse position is greater than 1000, currentMap.scrollRight() is called. It could be mapped to a button, too.

No reason you need to use the Windows API, you could even accomplish this in a console window if you were so inclined. I use GDI for mine, though I think the graphics would be easy to port since I handle all my rendering in one renderer class.

[graveyard filla 605]

yeah, like i said i would just handle the scrolling of the map editor the same way its handled actually in game. figured thats the only way without using real scroll boxes