Stuff to click on

Monday, March 5

360flex - Flex Hearts Flash

presented by Grant Skinner, who finally found eBay after a half hour walk thru beautiful San Jose. ;)

Does Flex love Flash? From the POV of an ActionScript (not Flash) developer...

Embed... you can get rich contact into Flex apps via metadata, directives, or styles [i.e. @Embed(source='myfolder/myfile.png') in the MXML]. The 4 non-flash data types you can embed are images, audio, fonts & binary.
  • Images: supports formats jpg, png, gif, etc; no compression (native); complex formats not supported [i.e. SVG files with animations]; compiler is smart enough to recognize the same asset if embedded more than once

  • Audio: supports formats mp3, etc

  • Fonts: trueType, in short - don't do it. It's a really big pain in the tookus. But it's available "mileage may vary"; system, just like it sounds - reference by system name not the file name, more compatible with CSS and web standards; Resource hog if not controlled with Unicode ranges [i.e. in declarations include 'UnicodeRange=englishRange' - as long as the language range is set up in the flex-config.xml]; no support for bitmap fonts.

  • Binary: supports formats octet stream, swf, etc.; can decompress files; "shake & bake" swf's (a la Talladega Nights)

BUT... sometimes it's easier to just do all this in Flash. It does a much better job of prepping and managing assets (library). Note that symbols must be set to "Export for ActionScript". It centralizes embed statements instead of sprinkling them thru your code. Access is straightforward dot notation. Disadvantage is that it's easier to have dead assets... resource hog.

There is a "Create Flex Asset Library" tool to assist with this process. It autogenerates files and puts assets in the correct locations. Generated code is pretty clean, with little waste. Subsequent instances of running the tool, the form fields are pre-filled to the last settings so you don't have to remember the settings.

Flash 9 also has better integration with designer tools, so it's easier to bring in collateral from files created with Photoshop (for example). It can bring in vector data (or can flatten to bitmap). Text is text. Compression settings can be tweaked. It helps you import the designer elements pretty intelligently and looks like it will work well!

Fonts are still a little tricky. Flash gives bitmap fonts an auto-assigned name that you have to use (which will be similar to "Arial_12pt_st").

Here's where things get interesting...

Embedded symbols are stripped of all ActionScript.

So... how to get around this?
  • Shake N Bake: Embed the SWF as an octet stream, use loadBytes and getDefinition to access classes and symbols. No code hinting and no strong typing

At least... until Flash 9 comes out
  • Then use FlashCS3 SWCs. Code hinting is supported. However you cannot directly specify a location for a SWC. Bummer dude.

Since the Flex framework only "likes" Flex-y display objects, there are a couple of work arounds that "avoid" this issue. But since there isn't any intelligence... do it right the first time please. Better idea would be to write a class to extend the UIComponent to deal with the asset properly. (Ack... I am not even going to try to cover the details here!) In short, I need to learn me some Flash goodness.

Side note - Grant has been trying to build a rhythmic gymnastic "ribbon" game for the Wii in Flash, using gestures from the WiiMote. I heart geeks.

1 comment:

Dan said...

Thanks for that last snippet having to do with the bitmap font naming convention. Just as a side note the font name is exactly as-is (spaces, parentheses, etc. included)

'Tw Condensed Extra Bold_10pt_st'

Pretty odd solution..good work.