AS3 Experiments – MVC in AS3 Tutorial

I’ve been using Backbone.js and jQuery quite extensively for the past year or so and I’ve only recently gotten back into AS3 dev. And I’ve never actually ever used any MVC framework in AS3/Flex, so I wanted to take a quick break away from my AS3 game engine series to have fun and mess around with MVC in AS3. As I didn’t want to stray too far from my game engine, I decided I wanted to whip up some base Model/View/Controller classes, and then extend those to an EnemyModel/EnemyView/EnemyController class.

The reason this is in “AS3 Experiments” is because this isn’t just straightforward MVC. I’ve added an expandable Model. Imagine you’re loading in JSON from a file or endpoint and you pass the data straight in to the Model’s constructor or some “setPropertiesFromJSON()” type function. I wanted to play around with the idea of, “what happens if that JSON file has properties inside that you don’t have hardcoded class variables for?” In JavaScript, this wouldn’t even be a conversation. But in AS3, while you do have Dynamic classes, I didn’t want to go that route. So, as we’ll see, if the model doesn’t find the specific class property you’re trying to set, it saves the data anyways in an _attributes Object so you don’t lose it. More on that later.

So, I’ve been reading through Rex van der Spuy’s book, AdvancED Game Design with Flash and right from the start, the book just jumps right into MVC… fantastic! I’ve found it’s tough to find “advanced” books and especially “advanced” tutorials online, so this book was very refreshing. There are no sections titled “Data Types in AS3”, or “What is a Function?” I’m really enjoying this book.

In the online tutorial front, I came across a couple good sites worth mentioning on MVC in AS3 whilst googling, so I’ll list those here as well.

  • Advance AS3 Game Dev 02: Rectangles and MVC – this is video #2 in a series on advanced game dev. Don’t waste your time looking for Video 1… I spent probably 10 minutes googling before reading the youtube comments (because who reads those?) but most of them were people complaining about video 1 not being public. oh well… I’ll take what I can get. Pretty good series.
  • The Model-View-Controller Design Pattern in Actionscript 3 on the Swinburne University of Tech site had a great tutorial that was quite helpful as well.

Ok, enough love, let’s code.


AS3 Mask Example

I was tasked recently with adding a way to scroll clickable buttons inside of a fixed-height UI panel for a new release of StrataLogica. I haven’t dealt much with masking in AS3 so I thought I’d post a quick example of how masking works. The idea is that you’ve got an area for buttons ( content items/whatever ), and that sometimes this area of buttons exceeds the height of the area the content must fit into. So you need some way to scroll these buttons up and down.

The biggest, most irritating thing I ran into, and that you may run into when trying to figure out masking is: empty Sprites/MovieClips will always default to a height/width of ZERO. Keep this in mind and we’ll return to it towards the end of the post.

Lets look at a visual representation of what we’re trying to accomplish.

In the image, the container holding the buttons is 170px high but we only have 100px worth of area where we can display the button list. If we create a 100px high mask and apply it to the button container, it will hide everything that is not inside of those 100px. Then, simply adding some scroll up/down buttons, we can move the button container up or down (the mask does not move once set) and it looks like we’re scrolling our list of buttons.

Read on to see the code and example FLA/SWF/ZIP


Geolocation Gotcha

I’ve been working on an Air for Android app for the past month or so and I’ve been finding some significant little holes in the current version of the Air/Android SDK. I’ll start with the latest fist-shaking issue I’ve come across. The Geolocation class, only supported on Mobile applications, is a Read more…

Air, Android, and cookies

What: In using an Android app, I need to send an authentication request (username/password) to the server and the server needs to send me back a cookie.  We all know how you would use JavaScript to grab cookie/session data and then you could send it right into flash.

Problem: How or where would you find cookie being sent to you in your Air/Android app that uses no browser?

Solution:  Headers can be found in the HTTPStatusEvent object!  Hurray!  It took me way too long to find the answer to this issue.  Everyone on google is happy to tell you “Hey there’s a manageCookies setting on the URLRequest object!”  Great, how do you find the damn headers?  In fact, as you’ll see in the following code, you dont even need to mess with that manageCookies setting.  I set it to true and got headers.  I set it to false and god headers.  I didn’t include it at all and got headers.  Sweet.

Image GPS Extractor Android App

I just wrapped up my first little Android App using Adobe AIR.  As far as development goes, that was one of the smoothest experiences I’ve ever had.

I’m currently developing a mobile app for a project at work.  I’ve never created a mobile app before, and the project app is going to take a few weeks of solid work to complete.  I wanted to see the whole process from dev to release of a mobile app much sooner…. like, now.  So Friday I started writing classes and code that I’m going to need for the project at work, and that I could pull out of the project and use in a small tutorial project that I’m posting here.


AS3 Why Your Bitmap Doesn’t Care About Your Input!

Over the past couple of years of doing AS3 coding, it has frustrated me to no end as to why I couldn’t create a new Bitmap object and add Mouse Event Listeners to it.  As I first got into optimizing AS3 display code, trying to shy away from MovieClips everywhere, I started using Sprites more.  As I started learning about the efficiency and pixel-level control of the Bitmap/BitmapData class, I started using those classes more and more.  And every once in a while, I would want to add Mouse Event Listeners to a Bitmap.  Every time during those every once in a while times… it never worked.


AS3 External XML Animation Scripting with TweenMax

Continuing my foray into preparing for collaborative Flash Game Developement, I’ve been thinking a lot about tools, how to set the project up to allow for a maximum variety of skill levels and skill sets to collaborate on the project while trying to keep Flash and Actionscript as much removed as possible.

In a recent post, I mentioned 3 things I had learned so far about collaborative game dev.  During one of my first “test runs” of the engine ( aka.. one of the ‘more successful failures’ ) I had realized that with a number of people working on the project, most of which have no idea what the inside of Flash looks like.  Which is great!  We all have our strengths, and because they dont know Flash, it just leaves more room for things that *I* dont know.


AS3 Date Class, PHP and Unix Timestamps

This is a real quick post about Unix Timestamps, PHP, and ActionScript 3’s Date class.  When creating a new Date instance, you can pass in a Unix Timestamp into the Date constructor.

[sourcecode lang=”php”]

var myDate:Date = new Date( unix_timestamp_from_php );
trace( myDate.toString() );  // Invalid Date


When I was working with this, I continually received Invalid date in my output window.  Looking into the matter, if you read’s time() function description and then taking a look at livedocs Date class we’ll quickly see the problem.


3 Lessons Learned in Noob Collaborative Game Development

I’m currently working on a 2D RPG Game Engine ( think Zelda or FinalFantasyII/IV ) in AS3. At the start of this project, as typical projects with friends go, it seems like a completely easy task. “Hey you know AS3… can you write us a quick game engine for this idea we have?” Sure… I’ve finished a simple little game before, I can totally do that.

Take 1:

From previous (limited) game dev experience I know I’ll need to set up a heirarchy of classes to handle Player Characters, Enemies, Scenes, Buttons, etc. So, thinking things out logically (read: noobishly (?) ) the first thing the team will want to see is going to be a the big-picture, visual framework. I sit down and start hammering out a SceneManager to handle scene changes easily. I’ve created an IZFScene interface to standardize the methods of all of my Scene objects for the SceneManager to manipulate. I’ve got my placeholder backgrounds that I tossed into the Flash Library from photoshop ( or MSPaint ) and I’m off and running creating smooth fade-in/fade-out transitions between scenes. The engine process looks like:


AS3 – AMFPHP High Score Database

This is a little tutorial covering using ActionScript 3, PHP and AMFPHP to create a MySQL-based High Score Database.  You should have some familiarity with each as this isn’t exactly a “Beginner’s How-To.” For a recent game project I’ve been working on, one of the requirements was a simple High Score Database. After finishing it, I thought I’d post about how I went about coding it. Let’s jump right in with the ActionScript first…

So from the game’s .as files, the idea was to display a DataGrid that shows all the scores submitted to the database. I also wanted to create a ScoresDB class that handles all of my database calls and parses the database results, all ready to be added to the DataGrid.

So that we’re all on the same page, will refer to the main class that handles adding the DataGrid to the stage, and handles other game functions. will refer to the ScoresDB class that handles the AMFPHP/PHP/MySQL calls. HighScore.php will refer to the AMFPHP Service that actually interacts with the MySQL database and returns result sets.