Most developers working with Flash and Flex applications have come across Flash Tracer, a Firefox addon which makes it possible to ouput trace() commands in a panel/window in the browser window. An unvaluable tool which I'm sure many of you uses. Until recently, there hasn't been that many alternatives, but now there are:

Arthropod is an AIR application that lets you log/debug your applications by simply importing one class and using the Arthropod command log() instead of the usual trace().

Another alternative is ThunderBolt AS3 which is a logging extension letting you control the output of your messages in a more flexible way than trace(). For the output, ThunderBolt uses Firebug or the AIR application ThunderBolt AS3 Console.

Both projects are very interesting alternatives, giving you more control of how the messages are formatted. ThunderBolt is open source, hosted on Google Code.

Tags: logging, debug, flash tracer, arthropod, thunderbolt, firebug

I was attending the on AIR Tour Europe in Stockholm with one of my colleagues in the begining of the week. Mike Chambers, Ryan Stewart, and the rest of the gang of Adobe AIR talked about developing for their new cross-plaform runtime. Very interesting and releaxed happening. Of course we got some nice swag too, including a t-shirt, a print of Actionscript Reference and O'Reilly's pocket guide "Adobe AIR for JavaScript Developers" to mention a few. The stickers we got I put on one of our Guitar Hero controllers; nice red touch.

 

 

 

 

Tags: on air, air, stockholm, flash, flex, guitar hero, mike chambers, ryan stewart

The Flex compiler has an option to generate a link report. This is a file that contains information on classes, dependencies and more for a Flex-project. Maybe the most common use for the link-report is to compile modules against it to optimise them for a certain application, but it can also be used to find classes and packages that might be included in your project without you knowing it, adding to the projects total file size.

The link-report file is a plain XML file, perfectly readable as it is. That said, there are tools to make even more use of the file. I have had experience with two such tools, both of them AIR applications that parses the link-report and presents the information in a more user-friendly way.

ItDepends has a very nice feature that lets you see exactly which classes that refers to a certain class, very handy for identifying unnecessary classes and reducing file size.

Link Reporter Visualizer is a tool similar to ItDepends, but also features a nice tree map, that you can zoom in on to get a very clear graphical view of package sizes:

I recommend any serious Flex developer to take a look at these tools and all their features, as there is much to be gained from using them!

Tags: flex, link-report, air, itdepends, link report

Last week, Adobe released the first public beta of the Flash 10 player, codename Astro. Here at Yooba HQ, we've been trying out some of the new, exiting features and thinking of different ways to take advantage of these in future versions of Yooba Studio.

I believe Flash 10 will bring lots of good, and not only in terms of the more obvious features (I'm thinking of the pseudo-3D and GPU-rendering) but also the revamped text engine and the improved drawing API.
It's allready possible to try Astros' features out by making some adjustments to the Flex environment, but still we're eagerly awaiting docs (other than Senoculars nice tutorial) and some more tools to play with.

Yooba is really exited about Astro, and what cool features it can bring Yooba Studio (and you!).

Tags: astro, yoobastudio, studio, flash player, 3d

One of the problems we encountered when developing Yooba Studio was getting access to a small but crucial part of a Flex Component: the CheckBox check icon.  In many cases, most of the parts of a component is accessible via relatively easy means, making it easy for developers to modify its behaviour and appearance. But the CheckBox (and the RadioButton) was a different story. We wanted to change the check mark color at runtime and after doing some digging, I found the hard coded color value in CheckBoxIcon.as. Creating my own version of the file (thanks Alex!) we were able to do just what we wanted with the icon.

An example of how to go about it can be found here.

This is an example of when the open code in the Flex SDK is of great value - without it things would have been much more difficult in the every-day coding.

Tags: as, actionscript, source, code

Our Gallery for displaying and selecting graphical objects includes vector images as well as bitmap images. The vector images are SWF files containing the actual artwork. When one of our graphical designers began adding his artwork to the Gallery he simply imported the Illustrator files into Flas and published an SWF. We didn't bother settings the stage dimensions to fit the artwork, since we've learned from before that it's the content of the Flash that counts - not the actual stage dimensions.

This turned out to be a false assumption...

The thumbnail included an mx:Image that simply had its source property set to the SWF URL. When the Gallery thumbnails loaded the artwork, the whole area of the SWF stage was included. Since we obviously only wanted to show the actual artwork in the thumb this had to be fixed. Adjusting each file from within Flash would be too time consuming so we had to come up with something else. In the end we loaded the SWF files using a Loader, adding its content to a Sprite and finally setting the Sprite as the Image source. This meant that we had to fix loading effects, since the loading now took place in the Loader and not the Image. So, how come the Sprite doesn't include the whole stage area but the Loader does? I haven't figured that out just yet, but this is one way to get the desired result. 

Tags: development, gui, adobe, flex builder

While developing our latest project we needed to display a quite large set of thumbnails. I started out by using the mx:TileList component for this, but soon discovered that scrolling a whole row at a time could be disorienting. I turned to another (set of) components: mx:Tile and mx:Repeater and got smooth scrolling. This presented me with another problem though: all thumbnails in the mx:Tile loaded at once - even if the ones not visible. This behavior differs from the mx:TileList which only loads what's needed (i.e. visible). So, which one is the best choice? On one hand we have the scrolling and one the other we have loading issues. We ended up using mx:Tile and a repeater, controlling the loading behavior ourselves, simply because we needed a really smooth experience scrolling though the thumbnails. This meant more work, but we have to remember that we're designing for the user, not the developer.

Tags: adobe, gui, flex builder