Dear Flex, Aesthetics Matter

So, as you may or may not have noticed, there's a little bit of a flap in the Flex community. You can read more here, but the short story is that to make Flex 4 compatible with Flex 3 code, since they may need to be used alongside eachother, Adobe's plan is to prefix Flex 4 classes with Fx to avoid namespace collisions with Flex 3 classes.

For instance: Flex 3 -> <mx:Button>, and Flex 4 -> <mx:FxButton> <FxButton>

I understand the problem a bit - most of it has to do with difficulties matching classes with CSS definitions to map to the classes, as I understand it. I appreciate how this could be a problem, but my position is simple. It's a slippery slope. Please, Adobe, don't ruin the good thing you have going, especially as you start to think about other places the Flex language could be used.

Here's what I mean. Look at this mess:

<LinearLayout
  android:orientation="horizontal"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:layout_alignParentCenter=”true”
  android:gravity="center">
  <TextView
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:textAppearance="@style/small_grey_bold"
  android:text="@string/button_one_title"
  />
  <Button
    android:id="@+id/button_one"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/button_one_label"
    />
</LinearLayout>

That's a simple, centered, horizontal container with two components: a label and a button, in Android's layout markup. It centers its children and is aligned center in its parent. In a lot of ways, it looks similar to Flex. The tag names correspond to Android framework classes. As far as that goes, it’s simple to see what’s going on here as you read and try to find your place. But look at the android: namespace AT THE ATTRIBUTE LEVEL. Ugly. I’d go so far as Fugly. Also, are attributes camelCased or snake_cased or both? Each one is different. There’s even a android:layout_gravity and an android:gravity. I love Android, but its layout is a mess.

For contrast, here’s a similar layout in Flex:

<mx:HBox
  width="100%"
  horizontalCenter="0"
  verticalAlign="middle"
  horizontalAlign="center">
  <mx:Label styleName="small_grey_bold" />
  <mx:Button id="button_one" label="{button_one_label}" />
</mx:HBox>


See how much more clean that is? There are a few magical incantations (from a n00b’s perspective) like horizontalCenter=”0” - they’ll have to remember how some of the layout rules go, but the rest is pretty intuitive, and there’s way less boilerplate. In 99% of the cases in Android you HAVE to specify layout_width and layout_height or the precompiler complains at you. Why? No sensible defaults is one mark of a bad framework.

Someone once told me a heuristic for recognizing a good framework: When writing code, if you don’t remember what you need to write then guess. If you’re right, it’s a good framework. If you need documentation until you have it by rote, it’s not a good framework. Flex is a good framework. You’re generally rewarded by being able to intuitively guess what the right attributes are.

I chose Android’s layout language to compare because it’s particularly nasty, I think. If I knew enough HTML/CSS, I’d compare that too, because I think it’s way too overwrought. And anyway, two languages where positioning is in one language and the containers are in another? How dumb is that?

My point is that Flex, for any other faults people can pick out about it, has layout DOWN. It’s the best declarative layout language I’ve had experience with. Bruce Eckle agrees, and says “Flex is a DSL for building UIs” (paraphrased).

Now, does Adobe ruin this whole thing when they add Fx prefixes? No, not catastrophically, but like I said, it’s a slippery slope. Every concession that clutters the language puts a dent in the area where Flex really shines. As a developer that matters to me. We can look forward to a time where Flex is available as a layout language on more than just the web, and if I had the choice, I’d use Flex over Android’s layout language if I could, because I have to speak this language day after day, and I’d rather get my point across as quickly as possible, because that impacts my efficiency, my peace of mind, and ultimately how hard I have to work to build good user experiences, which is the goal we all share.

It’s been said before, so look around for it on the web: Aesthetics matter. (here's one quick let-me-google-that-for-you) Adobe, please keep in mind what makes Flex the best layout language, and don’t ruin it, even a little. Stay strong.

Flex Needs Some New Thinking

Anyone who's used Ruby or another dynamic language (I suppose Python is good, but I can't stand the syntax and whitespace-nazism) and started to really grok it and what you can do with a dynamic language with a friendly syntax generally feels a resistance from deep down in their soul-area when they have to go back to Java-land or worse.

I feel less of that resistance when I switch from Ruby to ActionScript via Flex, but it's still there. Especially since I know that a lot of dynamic capabilities are available, but bad for performance and confusing to other developers expecting the more common approaches.

I happen to like Cairngorm just fine, although a lot of people complain about its red tape and preponderance of boilerplate code and I would be happy to use something less bloaty. I like PureMVC as well, but I don't find it to be any better than Cairngorm at what people usually complain about Cairngorm for. There's nothing wrong with Cairngorm that a code generator and Prana won't fix for me, but I'm a little set in my ways, nothing against PureMVC at all.

In fact any of the other frameworks that are popping up as alternatives to Cairngorm, PureMVC, or Roll-your-own, like Mate and Swiz are mostly just cutting down on clutter, but using the same ideas. There's merit to that, but I want to see what thinking like a Rubyist could do for us.

I'd like to try to learn from the dynamic language community and try some new thinking and new approaches to solving framework issues, and it's good to see others thinking about it too:

Jay Fields has got a lot of experience from the Rails and Rails testing world and has some great thoughts on testing in Flex and on Flex in general that resonate with me. I'm excited to see some favorable views on Flex from the Rails community and I hope it continues so we can get some new thinking, new techniques, and get that stuff recognized and incorporated in the Flex community.

Delegate Factories with Prana

I've been having fun with Prana lately. Prana is an IoC container framework for Flex under development by Christophe Herreman. Prana is sort of built with Cairngorm in mind, but it could work for any configuration and injection you wanted to do at runtime.

One of the benefits I can see is for rapidly prototyping an application with little to no knowledge of the service you may need to connect to for your data needs. If you can define the data model well enough, you could build your application with Cairngorm in such a way that all you'd need to do is change one file (or type of file): the Delegate.

That's the reason for the business delegate: to keep the application isolated from the implementation of the service layer.

I've written up an example of how I'm currently using this on a project and posted it at http://labs.effectiveui.com/examples/prana/delegates/. It's a pretty lame sample, but if you right click and select "View Source", it shows how I have created a DelegateFactory that gives my commands a Delegate that conforms to a certain interface. Then, using Prana, I can configure the DelegateFactory to build whichever implementation of the Delegate I wanted, without recompiling the application.

The benefit is that I can drive the application's data from dummy xml data, but the application doesn't care where that data comes from. As long as I'm write about the way the data looks, my Commands don't need to change once I switch over to a production ready Delegate.

First, look at the DelegateFactory. Notice that it contains a string, _delegateClassName which will contain the qualified name of the class I want the DelegateFactory to make. There's some type-checking in there once that string is set to make sure that points to a class that conforms to the interface. One last thing to notice is that I need to have the class of the delegate referenced at least once in the code so that it's compiled in. That happens on the line that says

private static var compileTheseClasses:Array = [DevDelegate]


So DevDelegate is the delegate I want to use at development time. That Delegate acts like a regular delegate that calls an HTTPService to get some xml. Instead of doing that, though, it just loads xml local to the swf and sends a ResultEvent to the LoadPeopleCommand as if a result had just returned from the HTTPService.

Once last thing to notice is the applicationConfig.xml which drives Prana. It's loaded by the InitializeCommand. In that first block there:

<object id="delegateFactory" class="com.effectiveui.examples.business.DelegateFactory" factory-method="getInstance">
<property name="delegateClassName" value="com.effectiveui.examples.business.DevDelegate" />
</object>


I tell Prana to configure my DelegateFactory with the delegate class I want to use. I can change this xml file at runtime, so as long as I make sure the Delegate is compiled in, I can change delegates whenever I need.

Of course that's just one of the uses of Prana, but I really like the ability to get up and running easily by making a development time delegate.

Flex needs a Custom Metadata Class

At MAX, I was really surprised to find out a sekret Flex compiler feature: You can keep custom metadata around in your Flex app. There's a tutorial with a really sweet proposed application for that feature at Christophe Coenraets' Blog.

The only thing about that example is that the entityManager needs to know to read the objects passed into its save() method for metadata. That's not a problem for that use case. BTW, you can read metadata with describeType()

What if I wanted to copy more of the JPA with Flex? Then I'd need the FPA (a mythical Flex Persistence API) to manage the instantiation of the EntityManager and pass in a reference at runtime. I'd need to inject the right EntityManager into any code that wanted it. Right now to do something like that we'd need to read every class, or intelligently read certain classes, to figure out if there were annotations to deal with.

It'd be nicer if we had a first-class Metadata class that got instantiated by the framework at runtime and knew about the class it decorated. That way it could do things like negotiating with the "FPA" to get the right EntityManager at runtime based on configuration data. It could then modify the object that had the metadata with no developer intervention. It'd look something like this, following Christophe's example:


[PersistenceContext(id='applicationPersistenceContext')]
public var entityManager:EntityManager;


That would mean that at runtime, the 'applicationPersistenceContext' persistence context, which could contain data about which database in SQLLite to use, maybe usernames and passwords or something like that... in short: configuration you don't want compiled into your code. That PersistenceContext object would know to inject the correct EntityManager into the variable 'entityManager'.

I think it'd be a great addition to the framework which would allow a lot more use of the "Dependency Injection Pattern" to help make easy to use frameworks for specific needs on top of Flex.

I've created an enhancement issue here: https://bugs.adobe.com/jira/browse/SDK-13002 If you agree, make sure you vote on the issue.

My 360 Flex Video

My 360 Flex video is up now over at cruxy. The video snippet at the beginning isn't indicative of how stunning the whole video is, though, since I fumble a bit trying to figure out why the heck my Mac remote isn't working (line of sight problem). Anyhow... check it out.

The presentation was on getting more expressive user gestures into Flex applications.

I have to mention that it costs $3.60, which I think I split a third of with the A/V guy and the 360 Flex guys.

Flex and Rails Dates

I'm not sure how I didn't run into this before, but I had some trouble parsing and dealing with dates coming from Rails' to_xml rendering of an object in Flex.

The dates were coming back looking like this: 2007-08-29T23:18:07-06:00, which I'd never seen before. I've found out since that it's in the W3C date time format.

Luckly for me, I found that the as3corelib has just what I needed: a DateUtil.parseW3CDT and DateUtil.toW3CDTF method.

If you're passing dates back and forth between Flex and Rails, at least with xml, you may want to check the corelib out, but make sure you look at it anyway.

A quick asdoc tip...

If you're going to document actionscript getter/setter pairs, put asdoc on the getter. Doesn't seem to work on the setter if there's a getter. Not sure yet if it works if there's only a setter... anyone out in TV Land know?

asdoc tip

So, I've been senior having a little trouble with asdoc. I needed to doc some code that requires Cairngorm, so I wrongly assumed that I could tell asdoc to add another library with this command:

asdoc -doc-sources . -library-path "path to cairngorm swc"

... but I was wrong. DEAD WRONG. ok.. just wrong. Instead, what I wanted was this:

asdoc -doc-sources . -library-path+="path to cairngorm swc"

because in the former case, I was telling asdoc to ignore the flex framework, which doesn't get you very far. I should have guessed that from using the command line compilers before, but I guess not.

Word to the wise!

Also see me at 360Flex

Come to 360 Flex! It should be great.

They were nice enough to ask me to speak, too.

I’m going to be talking about something I’ve had rattling around in my head for a while: Navigation and “power user” features in RIAs, specifically Flex RIAs. They way I use my computer is not the way I can use my RIAs, and I don’t like that. I use things like QuickSilver, and Firefox Mouse Gestures, and the command line (<3 bash)

The talk basically asks: How do you start introducing “power user” features into your Flex Apps, and how do you start to educate the general user about the productivity gains they’ll get by making use of these types of features?

I’m really excited about being able to do this talk. Plus, it means I get to go to 360 Flex. Good times.

See me at MAX

Hey all, and welcome to the brand new Hill of Beans 2.0, upgraded from 1.0 This is the first post. I hope you like it.

So, it's official! I'm confirmed as an Adobe MAX speaker, talking about the societal and physiological benefits of using Flex with Rails. The basic gist will be: unless you have some fairly complex enterprise use cases that cry for LiveCycle Data Services, or someone else is choosing your system back end and you have no say, you should be choosing Rails.

Rails values getting things done, and you'll feel how true that is to the very core of your being when you use it for the first time.

I'm excited to talk at MAX. What a great opportunity for a rookie speaker. I hope I can get some folks on board with using Rails and help get rid of this stupid stigma it seems is forming that Rails guys hate Flash. Silly. We'll fix it by getting Flex guys to love Rails and making more Rails guys that use Flex by this proven method.