2007.09.03

ActionScript

Koji Kimura

Action Script 3.0の変更点まとめ

「ドラムマシン TR909をFLASHで！　FLASHで音の波形編集が可能になった！！」で書いたpopforgeを使って簡単なテルミンっぽいものを作ってみようと思い、今更ながらAction Script 3.0についてちゃんと理解するためにいろいろ調べた結果のメモとしてAction Script 3.0の変更点の中で特に重要なもの書いておきます。

  • Movie Clip にスクリプトが書けない
  • イベントの処理の変更
  • getURLが使えなくなった代わりにURLRequestとnavigateToURLを使う
  • プロパティ名の変更
  • クラス定義に関する変更点
  • 新しく追加されたSpriteクラス
  • リンケージやattachMovieがなくなって代わりにクラスやaddChildを使う 
  • 正規表現が使えるようになった！
  • XMLのparse（解析）が簡単になった！
  • 定数を宣言するconstキーワード

詳しい説明は追記にあります。↓ボタンをクリックしてください。尚この記事のサンプルコードはまだ動作チェックしてません。参考サイトを見て自分なりに書いただけですので動かないかもしれません。

Movie Clip にスクリプトが書けない

AS3.0ではMovieClipインスタンスにスクリプトを書くことができません。AS2.0までのようにMovieClipインスタンスにスクリプトを直接書くことができなくなりました。 AS3.0ではフレームにしかスクリプトを書くことができなくなります。

ウチの会社ではMCに直接スクリプトを書くとどこに書いたか分からなくなるから以前からほとんどのスクリプトをrootのフレームに記述していたた め、個人的にはこの変更はあまり気にならないですが、ボタンをクリックしたらURLに移動するだけのようなスクリプトしか書いていない人は要注意です。

例えば、ボタンをクリックするとURLを開く、以下のようなスクリプトの場合、AS3.0ではエラーになります。

//MovieClipインスタンスに直接記述されたスクリプト
this.onRelease = function() {
        this.getURL("http://www.google.co.jp/","_blank");
};

AS3.0ではこれを以下のように書く必要があります。

//MovieClipインスタンスが配置されたタイムラインのフレームに記述されたスクリプト
this.btnGoogle.onRelease = function() {
       this.getURL("http://www.google.co.jp/","_blank");
};
//MovieClipインスタンスの名前が「btnGoogle」の場合

ただし、イベントに関する扱いも変更されたのでこのスクリプトは正しく動作しません。 詳しくは後述します。

イベントの処理の変更

AS2.0まではonRollOver、onRollOut、onRelease、onReleaseOutside、onClipEvent などのイベントハンドラを利用していましたが、AS3.0ではイベントリスナーを使う必要があります。具体的には addEventListener() を使ってイベントリスナーを登録します。

上記のスクリプトをイベントリスナーを使って記述すると以下のようになります。

 //MovieClipインスタンスが配置されたタイムラインのフレームに記述されたスクリプト
this.btnGoogle.addEventListener(MouseEvent.CLICK, function(e:MouseEvent) {
       this.getURL("http://www.google.co.jp/","_blank");
});
//MovieClipインスタンスの名前が「btnGoogle」の場合

ただし、AS3.0ではgetURLが使えなくなったので、これでもまだこのスクリプトは正しく動作しません。

getURLが使えなくなった代わりにURLRequestとnavigateToURLを使う

AS2.0まではgetURLで簡単にURLの移動ができましたが、AS3.0ではnavigateToURL関数を使う必要があります。しかもこ のnavigateToURLにはURLを文字列として直接渡すことができず、URLRequestクラスを使う必要があります。上記のスクリプトを navigateToURL使って記述すると以下のようになります。

 //MovieClipインスタンスが配置されたタイムラインのフレームに記述されたスクリプト
this.btnGoogle.addEventListener(MouseEvent.CLICK, function(e:MouseEvent) {
       var url:URLRequest = new URLRequest("http://www.google.co.jp/");
       navigateToURL( url, "_blank" );
});
//MovieClipインスタンスの名前が「btnGoogle」の場合

http://weblogs.macromedia.com/akamijo/archives/2006/03/navigatetourl.cfm 

プロパティ名の変更

AS3.0では2.0までのようにプロパティ名の前に「_」（アンダースコア）が付きません。だから「_root」や「_alpha」は「root」「alpha」というように記述しなければなりません。

また、「_xmouse」や「_xscale」は「mouseX」や「scaleX」に名称自体が変更になりました。

変更内容AS1.0/2.0AS3.0
「_」がなくなった _root、_alpha、_height、_parent、_rotation、_visible、_width、_x、_y root、alpha、height、parent、rotation、visible、width、x、y
 名称変更 _xmouse、_xscale、_ymouse、_yscale mouseX、scaleX、mouseY、scaleY

クラス定義に関する変更点

AS3.0では次のクラスの定義について次の点に注意する必要があります。
以下のURLに詳しく解説されています。
http://weblogs.macromedia.com/akamijo/archives/2005/12/package.cfm

新しく追加されたSpriteクラス

AS3.0で追加されたSpriteクラスはMovieClipと同様にグラフィック要素を表示でき、子を持つこともできる DisplayObjectContainerクラスのサブクラスです。MovieClipとほぼ同様のことができますが、タイムラインを持ちません。ア ニメーションをすべてスクリプトで制御する場合やタイムラインを必要としないユーザーインターフェイスなどの用途ではMovieClipではなく Spriteクラスのインスタンスを生成する方が軽いみたいです。MovieClipはSpriteのサブクラスになります。

http://weblogs.macromedia.com/akamijo/archives/2005/11/splite.cfm
http://www.fumiononaka.com/TechNotes/Flash/FN0607002.html

リンケージやattachMovieがなくなって代わりにクラスやaddChildを使う 

スクリプトで生成したSpriteインスタンスやMovieClipインスタンスをステージ上に配置するにはDisplayObjectContainer.addChild()メソッドを使います。また、リンケージ詳しくは以下のサイトを参照してください。

http://www.fumiononaka.com/TechNotes/Flash/FN0607001.html
http://f-site.org/articles/2006/07/07074143.html
http://weblogs.macromedia.com/akamijo/archives/2005/11/splite.cfm

正規表現が使えるようになった！

AS2.0でもこのRegExpクラスを使えばできましたが、やっと標準でサポートされるようになりました。以下のような感じで使えます。

var srcStr:String =  '<a href="http://www.google.co.jp/" target="_blank">Google Japan</a><a href="http://www.yahoo.co.jp/" target="_blank">Yahoo Japan</a>';
//パターンを指定してRegExpのインスタンスを生成します
var regPattern:RegExp = new RegExp('href="[^"]*"','ig');
//matchesに文字列として「href="http://www.google.co.jp/"」と「http://www.yahoo.co.jp/」が格納されます。
var matches:Array = srcStr.match(regPattern);

XMLのparse（解析）が簡単になった！

E4X (ECMAScript for XML)のクラスがサポートされるようになったのでXMLデータの扱いがかなり簡単になりました。以下に簡単なサンプルを書いときます。

var strXML:String = '<work>'+
'<url>http://www.starryworks.co.jp/</url>'+
'<creator type="art director">Koji Kimura</creator>'+
'<creator type="flash developer">Miyako Ueki</creator>+
'</work>;
var objXML:XML = new XML(strXML);
//ノードへのアクセス
trace(objXML.work.url);                                           //http://www.starryworks.co.jp/
//ノードリスト内のへのアクセス
trace(objXML.work.creator[0]);                                //Koji Kimura
//属性へのアクセス
trace(objXML.work.creator[1].@type);                      //flash developer
//条件を指定したノードへのアクセス
trace(objXML.work.creator.(@type=="art director");    //Koji Kimura
//要素の追加
objXML.work.appendChild(<creator>Ryoji Murai</creator>);
//属性の追加
objXML.work.creator[2].@type = "designer";

詳しくは以下のサイトを参考にしてください。

http://weblogs.macromedia.com/akamijo/archives/2006/02/e4x.cfm
http://weblogs.macromedia.com/akamijo/archives/2006/02/xml_1.cfm
http://weblogs.macromedia.com/akamijo/archives/2006/02/xml.cfm

定数を宣言するconstキーワード

AS3.0では定数の定義にconstキーワードを使うようになりました。

この記事を書くにあたって参考にしたサイト

http://livedocs.adobe.com/flash/9.0_jp/ActionScriptLangRefV3/migration.html
http://www.adobe.com/jp/devnet/flash/articles/writing_actionscript.html
http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/
http://weblogs.macromedia.com/akamijo/archives/actionscript_30/index.cfm
http://f-site.org/articles/as/as3/
http://www.fumiononaka.com/TechNotes/Flash/index.html#ActionScript3

STARRYWORKS inc. official web site