Sunday, December 5, 2010

Project Jumper Part 1: Let's get organized

Getting started for real this time. This first part is stuff I've done over and over, so it's going to sound more tutorialish than future installments. Don't worry, I won't know what I'm doing much longer.

Anyway, the first thing to do is to pick a platform.

I'm going to go with Flash/Actionscript, because it's pretty similar to what I'm already familiar with, and because with a little fussing it's free. I'm willing to spend exactly $0.00 on this project. While we're at it, I'm going to snag Flixel, just because it looks like a good fit for what I'm trying to do.

There's a couple choices of development software for Flash. I'm going with FlashDevelop because hey, free. Also, I happen to like its interface better than the official Adobe software, anyway.

Once I've got it installed, it's time to make a folder to work in. Because I'm too lazy to navigate in My Documents or Users/Whatever or whatever silly business Windows thinks I should keep my files in, I'm just sticking all this crap on the desktop.

Here's my flashstuff folder. It's full of lots of things, actually, most of which I don't even know how to use. I just grabbed them just in case. I've also got more than one version of flixel in there. Whatever, who cares.

And this incredibly boring fellow is my actual project folder. It's empty at the moment. Let's fix that. First, let's boot up FlashDevelop. Incidentally, I'm using Flash Game Dojo's tutorial as a starting point for how to do this.

Ah, nothing like a blank canvas to induce creativity panic. And to break my blog's margins. Let's start a new project:

Unlike the tutorial, I left the checkbox to create the directory unchecked. I already made the directory. I don't need two directories. That would just be silly.

flashdevelop went ahead and put some stuff in my folder. 

And flashdevelop itself looks something like this:

The bin and lib folders are full of stuff I don't care about, but that src folder is useful. Right now, it has in it. That would be a convenient skeleton to start coding from. So I'm going to just delete that.

What I want to do now is to add flixel to my project. Flixel is a library that makes cute, pixelicious games easier to make. Now, the tutorial on Flash Game Dojo wants us to unpack flixel somewhere, then point flashdevelop's classpaths at that, so that any program we write will be able to use flixel. I'm not going to do that.

Instead, I'm going to just copy all the flixel sourcecode into my project folder. So, I go back to my flixel folder, copy the entire org folder

and paste it into the src folder of my project.

Now we can see that flixel is right there and available for use.Why did I do it this way? Two reasons. One, if I decide to screw around with the flixel code itself for some reason, any changes I make will only be for this project. Also, if a new version of flixel comes out, I can download it and use it in new projects, and this one will be unaffected.

OK, one last bit of prepwork before we write some actual code. I want to start actually organizing my stuff, so let's make some more folders. To store my code, I'll make a folder structured a little like how flixel's is organized. Flixel has org/flixel, so I'm going to use com/chipacabra/Jumper. Apparently, you're supposed to put your own domain name in there, but I don't actually have one, so I'll just pretend I do. If I use code from another site, it would be in com/othersite or whatever.

OK, we're ready to code. That gets thrown away, and we put a new file, in its place. Just to make sure everything is working, I'm going to cut and paste stuff from that FGD tutorial. Obviously, I change names where needed. We'll also need a This is actually going to down in that com/chipacabra/Jumper subfolder I created. Another cut and paste job, and I've got something like this:

And... I get an error.

Oh, right. See, anything that you put in one of those subdirectories, you have to label it. So in, I have to change the line at the beginning from just 'package' to 'package com.chipacabra.Jumper' This seems like the sort of thing that there should be a hotkey for, but I haven't found one.

Try again:

And we have success.

Here's the final, working code:
    import org.flixel.*; //Allows you to refer to flixel objects in your code
    import com.chipacabra.Jumper.PlayState;
    [SWF(width="640", height="480", backgroundColor="#000000")] //Set the size and color of the Flash file
    public class Jumper extends FlxGame
        public function Jumper()
            super(320,240,PlayState,2); //Create a new FlxGame object at 320x240 with 2x pixels, then load PlayState
 package com.chipacabra.Jumper
    import org.flixel.*;

    public class PlayState extends FlxState
        override public function create():void
            add(new FlxText(0,0,100,"Hello, World!")); //adds a 100px wide text field at position 0,0 (top left)

Next time, I throw all of that away and make something different.


  1. This comment has been removed by the author.

  2. When I try to run it, it says "In order to build this project, you must mark the AS or MXML as "document class" in the project tree." please help!

  3. Right-click on, "Set document class"!