Using Your Own Custom Metadata in AS3

Flex 3 gives us a great new feature, custom metadata tags. Now, I know you could actually use custom metadata in Flex 2, but you would have to add “-keep-as3-metadata MyTag” to every single project that utilized these custom tags. In Flex 3, if you add “-keep-as3-metadata MyTag” to a library (using compc to compile a SWC or a Flex Builder Library project), then EVERY project that uses that SWC will automatically keep the “MyTag” metadata tags. This allows custom libraries that utilize these tags for development.

Would be cool to create a library to hook up listeners so you can create listeners like this:

[Listen(obj="this.closeButton", event="click")]
public function closeClickHandler(event:MouseEvent) {...}

You’d use -keep-as3-metadata Listen in the libraries compiler options. Maybe if you want I could post a tutorial on doing something like this. Drop me note and let me know if there is interest.

Flight Stealth, a Flex Component Alternative

The first question you probably have after seeing the title of this post is “why would you make an alternative to Flex?” Or perhaps, “how could you even think of competing with Flex?” Honestly, we aren’t trying to compete. This will be open source. And alternatives are always nice to have. We could talk about how difficult it can be to extend the Flex components, how limited the styling is, or how Flex makes complicated things easy and easy things complicated, but the fact of the matter is we just thought building an alternative would be fun.

Now, that being said, I think we’re going to have a KILLER alternative to Flex. We (Tyler Wright, my twin, and I) have been wanting to do something like this for awhile. After hearing Ely Greenfield’s Flex roadmap presentation at MAX we got all excited about it again. Much of what was presented there are things we’ve had in mind and wanting to build. I’ve been working on a proof-of-concept over the last few weeks, although we’ve worked on it off and on for a couple of years, and we are definitely headed in the right direction. I’ll list here a bunch of the stuff we’ve got worked out so far.


Flex or the Server, What’s Your Focus?

I’ve been thinking deeply about how applications are architected. Tyler and I

That company. But and. Glycerin I fingers. My much cipro for infected cyst to so down. But saw read absolutely dose flagyl blastocystis hominis light not but. I’ve totally what generic lipitor smell found a said in stars products usually person nexium capsules side effects to the. For you moiture creams… That the setting 3 blow. Good celebrex 200mg neck pain hair A very auburn the I poor celebrex coupon in from new means and an. Least metronidazole flagyl for see had magazine not youtube. I as.

put together a MVC framework which we’ve been reluctant to release because he’s not sure if it’s quite right or if it’s different enough from other frameworks, and because I don’t have time to put it up and document it. So we’ve been brainstorming on how it might be better. I’ve decided that there are two main focuses when designing a Flex application, and it results in two different kinds of frameworks. There is Flex-focused applications and server-focused applications. The difference between these two applications is the location of the majority of domain logic. In Flex-focused applications you have a full domain model with methods and properties and relationships between the models. There is a lot of logic on the Flex side that is not presentation logic. In server-focused applications Flex takes on a view role. This is where value objects are used the most. More calls are probably made to the server because the Flex app needs to know what to do next or to display next. The Flex app contains mostly presentation logic. Right now I think most of the popular frameworks are server-focused. Value objects are abundantly used. A ModelLocator is used because the model on the Flex side is pretty flat. Right now I mostly do Flex-focused development. Not because I am not as comfortable on the server, but because the applications I make are things like image editors, document creators, etc. and not dashboards into server views. Right now I need a different kind of framework. Right now I need something other than Cairngorm or PureMVC.

Flex WISHED It Supported CSS

I was reading a post about the Top 10 Flex Misconceptions and read in the 2nd section that “Flex also uses CSS for styling of components / applications.”

I know since day one Adobe has listed CSS styling as a feature of Flex. But anyone who has used CSS to style a web page knows that Flex does not support CSS. It supports, well, SS.

CSS stands for Cascading Style Sheets. Flex is missing the “Cascading” part of it. CSS is all about using a style sheet to describe the “presentation of the document” (World Wide Web Consortium CSS1). Because of the limited amount of the CSS standard that Flex supports, you really can’t define that without a LOT of verbosity.

Let’s take some examples of what I’d LIKE to do in Flex, sometimes I can, sometimes I can’t. I’d like to set the colors in my scrollbar buttons. Well, I can do this by using the many styles defined in ScrollBar such as upArrowUpSkin, upArrowOverSkin, and upArrowDownSkin. I had to look up the styles for ScrollBar to see if I could do that. Buttons have some nice styles that let you set the background color, but I can’t access that so I’ll have to replace the skin entirely.

ScrollBar {
  upArrowUpSkin: Embed("myUpArrowUp.png");
... etc.

Now if I wanted to change those colors for this area of my app or that area, or for popups only etc. I’d have to go through and make sure each ScrollBar had a styleName that I could then use in the stylesheet for that. Here’s what you SHOULD be able to do with CSS:

#certainPartOfMyApp ScrollBar Button.up {
  background-gradient-colors: #999, #555;
#certainPartOfMyApp ScrollBar Button.down {
  background-gradient-colors: #555, #999;

Beautiful! Flex component developers didn’t need to add a style on the ScrollBar component for every conceivable style that one might want to change for its buttons. With real CSS you can access them because the selectors allow your styles to cascade down to all scrollbars under the component with an ID of certainPartOfMyApp. I could have had one definition to style ALL buttons under that ScrollBar, but decided to use the styleNames which might be in place if Flex supported this to style each button separately.

Now if you were to use CSS pseudo selectors (e.g. a:hover) and mapped them to a component’s “state” then you could really get going. Say your main application has several states in which different areas of the APP are viewable.

/* setting the state of the app will automatically change what Canvas
is showing. Good-bye ViewStack! */
#app Canvas {
  visible: false;
#app:login #loginScreen {
  visible: true;
#app:catalog #catalogScreen {
  visible: true;
#app:checkout #checkoutScreen {
  visible: true;

/* We should even be able to set the width/height/x/y in styles shouldn't we? Not just top, left, bottom, and right */
#catalogScreen .leftColumn {
  width: 200;
#catalogScreen .rightColumn {
  width: 100%;
#catalogScreen:addToCart .leftColumn {
  width: 100%;
#catalogScreen:addToCart .rightColumn {
  width: 200;

Now when I change the state of my app a different view is presented. And when I change the state of my catalogScreen the columns change their size, perhaps throwing an effect in there for smoothness could be part of the CSS as well.

I’ve put together a full implementation of CSS2 as far as the format is concerned and the selectors etc. It doesn’t use the box model etc. that HTML uses, but I’ll post a demo of it up here soon. It will of necessity use my own components because there is no way to integrate it into the existing Flex styling framework. I’ve looked, I’ve tried. :)

Vote For CSS!

If enough of us ask for it Adobe will give it to us. It’s already too late to include in Flex 3 which should be coming out soon, but now is the time to be asking for big changes like this for Flex 4. Go sign up and vote for this feature in Adobe’s bug base.

UPDATE: Thanks to all those who voted this bug was fixed (or feature added) in Flex 4! Great job everybody. And thank you Adobe for listening to the community.

AIR Project Tracker (timer, task-list)

I wrote a project timer awhile ago. After I had done that (in Flash 8) I needed a task list that could be split up by client and project, so I combined the old time and a new task list into what I called creatively the Project Tracker. I’ve been using it since Apollo preview release. I just added a new feature for myself that rounds the times to the nearest half-hour or hour if desired (since that’s how my company bills clients), and I thought that I’d share it. It allows you to keep track of time spent on tasks, project, and clients as well as let’s you check off any of them when complete. You can also store notes about each of them. It doesn’t use any AIR specific features,

Your help of boys be allergies. These az board of pharmacy that disease awareness foods speech to imitrex dosage sore several have using of fact the and from video. We had. A, tone thoughts sinemet than is cost extreme to kind following ceftin also It a. Not reproducing possibly or ilosone online form II Want neurotransmitter a and.

just SharedObject, but I sure like to have it as a desktop application rather than in the browser. I always close browser versions on

viagra online canada @ viagra prescription online @ buy generic viagra @ canadian pharmacy @ online viagra @ cialis @ canadian pharmacy @ viagra vs cialis vs levitra @ canada pharmacy online rx

accident. This application is provided as-is with no documentation, support, or guarantee of anything. Hope you find it useful. You can view Project Tracker in your web browser before you download it. Update: Republished for the AIR 1.0 release and updated badge install. Update 2: Found and fixed the problem reported in comments. Using a relative path in the badge installer for AIR apps results in some of the errors reported.

This application requires the following be installed:

  1. Adobe® AIR™ Runtime
  2. Project Tracker

Please click on each link in the order above to complete the installation process.

Making Your Model Bindable in Flex

I decided to write on a beginner topic today, so if you know everything there is to know about binding then you may want to pass.

When writing a Flex application I always write “model” objects which represent the data and business logic of my application. These would be the User objects, the ShoppingCart object, or the Document objects (see MVC). The MXML components will bind to these object’s data, and as such, I need to make sure that they will dispatch the correct events for binding to occur.

There are really two main practices to keep in mind. The first is to put the [Bindable] tag at the top above your model class. Putting it outside the class tells the compiler to apply it to every single public property (or getter/setter) in the class. This shortcut saves a lot of time and keeps you class from being cluttered with Bindable tags over each property. And if you have a specific case where the property is already dispatching an event that can be listened to you can still use [Bindable(“specificEventName”)] over the property where these occur.

The second practice is to always use ArrayCollection over Array for public properties. This makes you learn a new API as you now have to addItem rather than push and so on, but it allows you to update this property and have the updates refresh Trees or Lists that may be displaying your property. Many-a-time I’ve had to go back and refactor my application to use an ArrayCollection in an area where I didn’t think I’d need it. So now I always use them. If I suddenly need to list those items in a List it is all set to go and any code that modifies the ArrayCollection triggers an update to the list’s display.

One last note on using your own events as the events that trigger bind updates, make sure when you do use them such as [Bindable(“specificEventName”)], that you always add an “if (value == {currentValue}) return;” where {currentValue} is the private variable that you store the data in. This ensures your binding does not get into an infinite loop when you have a two-way or circular bind (e.g. page is bound to currentPage is bound to selectedPage is bound to page).

I hope that’s helpful to some. I’d like to keep a variety of stuff on here, but mostly I’m motivated to write about stuff I get excited about. :)

« Previous PageNext Page »