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.

DarkBASIC Discussion / building a tic-tac-toe game

Author
Message
whipped6
17
Years of Service
User Offline
Joined: 31st Aug 2006
Location:
Posted: 3rd Nov 2006 01:09
Link
hello everybody sadly i still havent built my first game yet just programms and if you would plz throw in some of your skills of programming and help me with building a tic-tac-toe game.

I thought tic-tac-toe would be a perfect for my first game.

Now i have an idea but would be really help full if you could show me how to do it step-by-step.

Thank you for every little help I get

game creator
Back to top
Profile PM
indi
21
Years of Service
User Offline
Joined: 26th Aug 2002
Location: Earth, Brisbane, Australia
Posted: 3rd Nov 2006 01:55
Link
I think something like pong would be better imho.
it has a simpler layout for collision purposes.

1 paddle
1 ball
1-3 obstacles

this could be achieved in 3d or 2d.

Back to top
Profile PM Email
whipped6
17
Years of Service
User Offline
Joined: 31st Aug 2006
Location:
Posted: 3rd Nov 2006 02:28
Link
indi i thank you for that help but i am needing to make a tic-tac-toe game that will help me with a basic
AI and more...

game creator
Back to top
Profile PM
dab
19
Years of Service
User Offline
Joined: 22nd Sep 2004
Location: Your Temp Folder!
Posted: 3rd Nov 2006 04:39 Edited at: 3rd Nov 2006 04:41
Link
I made a tic tac toe game for the Puzzle Compo a few years ago. Since the board is deleted, I guess I'll upload a new zip of it with source, I'll warn you though, the source is messy.

Here is the source for the hardest computer that I programmed.




Warning though: This code is very messy and is not meant for running with max FPS. I was in my unknowledgeable stage

Take heed, never take advantage of the things you need, never let your self be overcome by greed. Walk a strigh line, pick up your speed and try. Everyone deserves a piece of the pie By: Shaggy

Attachments

Login to view attachments
Back to top
Profile PM Email Website
whipped6
17
Years of Service
User Offline
Joined: 31st Aug 2006
Location:
Posted: 3rd Nov 2006 17:02
Link
dabip that code does not work and another thing


I HAVE DARKBASIC CLASSIC KK just so you not to post dbp codes or anything like that =-)

game creator
Back to top
Profile PM
Zotoaster
19
Years of Service
User Offline
Joined: 20th Dec 2004
Location: Scotland
Posted: 3rd Nov 2006 20:39
Link
Still, that code looks a little complex for someone just starting programming. Pong is always the best choice!

Back to top
Profile PM Email
RUCCUS
19
Years of Service
User Offline
Joined: 11th Dec 2004
Location: Canada
Posted: 4th Nov 2006 16:50
Link
Right, tic-tac-toe.

The first thing you're going to want to do is setup the basic program outline;





The next step is to figure out the logic behind how we want the game to play out. Lets establish the ground rules;

- X's will be represented by boxes, and O's will be represented by spheres.

- We'll need to make a grid, we could do this several ways, we could use a matrix, we could make a 3D model of a grid, we could even make a 2D grid pasted on the screen. We'll stick with the matrix.

- In hopes of keeping the program simple, we'll make it a 2 player game instead of needing A.I.

- For even more simplicity, we'll give both players the same controls, requiring them to switch the mouse back and forth every turn.

- Before a piece is put down on the grid, we have to check if the square they've selected is open (doesnt have a piece in it already). If it isnt, we should alert the user with a graphical effect.

- Everytime a piece is put down, we have to check if the player who put down that piece has won the game. This will probably be the most difficult part of the program, depending on how we chose to do it.

- Finally, at the end of each game, we should display who won and who lost, clear the board, and add a point to the winner's score.



So, the first thing we'll want to figure out is how to make an object wherever we click. Update the code to this;




Basically, the PICK SCREEN command takes an x and y value (in terms of screen coordinates) and a distance value (the distance away from the camera you want the object to be placed). The command then turns this information into a 3D vector, that can be retrieved using the GET PICK VECTOR X(), Y(), and Z() commands. Adding these vectors to the camera's position gives you a 3D location, in this case it's the 3D location of the mouse. Once we have that, we can position the piece appropriately.

We've also created a variable called currentObj, and set it to 1 in the beginning. If you go through the code, currentObj is the object being made when the mouse is clicked. If we made the same object everytime the mouse was clicked, we'd get an "OBJECT ALREADY EXISTS" error. So, we use the currentObj variable, which starts out as 1. When an object is created, currentObj increases, making the next object's ID 1 more than the last object created.

So, we've got it placing pieces down, but it's a bit too unrestricted. The first thing we need to do is only allow the user to place down pieces once, then they have to release the mouse button before making another object. Update the code to;



Pretty self explanatory there, basically we check if the variable canCreate = 1, if it does we allow them to create an object, but at the same time set canCreate to 0, disallowing them to make any more objects. Then, we check if they're not clicking at all, if so we reset canCreate to 1, allowing them to make another object.

Next, we need to restrict the player from making objects all over the place. We only want to allow them to make object's in each grid square. To do that, we have to check the X# and Z# variables we obtained from PICK SCREEN, to see which grid square they're in. Then, instead of positioning the object at the X# and Z# variables, we position it at the grid square's location.

Update the code;


First, I changed the matrix size so it equally divides by 3. So now its 90.

So, how did we figure out what grid square the object should go in?
Its pretty simple, as explained in the code, we know that the matrix is 90x90, and we know that 1 tile of the matrix is 30x30. We also know that the matrix is positioned so that the centre square is at 0,0,0. Using this info, we know that the top left grid square must be located at -30,0,30. The middle right square would be located at 30,0,0. Etc. We just run a few if statements to figure out which square the mouse is in, and we position the object at that square.

However, this isn't very efficient. Using a lot of if statements like that is pretty ugly, so lets fix it up a bit;



That uses a nested loop. Look up loop and step in the index if you dont know what they are at all. Basically, it loops through each possible x position for the piece, and for x possible x position, it loops through each possible y position. Essentially comparing every single position with NX# and NY#, in a more robust and efficient matter than the method we were using previously.

Alright, so now we're able to place object's down on the grid tiles. There's still 2 things we need to do in terms of restriction (right now anyways). The first is not allowing a piece to be placed down if the mouse isn't over the grid. The second is not allowing a piece to be placed down on a grid square that already contains a piece.

The first one is pretty simple, its just a matter of doing an initial check of the mouse's position before carrying out the rest of the piece positioning code.

The second, however, is a bit more complex. Now, logically we're going to need a variable for each tile on the grid, telling us if it's occupied or not. We could do that by defining a bunch of variables;



But thats very inefficient and bad programming practise, plus its boring typing all that out. So, in place of this, we'll use an array. I wont go in depth on arrays here, but basically an array is like a list of variables. It can achieve the above code example in a few short lines.

First, you have to define an array before using it. This is done with the DIM command. The syntax being DIM arrayName(arraySize). arrayName is whatever you wish to call the array, and arraySize is how many variables the array will have in it. We have 9 tiles on our grid, so we'll use an array with a size of 9. Add this code below the variable definition code;



We now have an array named tileStatus with 9 slots for data. Writing data to an array is just like writing data to a variable, except we specify which slot we want the data to go to. So, if we wanted to make slot 4 in the tileStatus array equal to 1, we'd use;



Simple, right?

If you're having trouble understanding arrays, play around with this program;



Here's the tough part. We need to figure out what tile number the user has clicked, based on the x and y location of the tile. For this we use a fairly simple formula;

slot = 3Y + X

Heres an image to help make sense of it;



The black numbers are the slot number, the green numbers are the x location, and the red numbers are the y location, of each tile.




Thats it for now, Ive gotta clean my room / do some chores and junk, if I get some time later today Ill finish it.

- RUC'

Your signature has been erased by a mod because it's larger than 600x120...
Back to top
Profile PM Email Website
dab
19
Years of Service
User Offline
Joined: 22nd Sep 2004
Location: Your Temp Folder!
Posted: 4th Nov 2006 18:25
Link
That code was made in DBC. That game was before my DBP days too. but I agree with everyone, that code is abit complex (and messy). Start with pong. If you insist in making pong. Here's how I did it (non code terms):

First, I made a variable to keep track of turns.
I made the tic tac toe board on the screen.
I wrote down the position the mouse had to be in order to click on those squares. Also, I assigned a variable to each of those squares, like the top left square would be A#, the next would be B# (That was before I knew of arrays)
I used an if mouseclick()=1 and used if's to decided whether or not the mouse is inside a square. If it is, then it would assign the variable a number, if the turn was 0 that meant it was player one, so I make the variable equal to 1 and paste an x on the screen, if it was turn 1 (or player 2's turn) I made the variable equal to 3, and pasted the image of 0.

Now, after each click, I would want to see if anyone won yet. So, I'd go through and check each square, so I'd use every possible way of winning and add the totals up, if the total was 9, then player 2 one, if it was 3 then player 1 one (For example, A#+B#+C#=9, player 2 won, the top row would be all 0's.


I know that might sound awfully confusing, but I'm not good at explaining without drawing. And I'd need a lot of drawing space. So, I hope that gave you a basic amount of information needed.

Take heed, never take advantage of the things you need, never let your self be overcome by greed. Walk a strigh line, pick up your speed and try. Everyone deserves a piece of the pie By: Shaggy
Back to top
Profile PM Email Website
Back to top

Login to post a reply

Server time is: 2024-04-20 06:46:35
Your offset time is: 2024-04-20 06:46:35