| | 77 | === 簡単なアニメーションプログラム === |
| | 78 | |
| | 79 | さて、 !ActionScript 2 および Flash Light 2.x のリファレンスについては、以下のサイトを辞書的に参照するとよい。 |
| | 80 | |
| | 81 | * [http://livedocs.adobe.com/flash/9.0_jp/main/wwhelp/wwhimpl/js/html/wwhelp.htm Flash CS3 ドキュメンテーション] |
| | 82 | |
| | 83 | HTML+!JavaScript の世界が HTML 文書を中心に回っているならば、 Flash+!ActionScript の世界は Flash '''ムービー''' を中心に回っている。 Flash ムービーは複数の'''ムービークリップ'''を重ね合わせるような形で構成されており、レイヤーを分けて同時に複数のアニメーションを走らせることができるようになっている。 |
| | 84 | |
| | 85 | MTASC では、 -header オプションを用いて固定のフレームレートを指定することができるが、このフレームが切り替わるタイミングで呼ばれるメッセージハンドラメソッドが存在する。それが、 !MovieClip.onEnterFrame() メソッドだ。基本的には、空っぽのムービークリップオブジェクトを作成し、そのオブジェクトのメンバフィールド onEnterFrame に、 !JavaScript でやるのと同じ要領で、実際に描画を行う処理が記述された関数オブジェクトを代入しておけばよい。 |
| | 86 | |
| | 87 | 以下は、画面内でランダムな 3頂点による三角形を絶え間なく表示し続けるプログラムのサンプルである。 |
| | 88 | |
| | 89 | {{{ |
| | 90 | class Tuto { |
| | 91 | // 画面の大きさ |
| | 92 | static var MAX_HEIGHT = 240; |
| | 93 | static var MAX_WIDTH = 240; |
| | 94 | |
| | 95 | static var app:Tuto; |
| | 96 | |
| | 97 | var mc:MovieClip; |
| | 98 | |
| | 99 | function Tuto(parent_mc) { |
| | 100 | // 空のムービークリップを生成 |
| | 101 | this.mc = parent_mc.createEmptyMovieClip("tuto_mc", 1); |
| | 102 | // フレームが切り替わるタイミングで呼ばれるメッセージハンドラを設定 |
| | 103 | this.mc.onEnterFrame = function() { |
| | 104 | // ** この関数内の this は、関数の外側における this.mc と同じ意味になる。要注意! ** |
| | 105 | // 画面をクリアする |
| | 106 | this.clear(); |
| | 107 | // 塗りつぶしの開始 |
| | 108 | this.beginFill(0xff4499); |
| | 109 | // 線のスタイルを設定 |
| | 110 | this.lineStyle(2, 0x444444); |
| | 111 | // 線を描画 |
| | 112 | this.moveTo(Math.floor(Math.random() * Tuto.MAX_WIDTH), Math.floor(Math.random() * Tuto.MAX_HEIGHT)); |
| | 113 | this.lineTo(Math.floor(Math.random() * Tuto.MAX_WIDTH), Math.floor(Math.random() * Tuto.MAX_HEIGHT)); |
| | 114 | this.lineTo(Math.floor(Math.random() * Tuto.MAX_WIDTH), Math.floor(Math.random() * Tuto.MAX_HEIGHT)); |
| | 115 | // 塗りつぶしを終了; ここまでで描画した線の内部が塗りつぶされる |
| | 116 | this.endFill(); |
| | 117 | }; |
| | 118 | } |
| | 119 | |
| | 120 | // プログラムの開始点 |
| | 121 | static function main(mc) { |
| | 122 | app = new Tuto(mc); |
| | 123 | } |
| | 124 | } |
| | 125 | }}} |
| | 126 | |
| | 127 | このプログラムをファイル tuto.as として保存し、以下のコマンドでコンパイルすると、 |
| | 128 | |
| | 129 | {{{ |
| | 130 | $ mtasc -swf tuto.swf -main -header 240:240:10 tuto.as |
| | 131 | }}} |
| | 132 | |
| | 133 | this.mc.onEnterFrame に代入している関数が、毎秒 10 回呼び出される。その中での処理内容として、既に描画されている三角形を消し、塗りつぶしの色と線のスタイルを設定し、ランダムな位置と形で三角形を描画する、ということをやっている。 |
| | 134 | |
| | 135 | == デバッグする == |
| | 136 | |
| | 137 | MTASC に対応したデバッガは存在しないが、デバッグ版の Flash を使用することでログを出力することができる。また、このログを Firefox 上でリアルタイムにモニタするアドオンも存在する。 |
| | 138 | |
| | 139 | === デバッグ版の Flash をインストールする === |
| | 140 | |
| | 141 | デバッグ版の Flash プレイヤーは以下の場所にて配布されている。 |
| | 142 | |
| | 143 | * [http://www.adobe.com/support/flashplayer/downloads.html Adobe Flash Player - Downloads] |
| | 144 | |
| | 145 | Firefox で使用するには、自身が用いている OS の「Plugin content debugger」と題されたリンクをクリックしてダウンロードし、インストールを行う。 |
| | 146 | |
| | 147 | === ログファイルのパス === |
| | 148 | |
| | 149 | ログファイルのパスは固定であり、変更できない。 OS によって出力先が異なり、以下のようになっている。 |
| | 150 | |
| | 151 | * Windows XP の場合: %HOMEDRIVE%%HOMEPATH%\Application Data\Macromedia\Flash Player\Logs\flashlog.txt |
| | 152 | * Mac OS X の場合: /Users/(ユーザー名)/Library/Preferences/Macromedia/Flash Player/Logs/flashlog.txt |
| | 153 | * Linux の場合: $HOME/.macromedia/Flash_Player/Logs/flashlog.txt |
| | 154 | |
| | 155 | === Flash Tracer をインストールする === |
| | 156 | |
| | 157 | Firefox 上でログをリアルタイムに表示するアドオン Flash Tracer をインストールする。 |
| | 158 | |
| | 159 | * [http://www.sephiroth.it/firefox/flashtracer/ Firefox extensions - Flash Tracer (2.3.1) - sephiroth.it] |
| | 160 | |
| | 161 | リンク先ページの一番下にある「Install now」をクリックすると、インストールできずに黄色い帯の警告が表示されるので、「許可」ボタンをクリックしてインストールを強行する。 |
| | 162 | |
| | 163 | その後、 Firefox を再起動し、「ツール」メニューの「Flash Tracer」を選択すると、画面左に Flash Tracer ペインが出現する。その横幅をドラッグ操作で広げてあげると、右下隅にスパナーの形をしたアイコンが表示されるので、それをクリックすると設定画面が表示される。その中の「Select output file」と書かれた入力欄に、上述したログファイルのパスを入力し、「Default charset」に「UTF-8」を選択して「OK」ボタンをクリックすれば、準備完了だ。 |
| | 164 | |
| | 165 | === トレースログを出力してみる === |
| | 166 | |
| | 167 | 以下のプログラムを作成し、コンパイルする。 |
| | 168 | |
| | 169 | {{{ |
| | 170 | class Test { |
| | 171 | static var app:Test; |
| | 172 | |
| | 173 | function Test() { |
| | 174 | trace("Hello debug log!!"); |
| | 175 | } |
| | 176 | |
| | 177 | static function Test(mc) { |
| | 178 | app = new Test(); |
| | 179 | } |
| | 180 | } |
| | 181 | }}} |
| | 182 | |
| | 183 | 生成された swf ファイルを Firefox で読み込み、「ツール」メニューの「Flash Tracer」を選択して Flash Tracer を起動すると、以下のようなメッセージが表示されているはず。 |
| | 184 | |
| | 185 | {{{ |
| | 186 | Hello debug log!! |
| | 187 | }}} |
| | 188 | |
| | 189 | このように、'''trace() 関数'''を用いることによって、任意の文字列をログに出力することができる。 |