[Books] FlashとFlexとAIRの本
- The Essential Guide to Open Source Flash Development (The Essential Guide)

Flash本。ネットで断片的に情報を集めるとえらい時間がかかりそうな膨大な数のオープンソースプロジェクトを一カ所に集めてレビュー(ほとんどは紹介のみだがワクワクさせられる)しているすごい本。しかもそれぞれのプロジェクトの責任者のような人が執筆しているのがよい点で俄然信頼性がでてくる。内容が無茶苦茶濃いので全部読めてないけど、AMFPHPとデバッグツールに関するレビュー部分は役立った。haXeが気になった。前半5章ぐらいを同じ人が執筆しているのだけど、何故かActionScript 2と3を(断りなしに)混在させて説明していくスタイルなのでよみづらい。Papervision3Dは10ページほどしか説明されていない。こんな中途半端にページ割くぐらいならなくてもいいんじゃない。あとTweenerじゃなくてFuseってのが紹介されてる。Tweenerにしろよ!
- Foundation Flex for Developers: Data-Driven Applications with PHP, ASP.NET, ColdFusion, and LCDS (Foundation)

Flex本。名前の通りFlexとその他とのデータ通信、という部分に重点を置いている。HTTPService(URLLoadrと違うところ)やRemoteObject、サーバー側の各技術についてそれぞれ章を設けて過不足なく説明している。本の半分は各サーバーサイド技術のケーススタディなので中々貴重な本なんじゃないかな。RemoteObjectに必要なconfigファイルが何なのか説明がなく残念(今だに理解できておらず)。Ruby(Rails)との連携が全然書いてないのも残念無念。
- Creating Mashups with Adobe Flex and AIR (Friends of Ed Abobe Learning Library)

Flex + AIR本。マッシュアップされる側(Twitter, Amazon, etc.)のAPIの説明に重点が置かれていて、ActionScriptはできて当たり前という感じ。扱っている内容は高度だと思う。同時に3コのAPIを盛り込んで(1コずつやれよ!)モリモリコーディングしていくけどスクリプトの説明はおかまいなしというスタイルで、重要なところが見えにくく教本としてはあまり好きになれない。後半、結構なページ量AIRに割かれていて、それは役立った。特にFlexからAIRに移行する際のつまずきそうな箇所に重点が置かれている(ウィンドウと***-app.xmlについて等)。
Twitterクライアントの作成例の図に日本人の方の発言がでかでかと掲載されてて超おもろい。本の著者は絶対理解してないだろうけど。
****: エロゲはよくわからんな。
*******: 靴脱がしちゃらめええええええええ(Creating Mashups p.212 Figure 10-4より)
[AIR] SimpleLogger
Tags: AIR

FlashやFlexのクラスオブジェクトArray, ArrayCollection, Objectの中身を最深層までモニターに表示するAdobe AIRアプリケーションです。中身を確認したいオブジェクトを送信専用クラス(SimpleLogger.as)の引数に渡すだけでモニターに中身が表示されます。一応既存のloggingツールと差別化されているはず。詳細は[AIR] SimpleLoggerよりどうぞ。
追記 2008/09/01
ログの消去ボタンの追加、スクロールバーの動作修正、ウィンドウの外観をOSデフォルトのものに変更。ThunderBoltもObject深層まで走査できるっぽいので差別化されてないかも。でもThunderBoltはでかくてダサい。
追記 2008/09/02
XMLオブジェクトの解析が可能になった。XMLだけ特別にツリー状に表示される。
追記 2008/09/04
英語ページ作成。日本語ページより見やすい気がする。
[Flex][Flash]Debug Loggingツール比較
サーバーから受信したxmlデータをActionScript Objectで受信したとき、格納したArrayCollection (Array)の構造を簡単に調べたいというのがそもそもの目的。いくつかあたってみたのでその簡単な使い方と個人的な感想を書き留める。Flex 3でしか確認していないので、Flashの場合は少し勝手が違うかもしれません。結論を先に言うと、Xray, ThunderBolt, Arthropodの中で目的を達成できたのはXrayのみ。個人的に気に入ったのはArthropod。
調べたこと
以下のようなxmlデータをHTTPServiceのレスポンスとして受け取りArrayCollectionに格納したとき、ネストした内容(id, name)がLoggingツールで見れるかどうか確認。
<?xml version="1.0" encoding="utf-8"?> <users> <user> <id>1</id> <name>Chris Allen</name> </user> <user> <id>2</id> <name>Wade Arnold</name> </user> <user> <id>3</id> <name>Aral Balkan</name> </user> <user> <id>4</id> <name>Nicolas Cannasse</name> </user> </users>
1. Xray
生のArrayCollectionの中身は見えなかったが、ArrayUtil.toArray()を用いて受信データをArrayCollection -> Arrayに変換すれば確認可能。ツール自体の機能で、ステージ上のオブジェクト全てのプロパティを丸見えにすることができ、さらにプロパティをXrayコンソールから動的にいじることができるのが便利。フレームレートがリアルタイムに確認できるので、例えば予定以下のパフォーマンスだった場合に、ボトルネックになる箇所を探せる可能性がある(アルファをいじったら改善された etc.)。難点は超不安定なところ。専用コンソール(.swf)がやたらと落ちる(起動中に止まる)。Macを再起動しないと再生できないような状態になることもしばしばで、使うのがためらわれる。現在開発進行中ではないことも理由かもしれない。
使い方
- osflash-xray - Google Code > Downloads > Xray_Flex2_Library_v0.5.swc をダウンロード(コネクター)。Flex3と名のつくものはなくてこれが最新バージョンになっている。
- Xray ( The AdminTool ) Open Source Flash > Downloads > Interfaceよりコンソールをダウンロード(SWF Onlyと書かれたもの)。これを使ってモニターすることになる。
- Flexプロジェクトにswcファイルにパスを通す。
import com.blitzagency.xray.inspector.flex2.Flex2Xray; import com.blitzagency.xray.logger.XrayLog;
をインポートし、それぞれのインスタンスを作成して、swfファイルを起動(例えばmyFlexと命名)。
var xray:Flex2Xray = new Flex2Xray(); var log:XrayLog = new XrayLog();
- Xrayコンソール(Xray.swf)を起動して左側のGoボタンを押すと調べたいswfファイルのモニタリングを開始する。
- myFlex内の調べたいオブジェクトに例えば以下のような処理を(myFlex内で)施すことでXray.swfコンソールで中身を確認できる。
//ac is ArrayCollection receiving the xml data var ary:Array = ArrayUtil.toArray(ac); log.debug("Nested arrays:", ary);
2. Arthropod
シンプルでコンパクトで見た目もこぎれいなAIR製Logger。利用方法も簡単なので非常に良いと思うけど、目的は達成できず。ArrayColection、ArrayCollectionをArray変換したもの、ネストしたArrayともに視覚化できなかった。今回は結局何にもできなかったけど、個人的にはオススメ。
使い方
- Arthropod > DownloadよりASソース(1ファイル)とコンソール本体(.air)をダウンロード
- Flexプロジェクト(myFlex)にソースをインポート。
import com.carlcalderon.arthropod.Debug; - myFlex内の調べたいオブジェクトに以下のような処理を施し、myFlex.swfを起動するとArthropod.airで中身をモニターすることができる。Logging用のインスタンスを作らなくてよいところが便利。
//ac is ArrayCollection receiving the xml data var ary:Array = ArrayUtil.toArray(ac); Debug.array(ary);
- 他にもいくつかユーティリティがあるがそれほど多くなく、長ったらしいドキュメンテーションもない。
3. ThunderBolt
Arthropodと同じくモニターはair製で、Flash Playerが吐くFlashlog.txtをモニターする作りになっている。ArrayCollection、ArrayCollectionをArray化したものの視覚化はできなかったが、例えば以下のようにネストしたArrayの中身は確認できた。
var ary:Array = [{id:"1",name:"Chris Allen"}, {id:"2",name:"Wade Arnold"}, {id:"3",name:"Aral Balkan"}, {id:"4",name:"Nicolas Cannasse"}];
ただ、僕の目的は達成できておらず、さらに起動までの設定が少し面倒、モニターが無駄にでかい、なんか見た目がダサイというところが使う気を起こさせない。
使い方
設定についてはFlashのログ閲覧アプリThunderBoltをいれてみた|_level0.CUPPYが詳しいのでそちらを参照ください。少し補足しておくと、Flash PlayerにFlashlog.txt (Macの場合、/Users/USERNAME/Library/Preferences/Macromedia/Flash Player/Logs/flashlog.txt)というログファイルを吐き出させる設定が必要で、そのためには”/Users/USERNAME/mm.cfg”に以下の記述をする必要がある。
TraceOutputFileEnable=1
[Air]Adobe CS3風アイコンジェネレーター「Icon Generator」
Tags: AIR
Adobe CS3風のアイコン作ろうと思ってたらまさにそれ用のAirアプリケーションが配布されてた。
Icon Generatorが登場したよ - Yasu Log::Flash/Flex/AIR::ブログ
アイコンサイズも複数選べるのでいい感じ。Macのドックに並べて見ると少しだけadobeの正規アイコンよりでかかったので神経質な人は気になるところかもしれない。Airになじみのない人に念のため。Air製アプリを使うためにはAirアプリのインストーラー(Runtime)をインストールしないといけない。つまり初回は二個ソフトウェアをインストールすることになる。ほんの少しだけ手間がかかるのがAirが今イチ普及しない理由の一つなのだろうけど、Flash Player 10からはサーバーを介さずにローカルにファイルを保存できるようになるので、こういったもののWebアプリケーション版が作り甲斐でてきそう。最高だなFlex。ということでTwitter用アイコン作ったぜー。
[AIR] PixelPerfect
Tags: AIR
Adobe AIRのデスクトップアプリケーションサンプルPixelPerfectというやつが便利。デスクトップ上に半透明の2Dルーラー(ものさし)が表示されるというものなんだけど、CSSの微調整に使ったり、スクリーンショットなんかからお目当てのサイズの画像が簡単に抜き出せるのがいい。Adobe AIR製アプリケーションはWindowsやMacなんかのプラットフォームに関係なく動作するというのが最大のウリで、アプリケーション作成者側としては一個開発するだけで皆に使ってもらえるから最高に楽。ただし、Adobe AIRアプリケーションを実行するための実行環境がローカルマシンにインストールされている場合に限る、という厳しい条件付き。
FLASHの場合、ブラウザがプレイヤーを標準装備していたり、プレイヤーのアップデートがいつのまにかできてたりと、ユーザーがそんなに手をわずらわすことなく利用可能だったから今みたいに普及してるわけだけど、Adobe AIRも同じように普及するんだろうか。今見たらFLASHやってる人たちは結構AIRアプリケーション作成もしてるみたい(Adobe AIRギャラリー)。デフォルトのAdobe AIRアプリケーションのアイコン格好いいし、活動範囲として視野に入れておくべきなのかもしれない。



