I have been looking around for a while for a new programming language to learn having looked at the possibilities of Silverlight, XNA, and Ruby but I have decided to learn Flash with ActionScript 3. I have dabbled with Flash in the past but really nothing more than could be achieved with PowerPoint. The programmability of Flash has always been a put off as it has often seemed a little cumbersome and less than intuitive. However, I have been looking at the latest version of ActionScript, version 3, with its object nature and it caught my eye. This series of articles will follow progress on the development of a Flash application using Action Script 3.

I need an application to build this project around as it is much easier finding your way around something new if you have a specific application in mind and since I started off life developing computer games I have decided on a simple pair matching game: flip flop, or whatever you want to call it. The general idea will be for the player to be presented with around twenty or so face down cards, each with just two pairs placed in random order, and the user has to find the two matching pairs – lets throw in a timer to offer some replay value.

There are three aspects to this development, learning Action Script 3, learning Flash, and developing the game design. I am deliberately keeping the game design simple so I can focus on the programming elements. The screen relationships will include a welcome/attract mode screen leading to a setup/get ready screen, then into the main game loop and finishing with the user either finding all pairs or choosing to exit the game.

So far I have the application engine object, the background object, the card object and the start button operational. Creating objects was the first major element to discover.

Essentially for designing the object to use I create a temporary layer upon which I create and place my object – for example a rectangle I am going to call my Card object. I then right-click this and select convert to symbol. Once I have the symbol created I delete the temporary layer as I do not need it anymore. Next, I needed to right click the symbol – in this case the Card object and select Properties then click the Export for ActionScript box under Linkage and put in the Class path (the purpose of the Class path is to keep the objects I create distinct from anyone else).

Once this was done I clicked on File, New and under the General Tab selected the ActionScript File. Inside this file I included the basic object creation pattern (excuse the formatting if the indentation appears odd).

package uk.co.jasonslater.app1
{
import flash.display.MovieClip;
import flash.display.Stage;
// define the class
public class Card extends MovieClip
{
// keep a reference to the stage location
private var stageRef:Stage;
// construct the object based on the stage location and the given co-ordinates     public function Card(stageRef:Stage, ix:int=0, iy:int=0)
    {
     this.stageRef = stageRef;
     x = ix;
     y = iy;
     }
  }
}

This will construct an object, accepting a stage location, an x position and a y position. The next step was simply to create a number of instances of the Card class and place them on the background, leading to the following:

Object registration was another important area to bear in mind. When converting an object to a symbol you will get the opportunity to set the registration, i.e. where the symbol will be placed relative to its x and y position (top left, middle, bottom right, etc). The default is middle centre however many of my objects are set to top left. It took a while to figure out how to change this later, but you double click on the symbol icon under the Library and you simply drag you image relative to the small cross hair (so to set registration top left you need to drag your symbol so its top edge is resting on the cross hair).

It sounds quite simple so far but it has taken quite a lot of reading and experimentation to get this far, some of the areas I need to clarify and develop:

• Understanding the Stage and the relationship of Objects
• Attaching an event to the Card Class
• Possibly Converting the Card Class from a Movie Clip to a Simple Button to detect a click (unless I use collision detection)
• Understand the process of garbage collection and object deconstruction
• Randomise ten numbers to create the 10 sets of pairs
• Where to insert the core application loop

Read Part 2 of Developing an application using Flash and ActionScript 3.

Related

• Embedding Flash into a web page?
• Enter The Flash Game Development Competition
• Google Enhances Flash Indexing
• Convert PowerPoint Files In A Flash
• Apple iPhone And The Big Flash Challenge