FFK10 – Flashforum conference notes

Every year I spend two days sitting in the audience of the Flashforum conference (FFK) listening to great speakers and getting impressed by their experiments and thoughts. It’s also a good way to renew some of the basic knowledge in Flash development and of course to meet some friends in the Flash scene.

So this are most of my notes:

Flash / Flex development:

  • Jessee Freemans Flash Augmented Reality Debug Tool provides an easy way to start with augmented reality development.
  • Use stunning Hype-Framework effects.
  • Dive into dynamic sound generation with André Michelles Audio-Sandbox.
  • Have a look at the PushButton-Engine for component based development.
  • Remember that Flex 4 includes a lot of performance features! It’s highly recommended to switch as soon as possible. For example the Embed-tag reduces PNG file size and lots of improvements are made within the Flex components.
  • Watch the Adobe TV video preview: Flex for mobile devices
  • See Christian Cantrell’s blogpost One Application , Five Screens (Including the iPad)
  • Great tip: ByteArray.org – Why cacheAsBitmap is bad
  • Adobe’s Mobile Development Guide for the Flash platform (applies also to desktop applications) contains performance tips like:

    • DisplayObject.width / height should be divisible by 2 as often as possible
    • Try to avoid Events and / or stop propagation as soon as possible
    • Set DisplayObject.mouseEnabled=false if possible
    • Stop MovieClip animations when removed from stage
    • Use TextField.opaqueBackground=true if possible
    • Use final statement (final class ClassName {})
    • Use BitmapData.get / setVector()

HTML / JavaScript basics:

  • Use “Sprites” with HTML / CSS (load only one bitmap graphic containing all the asset images for your page and show only the particular relevant parts) and preload next page assets using AJAX while your current page is idle.
  • Since usually only 2 simultaneous domain http requests are supported by browsers it’s a good practice to distribute contents from various ip addresses (use asset-servers for example).
  • Load only visible parts of your site using JavaScript viewport events.

Useful workflow utils:

Flash and Amazon SimpleDB

I did some research about using Amazons SimpleDB service within a Flash based application and found these basic facts:

  • http://sdb.amazonaws.com/crossdomain.xml is not available. This means no direct calls from Flash clients in browsers are possible!
  • Even if it would be possible some day, you would need to find a secure way to deliver your AWS key to the Flash client.
  • Using a web proxy is a solution that would cause a lot of traffic on your server.

So using Amazons SimpleDB for browser based Flash applications makes not much sense to me.
It might be more useful for Flash applications running on local machines like Flash projectors or Adobe AIR applications but there is still a security problem with hiding your AWS key.

Anyway, I found two ActionScript libraries that might be useful:
http://code.google.com/p/actionscript-simpledb-library/
http://developer.amazonwebservices.com/connect/entry.jspa?externalID=1365

And this thread in Amazons discussion forums:
http://developer.amazonwebservices.com/connect/thread.jspa?threadID=19698

URLRequest with HTTP authentication

I found a good explanation how to support HTTP authentication with URLRequests here.

That’s the most interesting part:

Best I can tell, for some reason, this only works where request method is POST; the headers don’t get set with GET requests.

Interestingly, it also fails unless at least one URLVariables name-value pair gets packaged with the request, as indicated above. That’s why many of the examples you see out there (including mine) attach “name=John+Doe” — it’s just a placeholder for some data that URLRequest seems to require when setting any custom HTTP headers. Without it, even a properly authenticated POST request will also fail.

You’ll almost surely have to modify your crossdomain.xml file to accommodate the header(s) you’re going to be sending. In my case, I’m using this, which is a rather wide-open policy file in that it accepts from any domain, so in your case, you might want to limit things a bit more, depending on how security-conscious you are:

<?xml version="1.0"?>
<cross-domain-policy>
    <allow-access-from domain="*" />
    <allow-http-request-headers-from domain="*" headers="Authorization" />
</cross-domain-policy>

… and that seems to work; more information on this one is available from Adobe here).

Apparently, Flash player version 9.0.115.0 completely blocks all Authorization headers (more information on this one here), so you’ll probably want to keep that in mind, too.

So this little code snippet explains the basics:

// Base64Encoder contained in Flex SDK
import mx.utils.Base64Encoder;
 
// Encode username and password
var base64Encoder : Base64Encoder = new Base64Encoder();        
    base64Encoder.encode( "username:password" );
 
// Create authorization request header
var urlRequestHeader : URLRequestHeader = new URLRequestHeader( "Authorization", "Basic " + base64Encoder.toString() );
 
// URLRequest setup
var urlRequest : URLRequest = new URLRequest( "url" );        
    // Needs to send some data!!        
    urlRequest.data = new URLVariables( "name=John+Doe" );        
    // Only supported with POST method!!        
    urlRequest.method = URLRequestMethod.POST;        
    // Apply authorization request header        
    urlRequest.requestHeaders = new Array( urlRequestHeader );

Packaging an AIR installation file

I found this adobe help page but I didn’t want to use command line for packaging an AIR installation file. Simply because I’m not used to it. So I was looking for a different way.

Well, actually Flex Builder provides the possibility to do that, but you must ensure to activate the “Copy non-embedded files to output folder” compiler option in the project properties. Otherwise Flex Builder won’t let you select your additional sources.

And for that reason you have to put your additional sources to the src-folder.

Using the Loader-Class with Adobe AIR

Just a quick note because it took me a little while to find out that it’s necessary to use “file://” syntax to access the local file system.

// Basic example:
var url: String = "file:///Users/markusraab/Desktop/yourfile.swf";
 
// or use a file reference:
var file: File = new File();
var url: String = file.url;
 
var loader: Loader = new Loader();
loader.load( new URLRequest( url ) );

Adobe AIR flash.filesystem.File methods throw Error 2037 when no nativePath is set

While developing an Flex based AIR Application I figured out an issue with the flash.filesystem.File class. I tried to access properties like exists, nativePath etc. before a nativePath was set using a browse method. So the while debugging the following error was triggered:

Error #2037: Functions called in incorrect sequence, or earlier

Well, I would expect to get at least some default values. For example File.exists should be false or something. But you will always get an exception. So after research I found a note about it here.

Anyway, the only chance you have is to catch the error.

But there is one thing more: If you publish the AIR application, install it and try it then, you won’t get an exception. Everything works fine than.

Select and access local SWF files within an AIR application

Well, it took me a little time to figure out how to select and load a local SWF file into an SWFLoader instance. Several times I got this error message:

SecurityError: Error #3015: Loader.loadBytes() is not permitted to load content with executable code.

After some research I found this “dreaming in flash” blog entry which basically contains the solution I was looking for.

But then it took me a little more time to figure out how to use this with the SWFLoader. So here is a basic code example:

import flash.display.Loader;
import flash.filesystem.File;
import flash.filesystem.FileMode;
import flash.filesystem.FileStream;
import flash.system.LoaderContext;
import flash.utils.ByteArray;
import mx.controls.SWFLoader;
 
// File reference
var swfFile: File;
 
// Open the SWF file
var fileStream: FileStream = new FileStream();
	fileStream.open( swfFile, FileMode.READ );
 
// Read SWF bytes into byte array and close file
var swfBytes: ByteArray = new ByteArray();
	fileStream.readBytes( swfBytes );
	fileStream.close();
 
// Prepare the loader context to avoid security error
var loaderContext: LoaderContext = new LoaderContext();
	loaderContext.allowLoadBytesCodeExecution = true; // that's it!
 
// Now you could use this with a Loader instance
var loader: Loader = new Loader();
	loader.loadBytes( swfBytes, loaderContext );
 
// Or you could use this with a SWFLoader instance
var swfLoader: SWFLoader = new SWFLoader();
	swfLoader.loaderContext = loaderContext;
	swfLoader.source = swfBytes;

Adobe technology platform RIA guide

This is simply the link list contained in the recently released Adobe technology platform ActionScript Reference PDF.

API References

Documentation

Developer Centers

Downloads

Miscellaneous Resources

Mailing Lists

Forums

Write with AIR applications to the application resource directory

AIR applications are not permitted to write to the application resource directory. This seems to be a security feature and makes sense, because some systems would not allow to write into this directory at system level.

But for testing purposes you might hack this by using a single line of code:

// Writing into that file would fail
var yourFileInAppDir: File = File.applicationDirectory.resolvePath( "yourFile.xml" );
// This is the simple hack:
yourFileInAppDir = new File( yourFileInAppDir.nativePath );

But this only avoids a AIR security error! You must be sure to have write access to the directory!