Showcase and discover digital art at yex

Follow Design Stacks

Subscribe to our free newsletter to get all our latest tutorials and articles delivered directly to your inbox!

ExternalInterface.addCallback()

ExternalInterface.addCallback()

The ExternalInterface.addCallback() method registers custom ActionScript methods so that they can be called from JavaScript. Previously, you could call only a limited number of built-in Flash Player functions, but now by using ExternalInterface.addCallback(), you can directly call custom functions that are defined in your SWF. In addition, you can pass any number of parameters of any supported data type.

The ExternalInterface.addCallback() method takes the following basic format:

ExternalInterface.addCallback (methodName:String, instance:Object,method:Function)

The parameters have the following meaning:

  • MethodName: The name by which the ActionScript function can be referenced from JavaScript
  • instance: The object to which the keyword this resolves in the method; this object does not necessarily have to be the object on which the method can be found, because you can specify any object (or null)
  • method: The ActionScript method that will be called

Type the following code in Flash:

import flash.external.*;
// The name of the Flash variable to be called in JavaScript
var flashFunction:String = "callPlayBall";
var instance:Object = null;
// Callback function executed by the name of variable
var realFunction:Function = playBall;
ExternalInterface.addCallback(flashFunction, null, realFunction);
function playBall(tgX:Number, tgY:Number, spd:Number):Void {
moveMC(ball_mc, tgX, tgY, spd);
}
// Decelerating movement
function moveMC(tgMC:MovieClip, tgX:Number,
tgY:Number, spd:Number):Void {
var mc:MovieClip = tgMC.createEmptyMovieClip("tp_chProp", 98765);
mc.onEnterFrame = function() {
this._parent._x += spd*(tgX-this._parent._x);
this._parent._y += spd*(tgY-this._parent._y);
var diffX:Number = Math.abs(tgX-this._parent._x);
var diffY:Number = Math.abs(tgY-this._parent._y);
if (diffX<0.5 && diffY<0.5) {
this._parent._x = tgX;
this._parent._y = tgY;
this.removeMovieClip();
}
};
}

Type the following JavaScript code:

<script language="JavaScript">
function callExternalInterface() {
/* Call a function registered as callPlayBall
in the SWF named myMovie. */
getMovieName("myMovie").callPlayBall(inputValue.x.value,
inputValue.y.value, inputValue.spd.value);
}
/* This utility function resolves the string movieName
to a Flash object reference based on browser type. */
function getMovieName(movieName) {
if (navigator.appName.indexOf("Microsoft") != -1) {
return window[movieName]
}
else {
return document[movieName]
}
}
</script>

The following code goes in the HTML <body>:

<!--  Click the button to call "callExternalInterface()".-->
<input type="button" onClick="callExternalInterface()"
value="Call Flash Function" />
</form> <!-- Save the values of x, y and spd variables
for each input text in inputValue.-->
<form name="inputValue">
Positon X <input type="text" name="x" size="10" >
Position Y <input type="text" name="y" size="10" >
Speed  <input type="text" name="spd" size="10" >
</form>

Figure 6 shows what happens when you move the ball by sending the values for x, y, and the speed from HTML to Flash.

Example of moving the ball after entering values

Figure 6. Example of moving the ball after entering values

Note: When you test locally, of course, change allowScriptAccess="sameDomain" to allowScriptAccess="always" in Flash Player 8. Also, to let your local Flash content communicate with the Internet, read this Flash Player TechNote.

Comments