How to set focus on a Flex app (and how to reset it after losing it)

If you are running a Flex app and click on another app, you'll lose focus from the Flex app. In most programs in order to regain focus you just reclick the app and off you go. However Flash does not regain focus automatically unless the user clicks on some element that has an onClick event listener set up for it. This can be a problem especially if you have an app that is supposed to run using keyboard controls only (like a slideshow).

In order to regain focus, make sure that your main component on the stage -- like the canvas that holds your app -- has a click listener set up like this:

click="enableKeyListener(event)"

and then you can have a function that is called like this:

public function enableKeyListener(evt:Event):void{
application.addEventListener(KeyboardEvent.KEY_DOWN,keyUpListener);
world.setFocus();
}

You'll note that the enableKeyListener function is called by the application on creationComplete and explicity calls setFocus() on an element that exists on the stage. And it needs to do this again if you want to regain focus. AFAIK there is no setFocus() method in the stage object so you need to choose an element that is on the stage instead.

Turn off labels on a Flex chart

If you don't want the labels along the side and bottom of a chart in Flex to show, set the "showLabels" property of the axis renderer to false like this:

<mx:horizontalAxisRenderer>

<mx:AxisRenderer showLabels="false"/>

</mx:horizontalAxisRenderer>

<mx:verticalAxisRenderer>

<mx:AxisRenderer showLabels="false"/>

</mx:verticalAxisRenderer>

Creating full screen Flex apps

I'm not sure why Adobe doesn't just add this as an option to FlexBuilder but in order to allow your Flex app to go fullscreen you need to follow these steps:

1. Go here to download html templates for fullscreen support: http://www.adobe.com/devnet/flashplayer/articles/full_screen_mode.html
2. Delete all of the files in the html-template folder in your Flex project and place the contents of either the "full-screen-support-with-history" or "full-screen-support" folders from the zip file
3. Add this to the application tag in your Flex project: preinitialize="systemManager.stage.scaleMode = 'showAll'"
4. Call this when you want the app to go fullscreen: systemManager.stage.displayState = StageDisplayState.FULL_SCREEN;

Embedding an swf into Flex will remove all of the timeline code

It appears that if you try to load an swf file into Flex using the SWFLoader you can access functions and variables inside the swf from Flex by using this syntax: mySWFLoader.content.myvariable.

However if you use the embed directive in the SWFLoader, all timeline code is lost, meaning that you can't access functions, use gotoAndStop(), etc...

RSL error 1 of 1 / error #2048 and Vista

A user reported a problem using a Facebook Flex app that uses Runtime Shared Libraries. On Vista/IE they tried to load the app and got this error : RSL error 1 of 1 / Error #2048

In Googling the error, most everyone said that the server needs a cross domain file -- but that is in place and I'm not able to replicate the issue in WinXP(Firefox and IE) or Mac(Firefox).

One forum (http://www.adobeforums.com/webx/.59b6ed13) indicated that a MIME type was needed for the .swz file so I put this in the .htaccess file: AddType application/x-swz .swz

But that didn't fix it either.

Finally I was looking at the date stamp for the framework_3.0.0.477.swf and framework_3.0.0.477.swz files and found that the ones on the server were older than the ones in the bin-debug directory of Flex (the server ones were 4 months while the latest ones were 2 months old). Anyway, I pushed the newer ones to the server and the app loaded perfectly.

Odd that this would only appear with Vista/IE. I was not able to test it with Vista/Firefox...

Using the Share-button to post multimedia (audio, video and flash) in FBML

I have been frustrated in trying to find out how to add multimedia using the share button. The FBML fb:share-button documentation (http://wiki.developers.facebook.com/index.php/Fb:share-button) provides an example of sharing video, but does not give all of the meta information that you can use if you want to share other media types -- they just link to another page which hides the info -- and it is only revealed if you click on the rather innocuous link: "How do I make sure the Share Preview works?". arghhh...

I had gone to that page numerous times and it was only in desperation I discovered it. Anyway, here is the "hidden" info:

Multimedia Tags

The ideal way for you to connect video and media files to the share link is to make the URL in the link point to an html page that contains the <meta>/<link> tags described above (title, description, image_src) along with some additional <meta>/<link> tags:

Audio (required)

<meta name="title" content="page_title">
<meta name="description" content="audio_description">
<link rel="image_src" href="audio_image_src_url">
<link rel="audio_src" href="audio_src_url">
<meta name="audio_type" content="Content-Type header field">

Audio (optional)

<meta name="audio_title" content="audio_title (eg. song name)">
<meta name="audio_artist" content="audio_artist_name">
<meta name="audio_album" content="audio_album_name">

Video* (required)

<meta name="title" content="video_title">
<meta name="description" content="video_description">
<link rel="image_src" href="video_screenshot_image_src_url">
<link rel="video_src" href="video_src_url">*
<meta name="video_height" content="video_height">
<meta name="video_width" content="video_width">
<meta name="video_type" content="Content-Type header field">

Video (example)

Here is an example Flash Video embed:

<embed src="http://www.example.com/player.swf" flashvars="video_id=123456789" type="application/x-shockwave-flash" width="300" height="200"></embed>

For that video, the appropriate metadata would look like this:

<link rel="video_src" href="http://www.example.com/player.swf?video_id=123456789">
<meta name="video_height" content="200">
<meta name="video_width" content="300">
<meta name="video_type" content="application/x-shockwave-flash"><meta name="video_type" content="application/x-shockwave-flash">

Beware of Facebook documentation and blogs

After working on a Facebook app for some time now I have finally come to the conclusion that you can't trust either the documentation or blog posts on how to make something work. It appears that Facebook changes the way things work on a regular basis -- and don't document them very well -- thus breaking your code or making those easy tutorials you found from last year completely useless. Perfect case in point is how to create infinite sessions :(