ActionScript3 事始め

新年、あけました。
新しいことをやってみようということで、会社でActionScript3を勉強することに。
その下準備の作業をメモ。Windows環境です。

概要

3月22日の技術勉強会 - ActionScript3 / Flex / Apollo 勉強会 - はてな技術発表会日記 - 機能変更、お知らせなど
http://hatena.g.hatena.ne.jp/hatenatech/20070324/1174713674

まずは、概要がよくまとまっている↑からスタート。


開発環境を整える

とりあえず、AS3をコンパイルできる環境を整えよう。
Flex Builderは有料だし、慣れたエディタを使いたいので、Flex2 SDKを使う方法でいくことに。(これがけっこう大変だった)

Java(JRE  or  JDK)が必須なのだけど、入ってたので割愛。

Adobe - Flex 2のダウンロード
http://www.adobe.com/cfusion/tdrc/index.cfm?product=flex&loc=ja

• Flex 2 SDK （無償）と日本語パック
• Flex Compiler Shell(fcsh)
  http://labs.adobe.com/wiki/index.php/Flex_Compiler_Shell
  

をダウンロード(要AdobeID)

Flex 2 SDKのplayerフォルダにデバッグ用のFlashPlayerがあるので、ブラウザを終了させて入れておく。
IE用とそれ以外の2種類。
エラーログやtraceなどを出力するのに必須。

FlexSDKのbinフォルダにパスを通しておく。
Windowsだと再起動orログオフしないと変更が反映されない？


rascut

コードを更新したら即座に結果を見れるfcwrapがとても便利そうなんだけど、インストールが難しそう？

fcwrap 改め rascut - PBD - subtech
http://subtech.g.hatena.ne.jp/secondlife/20070825/1187978780

名前が変わって、gemが公開されインストールが簡単に。

Rubyのインストールからの手順は↓

ActionScript やるなら入れとけ。rascut 導入と使い方。 - てっく煮ブログ
http://d.hatena.ne.jp/nitoyon/20070914/how_to_install_rascut

よくまとまってます。
ログの表示までサポートされていて、すばらしい。
nitoyonさんに感謝。


Hello AS3!

ようやくコンパイル。
お決まりのHelloWorld.as。

package {

    import flash.display.*;  
    import flash.text.*;  

    //HelloWorld
    public class HelloWorld extends Sprite {
        //コンストラクタ
        public function HelloWorld() {
            //テキストフィールドの生成
            var textField:TextField=new TextField();
            textField.text="Hello AS3 World!";
            addChild(textField);
            trace(textField.text);
        }
    }
}

rascut HelloWorld.as -s

rascut便利すぎ。
127.0.0.1:3001にアクセス。
コードを書き換えると、自動でコンパイルして、作成されたSWFを表示してくれる。
ページの再読み込みすらない!!
secondlife氏に感謝。


console.log

デバッグなどで使うtraceはどうせならJavascript同様FireBugのコンソールに出力させたい。


WEB+DB PRESS Vol.41

WEB+DB PRESS Vol.41：サポートページ｜gihyo.jp ... 技術評論社
http://gihyo.jp/magazine/wdpress/archive/2007/vol41/support

「log関数でデバッグ」のlog関数

これを使えばいける。
外部ライブラリの利用方法は

外部ライブラリをローカルにダウンロードし、Flex2SDKのframeworks/flex-config.xmlのsource-pathタグの部分を編集します。

とのこと。
最初はsource-path部分がコメントアウトされているので解除して設定。


↑の特集1「ActionScript 3.0開発入門」

を読んで、PhotoViewer作ってみる。
フィルタや、アニメーションがこんな簡単にできんのかー。


とりあえずのActionScript3 雑感

型指定が面倒。やっぱり。
クラスごとにファイル分けないといけないの？
importは最初面倒なんだけど、慣れれば管理が便利になるのか？
クラスとファイル名をあわせる必要があるみたい。
タイプ量が多い気がする。
↓
エディタの補完機能でどうにかしよう。

萌ディタのjscript.javascript.txtに補完単語を追加 - Cheese Pie
http://d.hatena.ne.jp/cheesepie/20070219/1171816331

補完は↑の方法でやっているので、よく使いそうな単語を追加でおｋ。


とりあえず、なんとか入口まではたどり着けた感じ。