I was asked to define what was possible in using ExternalInterface when developing for our sites. This is good general information and it’s probably a good idea to keep it together in one place.
Essentially, i was asked how we could call functions from Flex/Flash and have values returned to flash. That api is provided in the Flashplayer as the ExternalInterface api. Generally, it’s a very simple process and should be very fast to develop, but there’s very specific requirements on the development of the application and you need to follow them.
Here’s the sample code (in a FlashDevelop project):
javascripttester
Here’s the MXML / AS3 code to execute the test (this is the code from the .zip file attached). For this test you must use the html file from the package as it contains some javascript that is required, as well as the javascript for swfobject:
<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml” layout=”absolute” creationComplete=”init()”>
<mx:Button x=”37″ y=”77″ label=”Send to Javascript” id=”btnInvoke” click=”start()” />
<mx:TextInput x=”37″ y=”47″ id=”jsFunction” text=”TestFunction” />
<mx:TextInput x=”219″ y=”47″ width=”538″ id=”jsParameters” text=”blue,red,green” />
<mx:Label x=”37″ y=”21″ text=”Javascript Function to Call”/>
<mx:Label x=”37″ y=”111″ text=”Data returned to flash from javascript”/>
<mx:Label x=”219″ y=”21″ text=”Value to send”/>
<mx:TextArea x=”37″ y=”137″ width=”720″ height=”100″ id=”strReturn1″/>
<mx:TextArea x=”37″ y=”250″ width=”720″ height=”100″ id=”strReturn2″/>
<mx:Script>
<![CDATA[
import flash.external.ExternalInterface;
private var js:String;
private function init ():void {
ExternalInterface.addCallback ("jsfunctioncall",this.functioncall);
}
public function start ():void {
this.js = ExternalInterface.call (this.jsFunction.text, this.jsParameters.text);
this.strReturn1.text = this.js;
}
private function functioncall ():void {
this.strReturn2.text = "jsfunctioncall called (cannot send any parameters in a direct call, but you can execute state changes). To set parameters directly, you must use the first method that enables a callback situation to get the values from a function, but if you wish to execute a stop action or other changes to state of an applicaiton while it runs, a direct function call is better than changes to var values directly.";
}
]]>
</mx:Script>
</mx:Application>
Using this test you can form your own working code and successfully integrate ExternalInterface into your development. The sample shows two forms of communication, calling a javascript function and recieving a return value, and calling a function from outside of flash.
