Category Archives : Flex/AIR Tutorials

Tip: Flex/AS3 keyboardEvent listener

If you are writing a flex app, you might get this error TypeError: Error #1009: Cannot access a property or method of a null object reference. if you do, it simply means that you are trying to do something with an object that hasn’t yet been created. If that object is the stage, then you are probably calling an init funtion on creationComplete. If you change this to applicationComplete, you’ll have the stage present. <?xml version=”1.0″ encoding=”utf-8″?> <mx:Application xmlns:mx=”” creationComplete=”init();” … >

HowTo ActionScript 3 (as3 flash or flex or AIR) Class and Object Inheritance, extends

It seems I have been getting alot of hits due to my post on AS3 inheritance, and I notice that most of the documentation and examples out there don’t really cover the whys and the hows in a thorough manner. There are a couple of parts to this little tutorial, the first being a kind of very basic demonstration of extending, and then some concrete realworld samples. You can jump ahead to the realworld samples if you are just looking to see how/why you might use extend to solve some real problems. Basic/intro to oop and extending in as3 extending event dispatcher to manage your own event queue extending event to create a custom event and finally extending Panel to make a drag/drop Panel Having classes and objects does not equal OOP. To understand a class, you need to understand that an object without state or behavior is meaningless, so to be an object, it must have those things. The object itself is an environment, it is like a scope, it’s a container which imparts a kind of semantic meaning to the function and variables attached to it. Having objects is very nice, but there needs to be something more, and that something more is inheritance. Without inheritance, objects are simply wrappers, and it would be just as well to create functions and simply pass in some kind of key to ameliorate what to do. With inheritance, you share state and behavior between objects. The common example is with a person, people have names, and […]

How To Flash CS5: Keyboard Navigation Action Script 3 KeyboardEvents 6

Well, I was watching an interesting little tutorial on keyboard navigation with AS3. Now, the guy’s tutorial was actually really good, however, it wasn’t really what I would call AS3. It was very on target for what it was doing, but didn’t leave much room for expansion in my opinion. So I decided to try my hand at changing it up a littler bit. Here is the code: This is put on the main timeline, in the first frame on an actions layer. That is, you just create a new layer, and name it actions, it’s just a convention. import; import; var currentKeyDown:uint = 0; var Keys:Object = {up: 38, down: 40, left: 37, right: 39,r:82, shift: 16, ctrl: 17, z:90, x:88}; var CurrentKeysDown:Object = {up: false, down: false, left: false, right: false, shift: false, ctrl:false}; stage.addEventListener(KeyboardEvent.KEY_DOWN,setCurrentKeyDown); stage.addEventListener(KeyboardEvent.KEY_UP,clearCurrentKeyDown); setTimeout(updateCanvas,100); function setCurrentKeyDown(event:KeyboardEvent):void { trace(event.keyCode); for (var key:String in Keys) { if (Keys[key] == event.keyCode) { CurrentKeysDown[key] = true; } } } function clearCurrentKeyDown(event:KeyboardEvent):void { for (var key:String in Keys) { if (Keys[key] == event.keyCode) { CurrentKeysDown[key] = false; } } } function moveEntity(entity:MovieClip):void { currentKeyDown = 0; var x:Number = 0; var y:Number = 0; for (var key:String in Keys) { if (CurrentKeysDown[key]) { currentKeyDown = Keys[key]; } switch (currentKeyDown) { case Keys.shift: entity.speed += entity.speed * .05; break; case Keys.ctrl: entity.speed -= entity.speed * .05; break; case Keys.z: entity.rotationSpeed += entity.speed * .06; break; case Keys.x: entity.rotationSpeed -= entity.speed * .06; break; case Keys.r: entity.x = 200; entity.y = 200; break; case Keys.left: […]

AS3 Multiple Inheritance/Mixins 2

Well, I just got done reading this post about multiple inheritance in as3 which probably should have been titled AS3 mixin technique, because that is more or less what it is, check out the wikipedia article on mixins for some history and pros and cons. I’ll will admit straight out that I am a supporter of MI and Mixins and the like. I am not much for the aristotelian idea of the universe, sometimes A is A, and sometimes it’s both A and B and MI, when used responsibly helps you to find more elegant and concise solutions to a great many problems. Just because people use something incorrectly in some instances doesn’t make that thing inherently evil, take for instance perscription drugs, would you rather painkillers where completely banned or never prescribed just because some or even alot of people abuse them? No, a great many things when used excessively with little understanding of what it is and how it works can be called evil, but they aren’t, the people who abuse them are evil, let’s start calling a spade a spade. The problem with MI and Mixins is not that they are evil, it’s that evil people use them for nefarious purposes. Anyway, back onto topic, I liked the guys article, and to be honest, he was pretty brave for putting it up, the minute you say something about MI, either way, a “discussion” read “flamegeddon” ensues, not always, but it’s generally a risk when you start throwing words like Inheritance around with […]

Adobe Flex/AS3 MX:Grid Class

Well, I said it in a previous flex tut, that you shouldn’t manually create your mx:grids cause it’s super ugly, instead of just telling you, I decided I’d show you, heres a basic start class for creating an mx:grid dynamically, you can modify the previous demo code to use it easily, that’s how I tested it. package org.jasonmartin.demo.views.components { /** * … * @author Jason Martin */ import mx.containers.*; public class Table { private var rows:Array; private var pointer:int; public static const NAME:String = ‘Table’; public var id:String; public function Table() { this.pointer = 0; this.rows = new Array(); } public function addRow(row:Array):Boolean { this.rows.push(row); return true; } public function addColumn(col:Object):Boolean { if (typeof(this.rows[this.pointer]) != ‘object’){ this.rows[this.pointer] = new Array(); //just in case } this.rows[this.pointer].push(col); return true; } public function next():int { this.pointer++; return this.pointer; } public function previous():int { this.pointer–; return this.pointer; } public function resetPointer():Boolean { this.pointer = 0; return true; } public function grid():Grid { var g:Grid = new Grid(); =; for (this.pointer = 0; this.pointer < this.rows.length;this.pointer++) { var r:GridRow = new GridRow(); = this.pointer.toString(); for (var i:int = 0; i < this.rows[this.pointer].length; i++ ) { var gi:GridItem = new GridItem(); = “Row_” + this.pointer + “_Item_” + i; gi.addChild(this.rows[this.pointer][i]); r.addChild(gi); } g.addChild(r); } return g; } } }

Adobe Flex View Partialing and xmlns

When you are creating an AIR/Flex app, and especially when doing so using PureMVC, you really need to break your views into component parts. With a very complex view component, you made need to break your components into components. One thing that, in all my reading, I haven’t heard said, is that you cannot think of MXML as XML, it’s not, think of it as an ActionScript class that instead of defining in ActionScript, you define it in an xml like markup language. You need to think of it like this, because you need to think in OOP, and each component is a thing which has State + Behavior. Don’t just put a textinput, put a textinput object that knows who and what it is, and what it is supposed to do, encapsulate all of the textinput behavior into that component, and then suddenly, you have a reuseable view component that can have alot of complex behavior and you only ever have to code it once. This is going to be pretty simple, and I will just start with a basic app, and create a standard package structure. My package will be org.jasonmartin.demo, and for that package, I’ll create a subdirectory called views, and in the views, components and form_components. As you can see, I have created some MXML files in there, here is the code for each: //Main.mxml //Form.mxml //MyTextInput.mxml These are pretty basic views, and I have coded in the basic functionality. The Form adds children to itself, and this is where most […]