February 18, 2009

FlashDevelop with Flash CS3

FlashDevelop と Flash CS3 を連携させる

以前、 FlashDevelop Install という記事を書きました。今回はその続きです。FlashDevelop と Flash CS3 を連携させると多くの点でメリットがあります。そのため、かなりオススメしたいです。

メリット
  • コードアシスト機能
  • FlashDevelopの多くのコードアシスト機能が使えます。

    1)[Ctrl]+[Space]

    文脈に応じたコードヒントが表示されます。

    2)[Ctrl]+[Shift]+[Space]

    メソッドの () の中で使用すると、そのメソッドの引数に関して説明が表示されます。メソッドにASDocがあればそれに応じた説明が表示されます。説明が多い場合は省略して表示されますが、その際は[F1]キーで拡大できます。

    3)[Ctrl]+[Alt]+[Space]

    そのプロジェクトで使えるクラスのリストが表示されます。

    4)[Ctrl]+[Shift]+[1]

    後述。文脈に応じたコード生成を行います。


  • import自動補完
  • 型宣言の入力を終えた際、自動でヘッダにimport文が挿入されます。


  • スニペット機能
  • コードを前もって登録しておけば、Ctrl]+[B]キーで好きなタイミングで呼び出せます。


  • 定義元へ移動
  • クラス名やメソッド、プロパティなどにテキストカーソルを合わせ[F4]を押します。すると、その宣言をしているコードまで移動できます。定義元が別ファイルであればそれを開きさえします。移動後は[Shift]+[F4]で戻れます。

条件
  • FlashDevelop がインストールされていること
  • Flash CS3 がインストールされていること

連携させるための大まかな流れ

1) FlashDevelop でプロジェクトを作成する
2) Flash CS3 で fla (Flash ファイル (AS 3.0)) の作成。
3) FlashDevelop で ActionScript ファイルの作成。
4) FlashDevelop で パブリッシュ([Ctrl]+[Enter])

1) FlashDevelop でプロジェクトを作成する

Path To Flash IDE

プロジェクトを作成する前に、一つ確認しておきたいことがあります。

  • Tools > Program Settings > Plugins (AS3Completion)

この AS3Completion に "Flash IDE" という項目があります。そこで Flash CS3 があるディレクトリ (フォルダ) が指定されているか確認してください。Windows 機の方で Flash CS3 を初期設定のままでインストールされている場合は C:\Program Files\Adobe\Adobe Flash CS3 となっているかと思います。ここで設定するものはそれで大丈夫です。

新規プロジェクト作成

上部メニューの Project > New Project を選択します。すると、ウィンドウが一つ出てくるので、そこでは Flash IDE Project を選択します。Name は任意の名称で大丈夫です。

2) Flash CS3 で fla (Flash ファイル (AS 3.0)) の作成。

Flash CS3 で新規ファイルの作成

上部メニューの ファイル > 新規 を選択します。すると、ウィンドウが一つ出てくるので、そこでは Flash ファイル (AS3.0) を選択します。

ドキュメントクラスの設定

Flash CS3 下部にあるプロパティウィンドウの "ドキュメントクラス" というところにクラス名を付けます。今回はここを Main と入力します。それが終わったら、先ほど FlashDevelop で作ったプロジェクトファイルと同じフォルダにこの fla ファイルを保存します。

3) FlashDevelop で ActionScript ファイルの作成。

ActionScript ファイルの作成

FlashDevelopに戻り、Project ウィンドウのプロジェクトフォルダを右クリックして、Add > New Class を選択します。ウィンドウが現れ名前の入力を求められます。この時、名前を fla ファイルのドキュメントクラスと同じものを入れることが重要です。 今回は ここに Main.as と入力します。これで、ActionScript ファイルが作成されました。

ActionScript の記述

以下は、Flash CS3 の trace で Hello, World! と現れるスクリプトです。

package{
    import flash.display.Sprite;
    public class Main extends Sprite{
        public function Main(){
            trace("Hello World!")
        }
    }
}

4) FlashDevelop で パブリッシュ([Ctrl]+[Enter])

引き続き FlashDevelop です。 [Ctrl]+[Enter] を押すと、自動でFlash CS3に切り替わり、パブリッシュ(ムービープレビュー)されます。 swf ファイルはプロジェクトフォルダ直下に作成されます。