タロタローグ ブログ

FlashDevelopといえば、無償でActionScriptの開発環境を提供してくれる、Windows＋AS3erの救世主とも言うべきキラーアプリだ。実はFlashDevelopにはテンプレート機能があり、プロジェクトやファイルを新規に作成する際、その元となるテンプレートを自分で作る事も出来る。
FlashDevelopでプロジェクトを新規作成するにはメニューの「Project」-「New Project...」を選択するのだが、ここに出てくる一覧に自分の作ったプロジェクトを追加し、開発効率を向上させる事ができるというわけだ。
と言うことで、Spark Projectに様々なフレームワークやライブラリが登録されているわけだが、その際についでにFlashDevelop用のテンプレートも造ってもらえないかなぁと言う願いを(主にtaka:niumさんやseagirlさんに対して)込めて、簡単な作り方を解説しようと思う。

FlashDevelopのテンプレート

FlashDevelopのテンプレートには、2種類ある。

プロジェクトのテンプレート

プロジェクトのテンプレートは、前述の通り「Project」-「New Project...」選択時に、New Projectダイアログに並んでいる奴の事だ。

ファイルのテンプレート

プロジェクトを開いている時、Project Manager上で右クリック→Addを選択すると出てくる、「New ○○...」とある奴の事だ。

ではまずは、簡単なファイルのテンプレートについて解説する。

ファイルのテンプレート

ファイルのテンプレートは、「Tools」-「Application Files」で開くフォルダの、「Templates\ProjectFiles\○○Project」以下に格納される、拡張子が「.fdt」のファイルだ。○○の部分にはAS2、AS3、HaXeのいずれかが入り、それぞれ対応するプロジェクトのメニューにのみ出てくる。例えばAS3のプロジェクトを作成した場合、右クリックメニューには「AS3Project」以下の物のみが出てくる。

ファイル名には命名規則があり、

<表示名>.<本来の拡張子>.fdt

と言うようにする。<表示名>の部分が、右クリックメニューに出てくる名前になり、実際にそこからファイルを作ると、「<指定したファイル名>.<本来の拡張子>」と言う名前のファイルになる。
例えば、「Templates\ProjectFiles\AS3Project\Progression Scene.as.fdt」であれば、右クリックするとこうなる。

で、このテンプレートだが、中身としては普通にコードを書いてテンプレートを作るわけだが、テンプレートなので変数を使える。変数はかなり色々有るらしく、詳しくはこの辺りの情報を参照して欲しい(古いかも)が、ひとまず最低限必要なのは以下の2つだけだろう。

$(FileName)

作成するファイルに変換される。AS3だとクラス名＝ファイル名が基本なので、クラス名部分に書く。

$(Package)

パッケージ名に変換される。新規にファイルを作成したフォルダ位置から、パッケージ宣言をしてくれる。

例えばこうだ。

これをEmpty Class.as.fdtと言う名前で作成し、フォルダ「org\tarotaro\flash」を右クリックし、メニューから「New Empty Class」を選択して名前を「Tarotarorg.as」として新規作成すると以下のファイル「org\tarotaro\flash\Tarotarorg.as」が出来上がる。

以上が、ファイルのテンプレートの作り方だ。

プロジェクトのテンプレート

次に、プロジェクトのテンプレートを作成する方法について述べる。プロジェクトでは、結構沢山のファイルが出てくるので面倒だが、基本的な考え方はファイルのテンプレートとそう変わらない。
取り敢えず、プロジェクトに必要なファイルは以下のようになる。

• FlashDevelop用の設定ファイル、project.as3proj
• プロジェクト作成時に、そのまま使用する静的なファイル
• プロジェクト作成時に、プロジェクト名やパッケージに合わせて変化するテンプレート
• プロジェクトのアイコンを表す192×168のpngファイル「project.png」(無くても良い)

まずproject.as3projは、FlashDevelopに必ず必要なファイルとなる。拡張子のas3projはAS3用のプロジェクトを表す。ちなみに、AS2用だと「as2proj」、HaXe用は「hxproj」となる。設定ファイルはこの名前で作成すると、実際のプロジェクト作成時には、<プロジェクト名>.as3projと言う名前になる。
なお、project.as3projファイルの中身はXMLで、作成する際は取り敢えず適当にプロジェクトを作成して自分の好みに設定し、その結果出来たプロジェクト設定ファイルを加工して作れば良い。あと、こいつには後述するテンプレート同様の変数が使える。

次は静的なファイル。これは、プロジェクト作成時にもそのままの形で存在すれば良いと言うファイル。これを作るのは簡単で、ただファイルを作っておいて置けば良いと言うだけ。

最後にテンプレートファイル。プロジェクト毎に名前や配置が変わるファイルやフォルダを言う。プロジェクトのテンプレートは、ファイルのテンプレートとは異なる、以下のような命名規則を持つ。

<ファイル名>.<本来の拡張子>.template

こうなる。さらに特徴があり、ファイル名の部分にも変数を使える。
使える変数は結構有るらしいが、取り敢えず次の3つを抑えておけば完璧だと思われる。と言うか俺はこれだけで遣り繰りしている。

$(ProjectName)

新規プロジェクト作成時の3つの入力の内一番上にある、プロジェクト名に変換される。

$(PackageName)

新規プロジェクト作成時の3つの入力の内一番下にある、パッケージ名に変換される。

$(PackagePath)

パッケージ名をパスにしたもの(.→\)に変換される。これはフォルダ名に付けると、パッケージ階層がフォルダ階層になる。

例えば、以下に俺がかなり昔に作った、Progression Framework用のテンプレートの階層構造を示す。

<Root>
│  easycasting.xml
│  index.html.template
│  Preloader.as
│  prml.xml
│  project.as3proj
│  project.png
│
├─deploy
│  └─shared
│      ├─images
│      │      get_flash_player.gif
│      │
│      └─scripts
│          └─com
│              ├─asual
│              │      CHANGES.txt
│              │      LICENSE.txt
│              │      README.txt
│              │      swfaddress.js
│              │
│              ├─deconcept
│              │      expressinstall.swf
│              │      readme.txt
│              │      so_tester.swf
│              │      swfobject.js
│              │
│              └─pixelbreaker
│                      swfmacmousewheel.js
│
└─src
    └─$(PackagePath)
        │  $(ProjectName).as.template
        │
        └─scenes
                $(ProjectName)Scene.as.template

で、このテンプレートで、新規プロジェクトとして

• プロジェクト名：SampleProject
• ファイル位置：C:\Flex\
• パッケージ：org.tarotaro.flash

を与えて作成すると、以下のようになる。

C:\Flex\SampleProject
│  easycasting.xml
│  index.html
│  Preloader.as
│  prml.xml
│  SampleProject.as3proj
│
├─deploy
│  └─shared
│      ├─images
│      │      get_flash_player.gif
│      │
│      └─scripts
│          └─com
│              ├─asual
│              │      CHANGES.txt
│              │      LICENSE.txt
│              │      README.txt
│              │      swfaddress.js
│              │
│              ├─deconcept
│              │      expressinstall.swf
│              │      readme.txt
│              │      so_tester.swf
│              │      swfobject.js
│              │
│              └─pixelbreaker
│                      swfmacmousewheel.js
│
└─src
    └─org
        └─tarotaro
            └─flash
                │  SampleProject.as
                │
                └─scenes
                        SampleProjectScene.as

見れば分かると思うが、project.pngは実際のプロジェクトには出てこない。このファイルは、New Projectダイアログの右上にある多少大きめのアイコン画像に使われる代物で、実際のプロジェクトとは関連性が無いためだ。

これで、プロジェクトのテンプレートに必要なファイル群の作り方はわかってもらえたと思う。というか分かって下さい。分からないと言う場合はご意見下さい。
と言うことで最後に、このテンプレートを配置する方法について述べる。プロジェクトのテンプレートは、1つのフォルダにまとめて、「Tools」-「Application Files」で開くフォルダの、「Templates\ProjectTemplates」以下に格納する。実際このフォルダを見てみると、既存のテンプレートが並んでいる事が分かる。で、ここに命名規則に従った名前を付けたフォルダを放り込むと、晴れてテンプレートが追加されている。FlashDevelop自体を再起動する必要はなく、New Projectダイアログだけ開き直せばよい。フォルダの命名規則だが、以下のようになる。

<番号> <プロジェクトの大分類> - <プロジェクトの種類名>

<プロジェクトの大分類>とは、New Projectダイアログで言うと下線付きの太字で表示される部分だ。で、<プロジェクトの種類名>はブロック型のアイコンが付いた部分となる。さらに、ここで重要なのが番号部分である。プロジェクト名はどうも普通にファイルの順番で大分類を行っているらしく、たとえ大分類が同じでも、名前が連続していない場合別物として扱われてしまう。例えば、

とすると、New Projectダイアログでは、

ActionScript3
  Template 1
ActionScript2
  Template 2
ActionScript3
  Template 3

となってしまうので、注意が必要だ。

まとめ

以上でFlashDevelopのテンプレートの作り方は終了。取り敢えずまた分かった事があったら記事にしたり、質問には分かる範囲で答えていきたいと思っている。先日のSpark Project勉強会#1でのMac率やらIDE保有率を考えると俺のような人間はマイノリティな気がするが、こればっかりは頑張るしかない。