Flex Development

by Harry B. Garland

Q&A: Advice for an entry-level ActionScript developer looking for the next challenge

I was recently contacted through my website with a good entry-level question about what to learn next after creating an all-ActionScript Flash application.


Question:

I am an aspiring AS 3.0 developer and was wondering if you could answer a question for me… I am currently just going at it on my own with books and online tutorials… I am wondering if you could tell me what you think I should focus on… I’ve been working on this website constructed entirely in ActionScript.  [link omitted.]  This is really dull now, but the point is to practice OOP.  What do you think? is this the way to do it?


Answer:

Anything that helps you learn and practice programming
on the Flash platform is a good thing. My recommendation if you are
looking for a next focus is to check out Adobe Flex. It is similar to
Flash programming with no timeline, and it adds a wonderful new
dimension to programming with MXML. MXML is a software modeling
language, usually used in combination with ActionScript, and allows
you to express many parts of your application in a way that is more
logical to understand and manipulate. For large Flash applications
where there is a lot of ActionScript, Flex is the leading standard for
“gluing together”, or organizing complex logic. Also, Flex has been a
very easy sell for me when talking to clients who are looking for
Flash development. My best selling points are: It reduces time of
development and is ideal for data-driven web applications.


Question:

Hey Harry,

Thanks for the in-depth reply! I’ve gone ahead and picked up a copy of Flex 3 and am very impressed with mxml… I was a bit nervous about having to learn yet another language, but it seems like its alot like html. I definitely see how this piece of software is the next step in AS development.

So I would like to see other flex sites for inspiration and so forth…do you have a portfolio page by chance? or do you know of any flex pages off the top of your head that you really like?


Answer:

I’m glad you see the path forward with Flex!  I didn’t
want to use the “HTML” word because it is more of a Markup language
than a Modeling language, and it has become such a lock-in to a very
limited set of tags and functions, whereas MXML is extensible in ways
that you will continue to learn throughout the first year that you use
it.

MXML is a different kind of language than anything I’ve used before
because it is a software modeling language, not a programming
language.  A little known fact that should be stressed from the
beginning is that the Flex compiler first turns MXML into
ActionScript, and then only ActionScript gets compiled into your
completed SWF file.  Everything that exists in MXML is essentially a
specific recipe for how to logically create ActionScript out of it.
(This happens behind the scenes and you generally don’t get to see the
resulting ActionScript, but you should be aware that it is happening.)

You will learn a lot of tags as you go forward.  The best place to
learn about these tags is http://blog.flexexamples.com/tags/ because
the examples are small, focused, and in the form of completed
applications.  Start by clicking on the reddest tags first, then click
through each example until you see one with source code that is at the
right speed for you.  Ignore anything that starts with “Fx” because
that is for Flex 4 beta.

The first 3 concepts that I suggest learning about are: States,
Events, and Data Binding.

Data Binding is another part where ActionScript is generated behind
the scenes that you don’t get to see, but you should be aware of the
invisible.  It works like a pitcher and a catcher.

The pitcher is ActionScript that looks like:
[Bindable] var myVar:String;

The catcher is MXML that looks like:
<Panel title=”{myVar}”/>

Simply put, whenever you have ActionScript that says
myVar=”something”, the Panel title will automatically be updated to
reflect the changes.

What’s REALLY going on in the pitcher is that [Bindable] causes myVar
to get turned into:
var _myVar:String;
function get myVar() { return _myVar }
function set myVar(value)
{
_myVar = value
dispatchEvent(…) // tell the world that myVar has changed!
}

And what’s REALLY going on in the catcher is that code gets added
during the construction of the panel that says: “listen for that event
that gets dispatched when myVar changes.  THEN, do this: panel.title =
[the new value]“.

Now that I’ve explained some of the invisible parts, it should be
easier for you to understand the visible parts through resources
online.  (Too many experienced Flex developers don’t understand the
invisible parts.)  For everything else, you can always start with a
google search!

I hope this helps!

February 18, 2009 - Posted by Harry B. Garland | Uncategorized | | No Comments Yet

No comments yet.

Leave a comment