Flash記事

外部APIを使用したFlashとJavaScriptの接続

ExternalInterface.addCallback()

この ExternalInterface.addCallback() メソッドは、ActionScriptのカスタムメソッドをJavaScriptから呼び出せるように登録するためのものです。以前はFlash Playerにビルトインされている、ごく限られた関数しか呼び出せませんでしたが、今は ExternalInterface.addCallback()を使用すれば、ユーザがSWFで定義したカスタム関数を呼び出すことができます。さらに、データタイプがサポートされているものならパラメータを何個でも渡すことができます。

この ExternalInterface.addCallback() メソッドの基本フォーマットは、以下のようになっています。

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

これらのパラメータは、それぞれ次の内容を意味しています。

MethodName：JavaScriptからActionScript関数を参照する際に使用する名前
instance：このメソッドでキーワードの this の対象となるオブジェクト。任意のオブジェクト（またはnull）を指定できるので、このオブジェクトは必ずしもこのメソッドを含むオブジェクトである必要はない
method：呼び出されるActionScriptメソッド

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();
        }
    };
}

以下のJavaScriptコードを入力します。

<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>

以下のコードが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>

図６は、HTMLからFlashにxとyの値を送ってボールを動かした場合の状態と、その速度を表しています。

図６.値を入力してボールを動かした例

注意：もう分かりきったことですが、Flash Player 8でローカルテストを行う際には allowScriptAccess="sameDomain" を allowScriptAccess="always" に変更してください。また、ローカルのFlashコンテンツをインターネットに接続させる方法については、Flash Playerテクニカルノート*を読んでください。

次のステップ

この記事で触れたトピックについてさらに詳しくは、以下のリソースをご覧ください。

Flash記事

外部APIを使用したFlashとJavaScriptの接続

目次

ExternalInterface.addCallback()

次のステップ