Tutorial Actionscript 3 Create Your Simple Spaceship Game for iOS or Android – 1: Adding your Spaceship

Screen Shot 2014-07-31 at 3.52.26 PM

Hellow Guys, this week I begin this tutorial in Actionscript 3 for total beginners and it shall be very simple. What we will develop here shall be something like We did before in Cocos2d Objective C tutorial, a spaceship shooting others spaceships.

I will be using Adobe Flash Professional CS6, but if you are familiar with Flash CC or Air Project you can easily adapt to both of them. The tutorial will be really simple, and is for Newbies that never see a Flash CS6 before, a real step-to-step and will abort since the ship movement till the publication to the Play Store or App Store. Well Let’s begin.

I-Creating a Project

 

-First of All: Open your Flash Professional and select AIR for Android. “Oh but I want to publish for my iPad”, don’t worry, you can change it later.

Screen Shot 2014-07-31 at 1.03.32 PM

-Choose the template 800 x 480 Blank and push “OK”.

Screen Shot 2014-07-31 at 1.08.35 PM

Now we have a great white screen project and here is where we can start to work.

Screen Shot 2014-07-31 at 1.11.32 PM

II-Creating the Main Class

First of all we are gonna create the class for our project.

 

-In Class type “Spaceship and click on the pencil at the right side of the textbox”.

Screen Shot 2014-07-31 at 1.11.32 PM

-A message telling about “A definition for the document class could not be found in the classpath” may pop up, click over “OK”

Screen Shot 2014-07-31 at 1.25.20 PM

-Click over the pencil again and you may select Flash Professional or Flash Builder to edit your ActionScript 3 class, pick the best for you.

Screen Shot 2014-07-31 at 1.32.30 PM

-Now let’s see if the Actionscript is linked to our Flash Document. In the Script you shall have this code:

Screen Shot 2014-07-31 at 1.34.53 PM

-In Constructor code type trace(“inited”);

*This trace is something like the “System.out.println” from java or “System.Diagnostics.Debug.Write” from C#, it shall print in Output and not in the screen.

Screen Shot 2014-07-31 at 1.37.10 PM

-Save your “Script-1” with the name Spaceship.as in the same place that your Flash Document is saved, if it wasn’t save yet, go there and save with the same name Spaceship.fla

Your folder should be something like this:

Screen Shot 2014-07-31 at 1.41.03 PM

-Now let’s test our Document, back to your Flash CS6 Document, your Spaceship.fla and go to “Control”->”Test Movie”->”in Air debug Launcher via Desktop”.

If you want to test something now in your own Android Device and you are using Flash CS6, you certainly will need to upgrade your Air for Android to 4.0 or later, here in the Screenshots you can see Air 3.2 for Android and it won’t work in early upgraded devices.

if in Output you can read “inited”, that means everything till now you did right and your Class is linked to your Flash Document and we are ready to start to work.

Screen Shot 2014-07-31 at 1.49.08 PM

 

III-Creating the Spaceship

 

Copy the image of a Spaceship bellow to your Flash Document:

 

spaceship2

I created it, so we  won’t have any problem to use this ship.

A pop up “Preparing to import” shall comes to your screen.

Screen Shot 2014-07-31 at 3.22.00 PM

 

Now you have a Spaceship Bitmap in your flash document.

Screen Shot 2014-07-31 at 3.25.09 PM

 

-Let’s change the stage color to see it appropriately.

Click in the stage (the big white part of our document, this way we can see the Properties of the stage and not from the Spaceship.

Change the Stage color from white to Dark Grey.

Screen Shot 2014-07-31 at 3.27.14 PM

 

Now your Flash Document shall look like:

Screen Shot 2014-07-31 at 3.29.55 PM

 

Now we need to Convert this Spaceship to a Simbol.

 

-Click over the Spaceship (to select it)

-Click over “Modify->Convert to Simbol” or just hit F8.

 

in Name type: Ship -> Can be anything

Type: Movie Clip

In Advanced check “Export for Actionscript” -> So we can have a class over it.

Class: Ship -> The first letter shall be in caption and it won’t be Spaceship so it wont conflict with the Document’s actionscript file.

Base Class:  flash.display.MovieClip -> the library where will be extended our class.

Screen Shot 2014-07-31 at 3.41.00 PM

Push OK!

“A definition for this class could not be found….”

Push OK again.

Now in the library we will have a Ship with AS Linkage “Ship”.

Screen Shot 2014-07-31 at 3.43.01 PM

(obs: ignore the Symbol 1 from the image)

In true for now I don’t plan to use the Ship.as, we won’t need it.

So click over the Ship again and check the Properties.

In type: “myShip”

Screen Shot 2014-07-31 at 3.48.55 PM

And well, time to move it.

But the movement will happen next week. In the next tutorial part. 🙂

 

And if you have a android device, check out my last “simple game” “When My Cat Fall” in this link here. 🙂

The next tutorial is on, click HERE TO READ.

Ty, cya 😉

 

One thought on “Tutorial Actionscript 3 Create Your Simple Spaceship Game for iOS or Android – 1: Adding your Spaceship

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 )

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