I wanted to post a link to this article that I had the pleasure and opportunity of writing for Flash Magazine about the Mate framework for Flex. Mate is an awesome framework used for developing applications using Adobe Flex. I’d like to thank both Jens from Flash Magazine and Laura from ASFusion for their help reviewing and getting the article together and published. I’ve wanted to write for Flash Magazine a very long time, so massive respect for the opportunity!! I was also unclear on a couple of things about the framework and Laura’s input was a huge help and greatly appreciated.

You can check out the article here:

Mate: Event driven framework for Flex
by: Sean Moore, July 2008 for Flash Magazine
http://www.flashmagazine.com/Reviews/detail/mate_event_driven_framework_for_flex/

Here is a new pocket guide for Flex 3.0 that somehow slipped past me. I haven’t seen this book mentioned anywhere. Things have been mega busy over the last few months so that could explain it. Three things I really like: Flex, O’Reilly and a pocket sized book. These pocket guides are great for reading while standing in lines, on airplanes etc. I want to get a copy of this little guy ASAP! Here are the details for the book. Enjoy!

Getting Started with Flex 3 An Adobe Developer Library Pocket Guide for Developers
By: Jack Herrington, Emily Kim
Compiled by: Adobe Development Team
First Edition June 2008 (est.)
Pages: 143
Series: Adobe Developer Library
ISBN 10: 0-596-52064-6 | ISBN 13: 9780596520649

Book description:
“Discover how easy RIA development can be with this one-of-a-kind handbook from the Adobe Developer Library. Several clear, step-by-step mini-tutorials teach you about web services, event handling, designing user interfaces with reusable components, and more. After finishing this guide, you’ll be able to build Flash applications ranging from widgets to full-featured RIAs using the Flex SDK and Flex Builder 3.0 — whether you come from an open source or Visual Studio-intensive background.”

Table of Contents

http://oreilly.com/catalog/9780596520649/

The Flex and AS3 ecosystem is exploding. The demand for individuals who know these technologies is at an all time high. I currently get about 5 people per day that are seeking developers who know this stuff. Over the past year the demand has only increased. More and more kats are jumping into Flex/AS3 dev every day. Along with the surge of interest has come a ton of new tools, libraries and components. I put together two blog posts last year showcasing many of these new libraries, tools, etc. The hit count on these those posts is pretty impressive to say the least. It surprised me quite a bit actually. Since the start of 2008 there have been several cool items introduced to the community. Here is a new list of 36 Flex and AS3 tools, libraries and components that I’ve been tracking. I hope someone else gets some use out of this list. I need to check out many of these projects myself…

List of 31 Flex APIs, Libraries, Components and Tools
http://seantheflashguy.com/blog/2007/08/21/list-of-31-flex-apis-libraries-components-and-tools/

List of 22 ActionScript 3.0 API’s
http://seantheflashguy.com/blog/2007/08/13/list-of-22-actionscript-30-apis/

ActionScript 3.0 APIs from Eric Feminella
ActionScript 3.0 APIs developed specifically for Adobe Flex and AIR.
http://www.ericfeminella.com/blog/actionscript-3-apis/

ASMailer
The ASMailer class sends emails using an SMTP server. ASMailer sends mail without the need of a server side language like PHP or JSP.
http://asmailer.riaforge.org/

Away3d 2.1
Away3D is a realtime 3d engine for flash in ActionScript 3.0
http://away3d.com/away3d-21-demos-docs

Bullet Graph
A good way to show actual time spent vs. the estimated time for a project
http://agileui.blogspot.com/2008/05/bullet-graph-free-flex-component.html

Degrafa
Degrafa : Declarative Graphics Framework
http://www.degrafa.com/

Desuade Partigen
Desuade Partigen is an extension for Adobe Flash which lets you create realistic vector and raster particle effects (such as fire, smoke, sparkles), without requiring you to do any complex coding.
http://desuade.com/products/partigen/

EasyMVC
EasyMVC is an event driven MVC framework which focuses on flexibility while not getting in the developers way.
http://projects.simb.net/easyMVC/

Five3D
vector-based 3d rendering framework by Mathieu Badimon - has just received a significant update, bringing it to version 2.1. New features this version brings: Back Face Culling, Flat Shading, Z-sorting, Space Drawing functions, Bitmap3D class, Video3D class, Sprite2D Class, Letter Spacing, Text Width
http://five3d.mathieu-badimon.com/

Flash Player 10 API Documentation!
http://download.macromedia.com/pub/labs/flashplayer10/flashplayer10_as3langref_052008.zip

Flex 3 Performance and Memory Profiling
“Memory profiling lets you look at objects being created, take snapshots and compare them. Performance profiling allows snapshots for looking at cumulative and internal time.”
http://labs.adobe.com/wiki/index.php/Flex_3:Feature_Introductions:_Performance_and_Memory_Profiling

Flex 3 RSLs
Use Flex 3 runtime-shared-libraries (RSLs) to reduce the size of your applications and thereby reduce the time required to download the application. RSLs are just SWF files whose code is used as a shared library between different application SWF files.
http://labs.adobe.com/wiki/index.php/Flex_3:Feature_Introductions:Flex_3_RSLs

Flex 4 States syntax changes
Flex 4 will target all of the legacy usage scenarios of classic Flex states functionality (stateful components, states as application “views” or “pages”, effects and transitions between view states, etc.). This document outlines what is primarily a syntax change for the existing functionality.
http://opensource.adobe.com/wiki/display/flexsdk/Enhanced+States+Syntax

Flex and Flex Developers Magazine
http://www.ffdmag.com/

Flex “Designer Scroll Bars”
“designer scroll bars” - skinny little tone on tone scroll bars that have no scroll arrows
http://www.gskinner.com/blog/archives/2008/05/designer_scroll.html

FlexMDI
flexmdi is a robust, extensible Multiple Document Interface framework for Adobe Flex.
http://code.google.com/p/flexmdi/

Flex Resource Bundles
What’s a resource bundle? It’s a set of values that you externalize from your source code in a properties file. And it can be swapped out at compile time or, with Flex 3, at runtime. Think of it like a style sheet for values.
http://blog.extends.eventdispatcher.org/roger/introduction-to-flex-resource-bundles/

FOAM
FOAM is a two-dimensional rigid body physics engine written in ActionScript 3.0.
http://code.google.com/p/foam-as3/

Go3D
Cool Tweening Engine, the Go3D which give you more control over moving objects in 3d space.
http://code.google.com/p/goplayground/source/checkout

GoogleMap Flex Component
A new component for Flex Developers who want to add more control or be very well organized.
http://www.igorcosta.org/?p=140

Guttershark
Guttershark is an Actionscript 3 library that pushes some simple conventions on you, only to make you faster as a developer. It’s a pattern for Flash development that cuts out a huge amount of time, especially when you’re in the first stages of development.
http://www.guttershark.net/

ILOG Elixir
A suite of professional user interface controls that gives developers a rich collection of innovative and interactive data display components. It includes ready-to-use schedule displays, map displays, dials, gauges, 3D and radar charts, a treemap chart and organization charts.
http://www.ilog.com/products/ilogelixir/

LoadingImage
Takes a regular Flex Image component, and adds a self contained ProgressBar to it to show its own loading progress.
http://www.munkiihouse.com/?p=135

Logger Library and RIALogger
The Logger component provides classes to that abstract the Flex 2 Log and logging Target classes. It provides a simple approach to logging messages with category information and provide hooks into multiple targets. It supports the following logging targets by default: RIALoggerTarget, TraceTarget (trace()), XPanelTarget, and FlexTracePanelTarget. The LogController also provides functionality to allow you to setup your own custom logging Target.
http://renaun.com/blog/flex-components/rialogger/

Mate
Mate is a tag-based, event-driven Flex framework.
http://mate.asfusion.com/index.cfm

Merapi
Merapi is a new project that is a framework for connecting AIR to java at the desktop.
http://adamflater.blogspot.com/search/?q=merapi

MinimalComps: Minimal AS3 UI Component Set
CheckBox, PushButton, HSlider, VSlider, InputText, ProgressBar, RadioButton, ColorChooser (text input only) and Panel.
http://www.bit-101.com/minimalcomps/

OpenFlux
OpenFlux is an open-source Flex component framework which allows developers to create radically new and custom Flex components.
http://code.google.com/p/openflux/

PeekPanel
Cool way to hide options or preferences in an application. It borrows the look and feel from the FlexBook/PageFlip components already out there, but instead of simulating a book, this is more of a way to use the “flip” to hide other components.
http://www.billdwhite.com/wordpress/?p=29

PlexiGlass
http://www.bobjim.com/category/plexiglass/

Share (Document Services API)
Online service provided by Adobe that allows you to share, publish, and organize documents online.
http://code.google.com/p/as3sharelib/downloads/list

Slide
Slide is an application framework for projects built in Flex 2 or 3. Using familiar design patterns, Slide provides a robust MVC structure, view state management decoupled from view implementation and a flexible approach to model and controller access, eliminating need for singleton classes.
http://code.google.com/p/flex-slide/

Sandy 3.0.2
Sandy is an intuitive and user-friendly 3D open-source library.
http://www.flashsandy.org/versions/3.0

Sprouts
Sprouts is an open-source, cross-platform project generation and configuration tool for ActionScript 2, ActionScript 3, Adobe AIR and Flex projects.
http://www.projectsprouts.org/

Universal Mind Extensions for Adobe Cairngorm
Universal Mind has extended the “classic” Adobe 2.2.x Cairngorm version to provide many productivity and maintenance enhancements.
http://code.google.com/p/flexcairngorm/

Video Tutorial on Compiling for Flash Player 10
http://theflashblog.com/?p=383

Virtual Space (AS 3.0) V. 1.0
The Virtual Space is an AS3 component that can be used to create virtual-tour type visualizations very easily. Simply specify 6 images to be used for top, bottom, left, right, front, and back. Then, position the camera, set the initial view, and specify interaction parameters.
http://www.afcomponents.com/components/virtual_space_as3/

Erin Fife from Adobe got in touch recently about some pretty cool Flex and Flash development opportunities that are currently available at Adobe. Flex and Flash developers are encouraged to get in contact with Erin directly to speak about potential employment with Adobe. (efife@adobe.com or 408-536-5382)

Here is a bit more information from Erin about these exciting opportunities:

“Adobe is looking for Flex and Actionscript developers; especially folks who are experts at building on top of platforms like the Flash Player, Flex, Flash Media Server, etc. Specific jobs can be found at:”

Here is the link that Erin sent along, you’ll need to search for the jobs mentioned in this blog post. (The Adobe job site is a great place to keep an eye on too, if you weren’t already.)

http://cooljobs.adobe.com/frameset.html

Here are the open positions and the technologies that you will be working on for each position.

Flash Authoring/ Flex Dev w/ a strong background in CS to work on the Media Platform.
http://labs.adobe.com/technologies/mediaplayer/

Flex UI Dev focus on real time communications:
http://labs.adobe.com/technologies/brio/

Flex UI Dev working on a v1.0 product, Share.com:
http://labs.adobe.com/technologies/share/

Full job descriptions are available in the following PDF downloads:

Flex Application Developer
Flex App Developer.pdf (47kb)

Senior Software Engineer, Connect
Sr. SWE Connect Brio.pdf (39kb)

Computer Scientist, Flash
Computer Scientist, Flash.pdf (40kb)

Dolores Joya sent over a link to her blog with a couple of new Flex 3 experiments today. In her research she was able to develop some pretty cool transitions using the Flex Effects classes. The source code is included with her sample, just do the right click boogie for the source.

The other area she investigated was skinning the Flex 3 UI controls with video. This is something I haven’t seen in any Flex UI’s to date, Dolores is always up to something cool! She has really been digging into skinning Flex apps lately. Stop by her blog or get in touch directly to discuss bleeding-edge Flex 3 and AIR skinning requests. Dolores is also very interested in integrating 3D into Flex. Stay tuned for some 3D/Flex UI explorations from her in the future.

Here is a draft version for the Flex 3 Cheatsheets. A number of MXML controls are detailed on this draft. For the first few Flex 3 Cheatsheets I am thinking about following this format for the rest of the commonly used MXML controls and containers. The properties, events and styles are taken directly from the Flex 3 Language reference for now. This is a change from the previous cheatsheets. Does this information help, or is the old format better? Constructive feedback appreciated.

Flex 3 Cheatsheet, page 1 DRAFT:
http://actionscriptcheatsheet.com/pdf/Flex3ControlsCheatsheet_p1.pdf

I checked out the SDFUG meeting last night over at the Veoh offices here in SD. Really great group of guys. Kyle Tyacke headed up the festivities. We saw a cool video from Kevin Lynch about AIR and also watched videos about Parleys, DigiMix, eBay Desktop and some other AIR apps. A free copy of Flex Builder 3 was raffled off. Everyone got some sweeet AIR t-shirts and some cool new AIR stickers. We watched a couple of 30onAIR videos and I met some twitter peeps in the real world.

Other items that the group discussed were:

MVC Architectures
Cairngorm
Here are some other very useful resources for learning Caringorm
David Tucker’s Cairngorm Series (with training videos!!)
Jeffry Houser’s Learning Cairngorm Series
Here are alternative MVC frameworks for ActionScript development.
PureMVC
EasyMVC

ActionScript Decompilers
Sothink SWF Decompiler
I forgot to mention Flare
Also, here is some info on an ActionScript 3.0 Decomplier

A few other items that were covered:
Sprouts (an open-source, cross-platform project generation and configuration tool for ActionScript 2, ActionScript 3, Adobe AIR and Flex projects.)
Visual Flex Unit
Here is another GUI unit testing framework that might be of interest: RIATest

I am probably forgetting a couple things here as well….

One of the attendees demo’d a pretty cool AIR app that he put together for live audio mixing. I’ll try to get the link to his AIR app and post it soon.

I’m not sure what’s on the agenda for April yet but check the sdfug.org website for updates. At some point I am planning on doing a presentation on AIR. More on that later…

As previously mentioned the “Developing AIR Applications with Adobe Flex 3” online manual is really a great place to get information for many of the aspects of AIR development using Flex 3.0. This example was created using the code and information available on this page.

There are three classes available to monitor network connectivity for Adobe AIR applciations. These classes are:

ServiceMonitor
SocketMonitor
URLMonitor

This article uses a very simple code example to demonstrate the usage of the URLMonitor class.

To get started you will need to import the URLMonitor class. The URLMonitor class is located in the air.net package.

The next step is to create an initialization method. In this method an instance of the URLMonitor class is created and assigned to the local variable “urlMonitor”.

The URLMonitor constructor accepts an instance of the URLRequest class as an argument. A URLRequest instance named “urlRequest” is created and assigned a value of “http://seantheflexguy.com”. The URLRequest instance is passed into the URLMonitor constructor.

An event listener also needs to be created and registered with the URLMonitor instance. The “onStatusEvent” method is registered to listen for the StatusEvent.STATUS event of our URLMonitor instance.

Finally the “start” method MUST be called to activate the URLMonitor instance.

The “onStatusEvent” method will receive a StatusEvent event object as a parameter. This parameter will contain useful data related to the status of the targeted URLRequest. In particular the “code” property can be used to determine the network status. I was able to get the “Service.available” and the “Service.unavailable” values by disconnecting the RJ45 cable from my laptop with the AIR application running in debug mode in the Flex Builder 3.0 IDE. You can see the trace statements as they were displayed while I ran the app in the screen capture included with this article.

The URLMonitor class enables you to determine if the availability of a network resource is changing. Monitoring one single resource is not a reliable way of determining if application is truly “offline”. One idea toward creating a more reliable online detection script might be to check a collection of five highly visited websites. Then depending on the overall availability of those websites a solid online/offline assessment could be made. If you are looking to monitor a single network resource, such as your server, then the URLMonitor class can be used as-is.

I hope you have enjoyed this article. The next article in this series will explore the notification features of Adobe AIR.

Code Example:

<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml"
  layout="absolute"
  creationComplete="init();">
  <mx:Script>
    <![CDATA[
      import air.net.ServiceMonitor;
      import air.net.URLMonitor;

      private function init() : void
      {
        var urlMonitor : URLMonitor;
        var urlRequest : URLRequest = new URLRequest( "http://seantheflexguy.com" );
        urlMonitor = new URLMonitor( urlRequest );
        urlMonitor.addEventListener( StatusEvent.STATUS, onStatusEvent );
        urlMonitor.start();
      }
      private function onStatusEvent( event : StatusEvent ) : void
      {
        var evt : StatusEvent = event;
        trace( ">>onStatusEvent::evt.code=" + evt.code );
      }
    ]]>
  </mx:Script>
</mx:WindowedApplication>

Congrats to Dan Thomas for being the first contestant to send in the correct answer to the question in my previous post. Dan has scored a free copy of Flex Solutions by Marco Casario. There were a lot of great answers almost all of them were correct however Dan was the first to send in the correct answer. Here is the repeated question in case you have not seen it.

AIR provides an easy-to-use, cross-platform window API for creating native operating system windows using Flash, Flex, and HTML programming techniques. What are three classes used to create and work with windows in AIR?

Here is the answer that Dan sent in:

flash.display.NativeWindow
NativeWindowSystemChrome
NativeWindowResize

All of these classes belong to the flash.display package and can be used for working with windows in AIR applications. Thanks for sending in your answer Dan, I hope you enjoy the book.

For future reference the ActionScript 3.0 windowing API contains the following classes for AIR.

flash.display
* NativeWindow
* NativeWindowInitOptions
(Window string constants are defined in the following classes:)
* NativeWindowDisplayState
* NativeWindowResize
* NativeWindowSystemChrome
* NativeWindowType

flash.events
* NativeWindowBoundsEvent
* NativeWindowDisplayStateEvent
* NativeWindowErrorEvent

More information can be found in the online help under AIR window basics.

Moving along to the final book giveaway… I guess this is more of an AS3 book than a Flex book, but anyway…. Be the first to email in the correct answer to the following question and you will win a free copy of ActionScript 3.0 Animation by Keith Peters. This is a great book that covers the essential topics needed for understanding programmatic animation in ActionScript 3.0.

What are three types of mouse event properties of the MouseEvent class?

Please send your answers to: info@seantheflexguy.com

Thanks for reading and good luck!

First off thanks to everyone who stopped by to congratulate me on my new “Flex Champion” status. Second, thanks again to Suzanne Nguyen and everyone at Adobe for this awesome opportunity. I am truly honored. Third, congrats to my fellow Flex Champions Chad Udell and David Flatley.

Now, on to the free Flex books!!!

Congrats to Anand Vardhan for being the first one to send in the correct answer to the last book giveaway question.

“What are three components that can be used for accessing server-side data with Flex?”

The correct answer was:

• HTTPService
• RemoteObject
• WebService

More information about Accessing Server-Side Data with Flex can be found in the online Adobe Flex 3 Help.

Anand already had a copy of Programming Flex 2 and he was kind enough to pass the book on to the second place winner who was Nuno Rosa from Portugal. Congrats to Nuno, you’re copy of Programming Flex 2 has been sent off. Enjoy that book, it’s a great one!

Now for what you’ve all been waiting for… The free book.

This week I have a copy of Flex Solutions by Marco Casario. The book is published by Friends Of ED so you know it’s quality. This is a massive book that covers a TON of information for Flex 2 and Flex 3 developers.

Here is this weeks book giveaway question:

AIR provides an easy-to-use, cross-platform window API for creating native operating system windows using Flash, Flex, and HTML programming techniques. What are three classes used to create and work with windows in AIR?

The first person to email me with the correct answer will win the copy of Flex Solutions. Good luck!