Sorry your browser is not supported!

You are using an outdated browser that does not support modern web technologies, in order to use this site please update to a new browser.

Browsers supported include Chrome, FireFox, Safari, Opera, Internet Explorer 10+ or Microsoft Edge.

2D All the way! / comm_jak needs help on 2D.

Author
Message
comm_jak
20
Years of Service
User Offline
Joined: 31st May 2004
Location: FOB: Fields Of Battle
Posted: 2nd Jun 2004 05:31
I want to create a 2D game from scratch. The game I want to make will be a side scrolling game. How do I do this.(I have DarkBASIC classic.)Please help.(Isn't that cool-->)
zenassem
22
Years of Service
User Offline
Joined: 10th Mar 2003
Location: Long Island, NY
Posted: 2nd Jun 2004 10:11
Comm_jak,

Welcome to the DB Forums!

You can thank Code Monkey for looking up the link. He/she posted it in a recent thread so I'll pass it along to you. Take a serious look at the tutorial and then feel free to post specifice questions you may have back in this thread. I haven't read this tutorial, but It seems to get a lot of good feedback.

http://darkbasic.thegamecreators.com/?m=forum_view&t=30060&b=7


comm_jak
20
Years of Service
User Offline
Joined: 31st May 2004
Location: FOB: Fields Of Battle
Posted: 3rd Jun 2004 06:05
Thanks zenassem your a big help.
comm_jak
20
Years of Service
User Offline
Joined: 31st May 2004
Location: FOB: Fields Of Battle
Posted: 3rd Jun 2004 06:46
That tutorial was for Dark BASIC pro.
I have dark BASIC classic so it doesn't
work. Do you have any suggestions?
zenassem
22
Years of Service
User Offline
Joined: 10th Mar 2003
Location: Long Island, NY
Posted: 3rd Jun 2004 23:11
Comm_jak,

Oops!

Most of the code should be the same. Also, even if you can't compile/run it the theory is still the same. I will have a look at it tonight and see if I can port it to DBC. If it's too much of a hassle I will whip up something for you and a template/outline for what you may neeed to add to it. If I do, I'll probably keep it marioesque, and I will leave out the character animation frames.

I am assuming that your main issue right now is with the screen setup layout. I may need you to be more specific though.

- Are you going to make your screens from tiles? - Like super mario bros., or the original metroid, megaman etc.
- Or are you plannign on scrolling large bitmaps? If so, will you have a reference map (a second non-displayed bitmap) for collsions.
- A mixture of the two above? Like (ghost'n Goblins)
- Parallax scrolling? like the Altered beast Demo, Sonic.

It would help if you could say, I want to make a 2D side-scroller like ________. Specifically I am having trouble deciding how to _______.


comm_jak
20
Years of Service
User Offline
Joined: 31st May 2004
Location: FOB: Fields Of Battle
Posted: 21st Jun 2004 21:24
I want to make a 2D side-scroller like Metroid Fusion for GBA. Specifically I am having trouble deciding how to actually make it, like what code to use.
I am not very good with 2D its so confusing.
Thanks for helping.
Thequiet0ne
21
Years of Service
User Offline
Joined: 23rd Nov 2003
Location:
Posted: 22nd Jun 2004 00:04
hey i'm new to db (classic) to and thinking of doing pretty much the same thing, tho just need help with a few things that hopefully can get sorted with that tutorial so if poss can you post it to me to? if poss could you add in these
how do you make an button sprite?and menus in general?
enemy AI and sprite collision?
comm_jak
20
Years of Service
User Offline
Joined: 31st May 2004
Location: FOB: Fields Of Battle
Posted: 3rd Jul 2004 08:45
Sorry zenassem I got my games mixed up I want to create a 2D game like Super Mario Advance for the GBA. Sorry I was thinking about the Metroid Fusion and typed it in without thinking.
I am having trouble getting the left, right, up, and down commands to work properly. I have made the animation files of my character but can't get him to move and display the animation at the same time. I also have the background all made up ,but I need help creating the sprite collision things for the game. Can you help me with all this? Or is it too much? Also, do you have any other tutorials for Dark Basic Classic that will help me?

Thanks again,
comm_jak
zenassem
22
Years of Service
User Offline
Joined: 10th Mar 2003
Location: Long Island, NY
Posted: 3rd Jul 2004 09:45
comm_jack,

No it's really not too much. I'll see waht I can do. Usually when building a game like "super mario advanced" I would build up the backgrounds out of tiles (using multiple layers). This way my collisions would take place on any tiles that are on a certain layer. for example here's an example using 2 layers. Now say that I had a 3Dimensional array WorldAr(xsize,ysize,layers).

For my first layer (layer 0) I would draw all things that my sprite can show above(no collision: like the background sky) and for layer 1 any tiles would cause collision.
so assume that my array values reference a tileimage.
0=transparent (no tile)
1=sky
2=brick
3=pipe

layer 0 -> WorldAr(xsize,ysize,0)
111111111111111111111111111111111111111111
111111111111111111111111111111111111111111
111111111111111111111111111111111111111111
111111111111111111111111111111111111111111
111111111111111111111111111111111111111111
111111111111111111111111111111111111111111
111111111111111111111111111111111111111111
etc...

layer 1 -> WorldAr(xsize,ysize,1)
000000000000000000000000000000000000000000
000000000000200000000000000000000000000000
000000000000000000022222222000000000000000
000000000002222200000000000000000000000000
000222222200000000000002000000000022222200
000000000000000000000000000000000000000000
222222222222222222232222222222232222222222

If you have predrawn backgrounds you have two choices. Either you will have to check for pixel color value to detect collision (this is only good if onjects have a border that you can check for) or you can still use a logical grid like the ones above, but instead of them being a direct correlation to an image number it will be an approximate logic grid that breaks up the bitmap. You will have to see how small the grid needs to be to give enough accuracy to your predrawn backgorund.

As far as the animation of the sprite goes. You will need want to only update the sprites animation frame once per loop. When it comes to characters you are not always able to use the play sprite command. It really depends on how your animations are set up. I usually just change the image of the sprite and update it x and y cooordinates accordingly. Just make sure you only update 1 frame per loop. To do this you need to have some condition variables set up to know which frame to display. here's the logical ie. I will provide some specific DBC code a little later

assume that the charcter has 4 frames of animation to move rigth
assume that the first frame is image number 8
assume that the last frame is image number 12

first we need to get the input from the keyboard (once per loop)
assume that the player is pressing right
we need to check was the character moving in a different direction before: true or false
if true: we need to start the animation frame at image number 8
if false: it means the player was moving right the previou frame
so we need to increment our image number... But
we also need to make sure that we are not at the last frame (12)
so we say if imagenum=12 then image num=8 to

You will need to do this for each direction the character can move

Then you need to address combinations of commands like jumping and moving to the right.

You also need to address animation sequences that need to complete before any other keys will be addressed. And if so make sure that the animation sequence finishes before checking for kb input again.

These are the things that take a little bit of time. i'll try to put a simple mario game together later today in DBC. To give you a framework.

Good luck, And I'll post the code sample as soon as I get a chance.


SandraD
20
Years of Service
User Offline
Joined: 30th May 2004
Location: Down on the corner, out in the street.
Posted: 3rd Jul 2004 19:12
Goodness Zen, you are a dilegent poster! Coo-dos guy! You are way, way, beyond me...

Any truly great code should be indisguishable from magic.
zenassem
22
Years of Service
User Offline
Joined: 10th Mar 2003
Location: Long Island, NY
Posted: 4th Jul 2004 00:49 Edited at: 4th Jul 2004 06:40
Thanks Sandrad,
I am really focusing on trying to help the 2D community here. I'm a noob when it comes to 3D. In some cases programming for 2D is actually more difficult and time consuming. Add in the fact that there are a lot of subtleties in setting up 2D in DBpro.

@comm_jack,
To continue, depending on your experience my explanation above may have left you at a loss in certain areas. It is a large topic, and I'll try to do my best to make things as clear as possible. I am in the process of compiling a couple of 2D tutorial threads to possibly help people with 2D principles and Tile-based Games.

Setting up the TileBased World:
There are a couple of ways to actually create your tile-based maps. For small testing purposes you can read in the array data from <data> statements in your program, or from a .txt file. This would mean entering the numbers for the tiles like my example above. As you can see this can become tedious, and is not well suited for seeing the results instantly. For this reason it is better to write a tool to allow drawing, editing, & saving tile based worlds. In fact, I am in the process of writng a simple version of such a tool (albeit for dbPro: I may be able to port it to DBC) calle "Tile~Forge". Right now it's a simple tool that allows to draw with tiles instead of pixels, and saves the MapData to a Map.txt file which can later be read in by your program.



Here is a preliminary test of my "Tile-Forge" creating a mario level.


Here is just a sample on how to index a 3Dimensional array
This is how you would intialize the values into the array from the data satements:
dim ArWorldMap(4,4,1)

restore worlddata:
for layers=0 to 4
for indexY=0 to 4
for indexX=0 to 1
read info
ArWorldMap(indexX,IndexY,layers)=info
next indexX
next indexY
next layers

worlddata:
` Layer 0
data 1,1,1,1,1
data 1,1,1,1,1
data 1,1,1,1,1
data 1,1,1,1,1
data 1,1,1,1,1
` Layer 1
data 0,0,0,0,0
data 0,0,0,0,0
data 0,2,2,0,0
data 0,0,0,0,0
data 2,2,2,2,2



comm_jak
20
Years of Service
User Offline
Joined: 31st May 2004
Location: FOB: Fields Of Battle
Posted: 16th Jul 2004 13:17 Edited at: 16th Jul 2004 13:18
WOW! You're realy a wiz a this.
Can you please explain the <data> things more...
000000000000000
000000002000000
000000000000000 <--these things
000222200022000
000000000000000
222232222233222

...and how they work?
thanks for all the help and if you get a simple mario game sample
i'd really like to have a look at the code and see how you did it.
Thanks again.
Oh, it wouldn't let me see the picture under the "tileforge"
titled "Mario.bmp" so if you can, can you send it again, describe it to me or if its not that important skip it.
One more question, how long have you worked with dark basic?
Well thats it, thanks again.
Comm_jak
zenassem
22
Years of Service
User Offline
Joined: 10th Mar 2003
Location: Long Island, NY
Posted: 17th Jul 2004 07:10 Edited at: 17th Jul 2004 09:27
http://img68.photobucket.com/albums/v208/zenassem/Mario.bmp

Is the adress of the image. I can see it in my post, I'll try to see if I can find out why you can't see it.

Ok the explanation for the data is quite involved, but I will see if I can give you the short of it. Also see my thread 2d principles with DBC/DBpro as it explains this, and the current chapter will be looking extensively into this.

Expalantion:
Let's stick with the Super Mario Bro.s example, as we are both familiar with the game. When designing levels like this as 2D programmer has a few choices:

1)The first one that comes to mind is to create a large bitmap for the level, scrolling it as the player moves.

2)Another method is to use small tiles (like a mosaic) to build thhe large world. Using tiles to create the world is similar to using pixels to draw a large picture in a paint program, but rather than painting with a single pixel, we are painting with a bitmap usually a size of (32*32, 64*64*, 128*128).

Now between these 2 methods why is method 2 preferred over method 1?

There are primarily three reasons: Memory conservation, graphic reuse, and dynamic map creation.

Let's take a look at each.
(credited to author Todd Barron)
Memory Conservation

Let's say we we needed a level 100 * 100 tiles; with each tile being 64pixels * 64pixels. That would equal 10,000 tiles total. Lets calculate how much memory this single map would use if we tried to create it using one large bitmap, instead of using tiles. so,

100 tiles * 100 tiles = 10,000 tiles
64pixels * 64 pixels = 4,096 pixels per tile
10,000 tiles * 4,096 pixels * 1 byte(8bits) = 40,960,000 bytes (w.256 colors)
10,000 tiles* 4,096 pixels * 4 bytes(32-bit) = 163,840,000 bytes


So a simple 100 * 100 map would require 163 mb in storage if we used 32-bit color; even if we chose tro use 256 colors it would require 41 mb of storage space - for one map.

Now let's compare how much memory it would take to store the map if we use tiles to create the larger world.

100 tiles * 100 tiles = 10,000 tiles
64 pixels * 64 pixels= 4,096 pixels
100 tiles * 4,096 pixels * 4 bytes= 1,638,400
10,000 tiles * 1 byte per tile = 10,000 bytes
10,000 bytes + 1,638,400 = 1,648,400 bytes total


So, using a set of 100 tiles, you can create the 100 * 100 map using opnly 2 mb of memory. Even if you used a tile set of 1000 tiles it would only use less than 20 mb.

And that's if map had no repeating tiles and each tile was used once.

Graphic reuse
This one is practically a no-brainer. If we chose to make each level from a large bitmap we would have to draw every level by hand, if we want to add a level, we will have to start from scratch and draw the level from scratch. If we want to create a new game, we start over drawing levels.

Now creating your own tiles does take time, it isn't an easy process, but once complete, you can reuse the tiles, over and over again. Yu can create new levels with them, in fact you can even use a good tileset for a completely different game, or for hundreds of completely different games.

[Dynamic Content]
Say you want your game to create random maps or levels on the fly. If your world is built from tiles you can write an algorithm to place tiles in a way to make them appealing. Hence, a random map generator.

To do this with a world that is one large bitmap would be a programming nightmare. You would have to write an algorithm that draws a world pixel byu pixel and creates something playable. I don't even want to think about it.

------

Ok I hope that you are convinced as to why tile-based worlds are the way to go. Now I can answer the Data question

So, we want to draw a Super Mario Brothers level. Let's say we have a tile that looks like bricks and its a bitmap that's 32 pixels by 32 pixels.

This means that our level is going to made up of multiple tiles 32*32 placed into a grid, like working with mosaics. Let's say our screen resolution is 640pixels * 480pixels, and that our world will be two screens wide by one screen high (1280pixels * 480pixels). Since we have tiles that are 32pixels * 32 Pixels in order for us to fill two screens we will need to have a 40 tiles * 15 tiles map.

To Store the 40 * 15 map we will use a 2d Array. (it may help you to keep in mind that a 640 pixel * 480 pixel screen is basically a 2d array. dim Screen640x480(640,480) where each x,y pair refers to a specific pixel. Our map will work the same way but rather than x,y referiing to a single pixel it will refer to a tile that is 32pixels*32pixels.)

dim OurMap(40,15)

So now we have a 2d array that can old our map. But we still have no idea how to get the 32*32 tiles to the screen. That's where our data statement comes in. The idea is we will give each tile a numeric identifier. For example or brick tile will be identified by "1" lets also we have an all blue tile that represents the sky and is identified by "0". Now we have to get these values into our 2d array. later when we want to draw the map we will look at the coordinates in our array, any time we run into a 0 we will draw a 32*32 blue tile; any time we run into a 1 we will draw a 32*32 brick tile. So how do we get our map's data into the array. Well there are a few methods. first we can do this

OurMap(0,0)=0: OurMap(1,0)=0: OurMap(2,0)=0: OurMap(3,0)=1 ....

As you can see this is not a good method. So to make our life easier we can use data statements.

What are data statements. Basically it's a way for us to include directly in our program, as opposed to having to open a .txt file, .ini file, .dat file, or even our own custom .map file. The data can be integers, floats, characters, strings etc. The only thing we need to make sure of is that when we read from the data statement that we have the appropriate variable type to hold the data we are reading.

Keep in mind that for our map data 0=to blue sky (32*32 tile), 1=to a brick (32*32 tile)

so lets create or map with data statements
we need a 40*15 map. So I will write the data statements to coincide with that. We will have 15 data lines; eachline will have 40 values.
I could write it all in one single data statement, but by doing it the other way I can sort of see what the map will look like.

data 0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0
data 0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0
data 0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0
data 0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0
data 0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0
data 0,0,0,0,0,0,0,0,0,1,1,1,1,1,1,0,0,0,0,1,1,1,1,1,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0
data 0,0,0,0,0,0,0,0,0,1,1,1,1,1,1,0,0,0,0,1,1,1,1,1,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0
data 0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0
data 0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0
data 0,0,0,1,1,1,1,1,1,1,1,1,0,0,0,0,0,1,1,1,1,0,0,0,0,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0
data 0,0,0,1,1,1,1,1,1,1,1,1,0,0,0,0,0,1,1,1,1,0,0,0,0,1,1,0,0,0,0,0,0,0,0,1,1,1,1,0
data 0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,1,1,1,0
data 0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0
data 1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1
data 1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1

It my be hard to see but these data statements represent a level that looks like this


Now we need to read these intgers into our world array
for y=0 to 14
for x=0 to 39
tile=read number
OurMap(x,y)= tile
next x
next y

Ok let me know that you follow what I am doing up to this point. it will be easier for me to clear up anything that doesn't make sense at this point before pressing on.


comm_jak
20
Years of Service
User Offline
Joined: 31st May 2004
Location: FOB: Fields Of Battle
Posted: 25th Jul 2004 04:32
Holy Cow! Thanks alot this is really helping me. I follow all that you are doing. I created a new dark basic file and put in the
dim OurMap(40,15)
and the data 0,0,0,0 thing, but I don't know how to make the computer recognize that 0= my sky tile and 1= my brick tile.(Which I took the liberty of making.)How do I go about doing this. Please continue your lesson. I am VERY appreciative of you for helping me. Thanks again,
comm_jak
comm_jak
20
Years of Service
User Offline
Joined: 31st May 2004
Location: FOB: Fields Of Battle
Posted: 3rd Aug 2004 10:46
Hey Um I won't be here for the next 2 weeks so don't get mad if I don't respond. But be really surprised if I do respond in the next two weeks. Thats it.
Later,
comm_jak
comm_jak
20
Years of Service
User Offline
Joined: 31st May 2004
Location: FOB: Fields Of Battle
Posted: 24th Aug 2004 05:58
hello? Anybody there. Zenassem? Are you still there? Did I do something wrong?
comm_jak
20
Years of Service
User Offline
Joined: 31st May 2004
Location: FOB: Fields Of Battle
Posted: 17th Sep 2004 06:28
hello Zen you were a really big help could you keep on your lesson! Pllleeeeeaaaaasssseeeee!
Ooska
20
Years of Service
User Offline
Joined: 29th Aug 2004
Location:
Posted: 7th Oct 2004 09:24
Wow that is all very helpful! Thank you! I can tell that you care! I am following this all, so far. I need to know how to tell the computer what all the 0s and the 1s mean along with Commjak. I also dont know how to make an image move. So thank you a lot!

(I am currently trying to maek a game that all you do is go through this simple little maze and kill little snakes)
I was thinking that the 0s could mean an image shaped like an L.
And 1s for ___s and so on so I could make just a simple maze out of white lines.

Weird = Unique. Unique = Human.
Ooska
20
Years of Service
User Offline
Joined: 29th Aug 2004
Location:
Posted: 8th Oct 2004 11:33
Wait a minute! The strategy to going about this I was trying to do would be way harder than the one i just thought of! I was thinking that i dont really need color and I had read the post where you said that you could make the program detect if your sprite collided with a certan pixel color. That whould be simpler. So I was wondering.....How the monkey do ya do that?!

Weird = Unique. Unique = Human.
Skeletor
20
Years of Service
User Offline
Joined: 21st Jun 2004
Location: florida
Posted: 9th Oct 2004 08:02
I think Zenassem died or something... hmmm poor zen where the hell are ya.


http://www.angelfire.com/games5/db_games/
Cian Rice
20
Years of Service
User Offline
Joined: 8th Jun 2004
Location:
Posted: 11th Oct 2004 09:33
Recovering from a car accident, I think.

Got anime?I do.
comm_jak
20
Years of Service
User Offline
Joined: 31st May 2004
Location: FOB: Fields Of Battle
Posted: 22nd Oct 2004 12:19
Guys I put together something that looks really cool when its run. It is sort of like a level creator only for 2D and...well...I just got my computer wiped and restored so I had to back it up on a CD so I'll post the code as soon as I find the CD. And yeah where is Zen I've been asking him where he is for the longest time. So any ways I report back soon. (I hope I don't suddenly die like Zen)
Ooska
20
Years of Service
User Offline
Joined: 29th Aug 2004
Location:
Posted: 7th Nov 2004 11:01
Yeah me too!

Weird = Unique. Unique = Human.
Tapewormz
22
Years of Service
User Offline
Joined: 15th Sep 2002
Location: Winnipeg, Mantoba, Canada
Posted: 7th Nov 2004 23:44
Read your manual on data types. Make your own data statements. Read your data statements, and figure out different ways of displaying the data. Learn to create arrays, both 2 dimensional and 3 dimensional. Use the information provided by zenassem. Once you've got that figured out, you'll be able to make your own tile system.

You can't really expect people here to write a whole program for you and explain it line by line. They'll get frustrated eventually, if you don't follow along.

comm_jak
20
Years of Service
User Offline
Joined: 31st May 2004
Location: FOB: Fields Of Battle
Posted: 13th Jan 2005 10:01
I wish he would of told me that or something. Oh well Zen thanks for all the help. SORRY!! I guess I was trying to get u to tell me everything line by line. I just am having trouble making my own arrays, I need an example. Thanks again!

Login to post a reply

Server time is: 2025-05-17 10:05:58
Your offset time is: 2025-05-17 10:05:58