2008-04-10

FlexSDKには、swfをデバッグできるfdbというデバッガが含まれているというので試してみました。

デバッグ用swfを作成

まず簡単なActionScriptファイルをデバッグ用に用意します。（あとでデバッグするときに参照しやすいように、今回だけ行番号を入れてみました。）これをtest.asとして保存します。UTF-8にしておくことを忘れないようにします。
また、このときのクラスはSpriteから派生したものでないとfdbでデバッグできないようなので注意が必要です。

01| /* test.as */
02| package {
03|   import flash.display.Sprite;
04|   
05|   public class test extends Sprite
06|   {
07|     public function test()
08|     {
09|       trace("---------- test - start ----------");
10|       trace("---------- test - end   ----------");
11|     }
12|   }
13| }

次に、コンパイル用コンフィグファイルを用意します。最後にデバッグ用フラグを指定しているところがポイントです。こちらをtest-config.xmlとして保存します。こちらもUTF-8にして保存します。

<flex-config>
  <!-- 書き出しファイル名 -->
  <output>test.swf</output>
  
  <!-- ムービーサイズ -->
  <default-size>
	<width>400</width>
	<height>200</height>
  </default-size>
  
  <!-- フレームレート -->
  <default-frame-rate>24</default-frame-rate>
  
  <!-- 背景色 -->
  <default-background-color>0xFFFFFF</default-background-color>
  
  <!-- ネットワークの使用 -->
  <use-network>false</use-network>
  
  <!-- デバッグ用フラグを指定 -->
  <compiler>
    <debug>true</debug>
  </compiler>
</flex-config>

この二つを用意したディレクトリでmxmlcを使ってコンパイルします。これでデバッグモードでビルドされたtest.swfが用意できるはずです。

> mxmlc test.as

ここまでのところでわからないことがある人は、こちらのページを参考にしてください。

デバッガの起動

fdb test.swfと実行すると、test.swfがfdbに読み込まれ、fdbプロンプトが立ち上がります。
以下は、fdbプロンプトで実行したコマンドと実行されたときの状況を書いておきます。
（.. の後に書かれている文章は私が追記したメモです。）

(fdb) tutorial .. 簡単な使い方を表示
一般的な fdb セッション :
'run' を使用してアプリケーションを起動します。
'info sources' を使用してファイル名を表示します。
'list' を使用してファイルを一覧表示します。
'break' を使用してブレークポイントを設定します。
'continue' を使用して、ブレークポイントに達するまでプログラムを実行します。
'where'、'print'、'info locals' を使用して、プログラムの状態を確認します。
'next'、'step'、および 'finish' を使用して、個々のステートメントを実行します。
'continue' を使用して実行を再開します。
'quit' を使用して fdb を終了します。

(fdb) list     .. リスト表示.
 1     /* test.as */
 2     package {
 3         import flash.display.Sprite;
 4
 5         public class test extends Sprite
 6         {
 7             public function test()
 8             {
 9                      trace("---------- test - start ----------");
 10                     trace("---------- test - end   ----------");

(fdb) list 10  .. 10行目付近のリストを表示.
 5         public class test extends Sprite
 6         {
 7             public function test()
 8             {
 9                      trace("---------- test - start ----------");
 10                     trace("---------- test - end   ----------");
 11             }
 12        }
 13    }
 14

(fdb) b 10     .. 10行目にbreakpoint設定
ブレークポイント 1 : ファイル test.as、行番号 10

(fdb) c        .. continue→10行目で止まります.
[trace] ---------- test - start ----------
理由 : ブレークポイント 1、関数名 : test()、場所 : test.as:10
 10                     trace("---------- test - end   ----------");

(fdb) bt       .. 現在のスタックフレームをプリント.
#0   this = [Object 19769153, class='test'].test() 場所 :  test.as:10

(fdb) list     .. 現在のソース行付近を表示.
 5         public class test extends Sprite
 6         {
 7             public function test()
 8             {
 9                      trace("---------- test - start ----------");
=10                     trace("---------- test - end   ----------");
 11             }
 12        }
 13    }
 14

(fdb) c        .. 次のbreakpointまで実行（＝最後まで実行）
[trace] ---------- test - end   ----------

今回は簡単なソースで試してみましたが、複雑になればなるほど便利そうな気がします。
デザイナーからFlexSDKに入ってきた人にはちょっとつらいデバッグ環境かもしれませんが、gdbとか使ったことがあるタフなプログラマさんならすぐに使えて、いろいろな情報を取得できる便利な環境だと思います。

octech

fdbデバッガの使い方

デバッグ用swfを作成

デバッガの起動