Normally Flex will strip all ActionScript from an embedded Flash symbol. We’ve developed a technique called Shake’n’Bake SWFs (yes, I did watch Talladega Nights before coming up with the name), which allows you to utilize Flash symbols in Flex projects with all AS intact. I mentioned this technique at 360Flex, but didn’t go into much detail because there are better options available when using Flash CS3. A couple of people mentioned that they would like to learn about the technique, so I thought I’d blog about it.
Continue reading →
Extension Melee (Part 2)
To continue the extension goodness (see part 1), here is another handy extension that’s sure to boost your productivity.
Find In Library
One of the most common workflows when working in FLAs is the need to find the library item for a symbol on the stage. Simply select a symbol on stage, and run the Find in Library command, and the appropriate library symbol is selected. This command is most useful when bound to a keyboard shortcut, such as CTRL-E.
Download the FindInLibrary Extension
To add an extra bit of functionality, install the OpenBoundClasses extension as well: if a class is bound to the symbol, it will automatically open when you run the FindInLibrary command.
You must have your library open for this extension to work. Additionally, Flash will not scroll the library to the selected symbol.
If you’re looking for an opposite workflow, finding stage instances with a specific symbol or linkage, I recommend checking out gSearch, part of our first Panel Pack, which includes a powerful Timeline search tool.
Bitmap Fonts in Flex (via Flash)
I’m not a big fan of working with fonts in Flex overall. Truetype font file embedding is hit or miss, and even embedding system fonts seems a little unreliable. Likewise, managing character sets (ie. the glyphs to embed) in Flex is quite rudimentary (unicode character codes? editing the global config XML? blech!). These features are manageable within Flex though, even if they are a little ugly.
One font related feature that’s completely missing from Flex though is support for creating bitmap fonts. This is a shame, because bitmap fonts are sharp and aliased, and look great at small sizes (ex. 9pt Arial is quite readable as a bitmap font).
Continue reading →
We got Dugg.
Puki 3D made the front page of Digg…. cool! I think this is our first front page Digging, and I somehow missed it (it hit the front page 2 days ago). 50,000 visitors in one day, and as far as I can tell the server stayed up – kudos to Media Temple! Here’s a link to the Digg topic.
While I’m blogging about Puki, here’s a trick: Type “oldskool” before you start a game (make sure you’ve clicked to focus the game first), and you’ll get classic arcade graphics.
One day I’d like to revisit this game. Maybe with Papervision3D.
DisplayObjectWrapper for Flex
One of the challenges in using rich assets like images or Flash symbols in Flex is making them compatible with the Flex layout managers. There are a few ways to do this (some of which will be topics of future posts), but one of the easiest is to wrap the asset in a UIComponent instance that translates between the Flex layout API, and the basic Flash Player transformation API shared by all DisplayObjects.
I built a simple example of such a class, called DisplayObjectWrapper, which you can download and use or extend freely. It does a good job of translating Flex layout into resizes for it’s content, and vice versa. It’s super simple to use via mxml:
Continue reading →
Extension Melee (Part 1)
Since the advent of Flash MX 2004 and JSFL, we have invested a great deal of time into JSFL extensions, panels, and other time-saving utilities for use on internal projects. Some of them have evolved into products, such as gProject and Panel Pack 1, but very few have been released for public use. A couple months ago we updated our products site with selected extensions, classes and components intended for sharing with the community, but between client work and foosball, they never were given the final QA pass to be released.
Over the next few weeks, we hope to finally publish the extensions to our site, and invite anyone interested to download, share, and comment on them. None of them are as fancy as gProject, but all of them have saved us a ton of time.
I. GraphicButton
To kick off the extension exodus, we have made available one of our classes found in almost every AS2 project we have delivered. The GraphicButton class is a simple MovieClip extension that adds
- AS2 EventDispatcher, and events for click, over, down
- Frame-based state management: Add “up”, “over”, “down”, “disabled” frames to your timeline to easily create states, and the class does the rest.
Download the GraphicButton class
II. CreateGraphicButton
To supplement the GraphicButton class is a JSFL script that turns any MovieClip into a GraphicButton. Simply select a MovieClip in your library and run the script, and the necessary layers, frames, and stop actions are added to the symbol’s timeline. The class is then bound to the GraphicButton class, and the class file copied relative to your project.
gProject tutorial on ActionScript.org
Victor Gaudioso has written a nice tutorial on “Setting up a Development Environment and Using gProject to Create Custom Classes” on ActionScript.org. It covers the basics of setting up a project, creating classes, and auto generating properties for on-stage interface elements.
You can check it out here.
Flex Loves Flash? Embed and Beyond.
Last week I had the pleasure of speaking at the 360Flex conference at EBay’s North Campus in San Jose. My presentation was titled “Flex Loves Flash? Embed and Beyond.”, where I explored the different methods available to Flex developers to work with rich assets. I started by covering existing approaches like asset embed, and Flash symbol embed, and discussed strategies for organizing those assets. From there I looked at more advanced techniques for using Flash content, like “shake and bake SWFs” (embedding a SWF as a bytearray, then extracting full classes from it), and using classes/symbols from SWFs that are loaded at runtime. I finished off by looking at new integration techniques that will work with Flash CS3, and some of the approaches I am working with Adobe to develop that will help simplify this integration. I also touched on some related topics like font / svg embed issues, data embedding, and how to use bitmap fonts in Flex.
You can check out the session notes at gskinner.com/talks/.
Over the next few days I will release some of the code I showed, and blog about a couple of the more important topics, like Shake and Bake swfs. You’ll have to wait for some of the more advanced pieces until after Flash CS3 ships though.
Above all, I want to get people thinking about this topic. Flex applications are so much cooler when Flash is involved in the workflow. If you have any tips or ideas on enhancing this workflow, please feel free to leave them in the comments.