Monthly Archives: November 2006

Preview of my Flex 2 TreeMap Component

The other day, I mentioned that I’ll be releasing an open source version of my Flex 2 TreeMap component. I need just a bit more time to make some finishing touches. Plus, I’ll be spending the next week finding a new apartment, moving in, and starting a new job. To keep you all drooling over the upcoming possibilities, I thought I’d take a minute to share a cool new preview of the component and some useful new features!

Preview of Flex 2 TreeMap and Tree Components Comparison

As you can see, the TreeMap is sitting side by side with Flex’s standard Tree component. Both components are connected to the same data source. Any form of data that you can display in a Tree, you can display in a TreeMap. In fact, just like the Tree, it supports custom data descriptors to allow you to use all sorts of interesting data structures.

<mx:Tree id="tree" width="100%" height="100%"
	selectable="false"
	dataProvider="{sampleData}"
	labelField="@name"/>

<zeus:TreeMap id="map" width="100%" height="100%"
	styleName="TopLevel"
	dataProvider="{sampleData}"
	labelField="@name"
	weightFunction="{getItemWeight}"/>

In the MXML code snippet above, you can see the declarations for the two components. They’re pretty similar. Both are bound to the same data provider. Both use the “name” XML attribute for the labelField. The TreeMap component also has a weightFunction (which works like the labelFunction used by many Flex components) that is bound to a method that calculates the weight or size of nodes in the component.

During development, I kept one thought in the back of my mind: “Customization is key.” You can set fields or functions to determine renderer labels, colors, weights, and tooltips. Of course, the component’s appearance may be customized with Flex’s style system. You can see that I set a style name on the TreeMap above to allow it to be styled a bit differently than the enclosed TreeMaps. The headers have styles much like Accordion headers, and the node renderers have styles a lot like Buttons. You can even create custom renderer classes to add new functionality to the nodes. Imagine placing simple bar charts inside the nodes to show changes over time, or perhaps control bars on each internal TreeMap with components that alter the node colors or other properties.

Click on one of the headers if you haven’t already. Users may zoom enclosed treemaps up to the top level for a more detailed view. This can be useful for complex visualizations where labels might be difficult to read. If you click on the header again, it will zoom out one level, and you can continue all of the way to the top. It’s not implemented yet, but I hope to add transitions to zoom operations to make them more Flashy and user-friendly.

That’s it for now. Hopefully, once I’m settled into my new apartment, I’ll be able to get the first official release out the door. I intend to keep a public source control repository so that everyone can check out the latest and greatest code. I will also package up important milestones and make them available for download. Stay tuned for more!

100th Post Extravaganza! (FREE Code)

In celebration of my 100th post, I’d like share some code with you. As you may know, the Flash Platform code example service IFBIN went open source a few months ago, and version 2.0 will be launching at some point in the future. I created several examples for IFBIN, but a couple of them were created using the pre-release versions of the Flex 2 SDK. Until I can get access to the new service, I’d like to share some updates to my code right here on Zeus Labs. In fact, I intend to make sure that any examples I make available in the future will be mirrored here for easy access.

Moreover, I’ve put together a series of project pages for several of my major open source projects. In particular, you’ll find centralized information on my Flex Instant Messenger client, my Actionscript 3 particle systems experiments, the HelpPanel plugin for FlashDevelop (and any future FlashDevelop plugins I may decide to make), and the Flex TreeMap component. Let it be known now that my TreeMap component will be open source again soon. I intend to release it under version 2 of the GPL. A licensing option for commercial projects will probably be available as well.

Thanks for reading Zeus Labs. I appreciate you all. Happy coding!

ActionScript 3.0 Cookbook will stay by my desk

Joey Lott, Darron Schall, and Keith Peters provide one of the first published overviews of Flash 9 and AS3 in the ActionScript 3 Cookbook. I had never picked up one of O’Reilly’s “cookbooks” before, but I quickly discovered that this format might be perfect for my picky reading habits. The book comes in at over 500 pages, and it’s the first release from the new O’Reilly/Adobe partnership known as the Adobe Developer Library.

Like most programming language books, each chapter in the AS3 Cookbook focuses on a specific aspect of the language. One chapter focuses on the Display List, another on Arrays, and so on into Bitmaps, Math, and others. What sets this style of book apart is that each chapter contains a series of short “recipes” that focus on the chapter’s main subject. For instance, the Regular Expression chapter includes solutions for simple problems like replacing text and validating user input, but an additional discussion section provides a few extra insights that more comprehensive language books might miss.

I found myself immersed in chapters on core language features, like the one on Arrays, even though I felt I knew these subjects pretty darn well already. With so many short and sweet sections, I discovered a dozen different tricks that I know I can use in my everyday development. For example, did you know that you can easily copy a single-dimensional Array by calling the concat() method with no arguments?

var myCopy:Array = myArray.concat()

Somehow, that had slipped under my radar.

I didn’t have too many issues with this book. Mostly, I found myself wanting to count the number of typos I discovered. You can expect to see a second printing, if only to fix the spelling mistakes and missing letters here and there. They’re not overly distracting, though. I had too much fun with the subject matter to let it bother me. I also noticed that there are several references to Flash Player 8.5. In some cases, it seemed to work, but in others I wondered if it would just be better to say Flash Player 9. Since it was released as an alpha player, it probably shouldn’t be considered an official release. SWFs made with the alpha version of the Flex 2 compiler won’t run in the official Flash 9 player these days. I’m guessing we won’t see it in the archives either.

All in all, the ActionScript 3.0 Cookbook kept me pretty entertained. I enjoyed that its recipes fit into a page or two each because I could easily sit down and read a couple when I had a few extra minutes. The next time I picked it up, I’d be jumping into fresh material that generally didn’t depend on previous sections. If you’re looking for a definitive language overview, this book isn’t what you want. You’ll probably want to pick up Essential ActionScript 3.0 when it comes out next year. Keep the AS3 Cookbook close to your desk as a quick reference for useful tricks or to give you a crash-course on a particular feature that you haven’t used yet.