Jan 12
明けましておめでとうございます！！
ども、amo-kです。
2009年最初の投稿は、JavaScript / ActionScript についての内容です。
個人的にはRIA大好物ですので、この辺りは興味深いジャンルです。
では、本題に入ります。
JavaScript と ActionScript で相互に会話ができることを知った。
…ということは、
ブラウザ操作をトリガーにFlashを操作、
Flash操作をトリガーにブラウザを操作できるということだ。
これは面白い！！
※厳密には、FlashもブラウザのFlashプレイヤで動作している訳だがそこはおいておこう。
という訳で早速動作確認がてら、簡単なjs, as(Flex用mxml)を書き相互会話サンプルアプリを作ってみた。
サンプルアプリ概要
１．JavaScript(白色部分)からActionScriptの関数を実行
サンプルアプリ上部のボタン「js2as」クリックで
ActionScript側の関数を実行、実行時刻をFlash上に表示。
２．ActionScript(黒色部分)からJavaScriptの関数を実行
サンプルアプリ下部のボタン「as2js」クリックで
JavaScript側の関数を実行、実行時刻をブラウザ上に表示。
※勿論いずれも何度押してもかまわない。
サンプルアプリ上部のボタン「js2as」クリックで
ActionScript側の関数を実行、実行時刻をFlash上に表示。
２．ActionScript(黒色部分)からJavaScriptの関数を実行
サンプルアプリ下部のボタン「as2js」クリックで
JavaScript側の関数を実行、実行時刻をブラウザ上に表示。
※勿論いずれも何度押してもかまわない。
処理概要
上記サンプルアプリは、flash.externalパッケージのExternalInterfaceクラスを利用している。
JavaScriptからActionScriptの関数を実行するには、ExternalInterface.addCallback()メソッドを利用する。このメソッドでは、JavaScriptから呼び出すActionScript関数を定義する。
JavaScriptからActionScriptの関数を実行するには、ExternalInterface.addCallback()メソッドを利用する。このメソッドでは、JavaScriptから呼び出すActionScript関数を定義する。
また、ActionScriptからJavaScriptの関数を実行するにはExternalInterface.call()メソッドを利用する。このメソッドでは、ActionScriptからJavaScriptの関数名を指定する。
サンプルソース
ブラウザ側のサンプルソースコードは、サンプルアプリ白色部分を右クリックしてソースを確認できますので
サンプルソースはFlash側のみ記載します。
import flash.external.ExternalInterface;
import mx.controls.*
// as2jsボタンクリック時実行
private function callFunction():void {
if (ExternalInterface.available) {
try {
ExternalInterface.call("as2js");
}
catch(e: Error) {
Alert.show("error : " + e);
}
}
}
// JavaScriptイベントのコールバック関数定義
private function setCallbackFunction():void {
if (ExternalInterface.available) {
try {
//JavaScript から実行
ExternalInterface.addCallback("js2as", function(): void {
var date: Date = new Date();
var dateTime: String = date.getFullYear().toString();
dateTime += "-" + (date.getMonth() + 1).toString();
dateTime += "-" + date.getDate().toString();
dateTime += " " + date.getHours().toString();
dateTime += ":" + date.getMinutes().toString();
dateTime += ":" + date.getSeconds().toString();
myLabel.text = "JavaScript => ActionScript: " + dateTime;
});
}
catch(e : Error) {
Alert.show("error : " + e);
}
}
}