Shirley Stevenson
MAT 190 – Flash 2 (ActionScript Class Blog)
Flash Game Development with Flex and Actionscript
Article by
Matthew Casperson (4,886 pts ) , published Sep 23, 2009
While I was looking through flash websites for game development topics in ran into a website called Flash Game Development with Flex and Actionscript (
http://www.brighthub.com/internet/web-development/articles/11010.aspx). This website caught my eye because of the cross platform compatibility. My previous work related experience has been in multiple platform and operating system development and conversions. The idea of being able to develop games on different platforms interested me, since I have never been much of a Windows fan.
The article points out several advantages with using Flex SDK and ActionScript:
Cross platform compatibility – there is a flash player for every major platform.
Easy development – publishing a game is as easy as uploading the swf file.
Almost zero installation requirements – the end user only needs a web browser with the flash plug in installed
Free tools – all you need is the free Flex SDK and a text editor.
The tutorial covered many different topics, such as:
Downloading Flex 3 SDK
Creating a simple application
Sample source code
Compiling and running the program
Demo swf and source code
There is also a series of links that walk you through the development process. Some of the links are as follows:
1. Flash Game Development with Flex and Actionscript - Getting Started
2.
Flash Game Development with Flex and Actionscript - Double Buffer Rendering3.
Flash Game Development with Flex and Actionscript - Embedding Resources and Adding Game Objects4.
Flash Game Development with Flex and Actionscript - User Input and an Animated Background5.
Flash Game Development with Flex and Actionscript - Adding Weapons6.
Flash Game Development with Flex and Actionscript - Collision Detection7.
Flash Game Development with Flex and Actionscript - Bitmap Animations8.
Flash Game Development with Flex and Actionscript - Music and Sound FX9.
Flash Game Development with Flex and Actionscript - Defining a Level10.
Flash Game Development with Flex and Actionscript - Tiled Background RenderingThe tutorial also included several getting started links, such as:
Flex download -
http://www.brighthub.com/link/link.aspx?u=http%3a%2f%2fwww.adobe.com%2fproducts%2fflex%2fflexdownloads%2f&p=11010textpad download -
http://www.textpad.com/.
Debugger -
http://www.brighthub.com/link/link.aspx?u=http%3a%2f%2fwww.adobe.com%2fsupport%2fflashplayer%2fdownloads.html&p=11010Sample graphics -
http://www.flyingyogi.com/fun/spritelib.html.
Creating the Application
(Information from the website)
Conceptually Flex splits up an average program into two sections: the GUI and the Actionscript code. The GUI is created in an MXML file, which is an XML file that contains user interface elements nested in tags very similar to HTML. Note that the MXML file can contain Actionscript code inside an mx:Script tag, but the main focus of the MXML file is to define the user interface.
The top level tag of an MXML file is the mx:
Application tag. This Application object is the entry point of the Flex application, and is the most logical place to start.
main.mxml Actionscript Source Code
We start by defining some of the properties of the Application object. These properties can be set through attributes in the mx:Application tag. This should look familiar to anyone who has written HTML.
width and height
Specify the screen size of the program in pixels.
framerate
Specifies a limit on the frames per second. The default is 24, but since we want the game to run as fast as possible it’s best to override this with a much higher number. Note that just setting the framerate to 100 doesn’t guarantee that the frame rate will always be 100 (or even get anywhere near it). This property just sets a ceiling on what the frame rate could be.
creationComplete
Attaches a function to be called when the Application has been created. We use this as the entry point in the program.
enterFrame
Attaches a function to be called every time the screen is redrawn. We will use this to repaint the screen with the next frame of the game.
The mx:Script tag gives us a place to write some Actionscript code. The [CDATA[ ]] tag just means that any special characters inside the mx:Script tag will be interpreted as text rather than XML characters. Inside the mx:Script tag we need to add the two functions which match the values for the creationComplete and enterFrame properties.
Compiling and Running
To compile the program you need to run the command mxmlc main.mxml from the command prompt. You can then open up the resulting main.swf file in the Flash debug player through File->Open.
And the end result? A blank screen that does nothing. Not terribly exciting I’ll admit, but it is a start. We will build off this code in part 2 of the series to start drawing to the screen.
Go back to Flash Game Development with Flex and ActionScriptRelated Files
Demo SWF FileDemo Source Code