Posted on

Rapid Development: Coding the Battleship program in 18 hours


It’s been a while since I last updated my blog lol. So I’ll be adding several posts over the next day or so.

So a couple weeks ago our Topics in Computer Science teacher gave us a simple project. Create a program that can interact with a remote server. This server was designed with one purpose, to play battleship with remote clients. Several days into the project, my friend adam and I were talking about some dirt code when we decided that whenever we finish our group projects. We should make our own good code project.

Dirtcode: Bad code. Code that either doesn’t work, is riddled with errors, or is unreadable.

So after two weeks of wrasslin with the program, we finally completed our team projects. It was Tuesday night when we finally got everything done, and we would be presenting our projects Thursday. After spending so much time on the project, I decided that I was not going to start our group project until the next day when I would have more time to work on it (because of finals) and I would be fresh after a good nights sleep.

So the next day I wake up at Noon, take a shower, and eat. I showed up to his house at 2ish.

Because I already had a working program I created a simply GUI that was able to “snap” into my current project.

Good programmers are able to make their classes so that another class can simply “snap” into it without too much code modification.

I created a simple game board that was able to borrow the methods from my original game. Each cell on the board could calculate their own coordinates (X: 320 Y: 80) and turn them into Battleship Coordinates (H4) then send them to the server, which would tell the program if the coordinate was a hit or miss, and then change the color of the cell depending on if it was a hit or miss.

Next I transferred over the methods from the main program that I would need to send and receive hits, and placed them inside of my GUI class.

Next I created the necessary icons for each cell:

From left to right: Water, Hit, Miss, Selected

Then I set up each cell so that when you hover over it, it switches to the select Icon, unless that cell is a hit or miss. Than it doesn’t change. After the gameboard was all set up, I decided to create a simple interface in Photoshop:

I set up the buttons so that when the mouse hovered over them, they would switch from their original image to one where they look pressed in. In creating the buttons I ran into a bug where on redraw the cells would get seriously messed up, even refusing to draw in some instances. After a couple hours of frustrated experimenting, I figured out that I was extending the wrong class. 8 characters later, I had a working board.

The next thing I decided to work on was updating the game status automatically. Adam suggested that I use multi threading so that the two programs could run simultaneously. So after a quick google search I had an auto-updating program. The program would update my GUI class and tell it when the game was over and when I was waiting for my opponent to place their ships.

The final element, was to make it to where I could drag and drop ships on the board, get their coordinates, and place them on the server. Adam psuedocoded a draggable rectangle. From there I was able to move the ships all over the board. Next I made the ships snap every 40 pixels. Finally I grabbed some images of warships off google and added them to the draggable ships.

The final result:

Full client to be released soon…

Advertisements

About boringtechie

Hello, I'm the boring techie! So you've landed yourself on this site due to me or someone else linking you here, and you're wondering: "What does this kid do, and why should I even care?" Right? Of course you are. Basically, I'm a Techie, though I'm not as boring as the title says, that's one of those things where the word means the opposite of what's REALLY going on... Anyway, I write tuts and make commentaries. That's about it...

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s