３／１（土）の 第４回 東京てら子 で Progression の講座を受けてきました。
ver 2.0.1 の mxp はここからダウンロードできます。正式リリース（今週の金くらい？）の直前バージョンです。
http://progression.libspark.org/trac/browser/tags/2.x.x/2.0.1
Progression の初めの一歩
ダウンロードした Progression2.mxp ファイルをダブルクリックするとインストールできます。Adobe Extension Manager があった方がいいのかも。インストールすると、メニューの 「 ウィンドウ 」 ＞ 「 その他のパネル 」 のところに 「 Progression Framework 」 ってのが出てきます。↓
メニューをクリックすると、↓のようなパネルが出てきます。
↑ 名前を決めて、種類を選びます。「 クラス 」 は AS でゴリゴリ書いていくモードです。「 EasyCastingXML 」 は、「 Adobe - デベロッパーセンター : Progression Framework 2 初級編：ActionScriptを書かずにFlashサイトを簡単に構築する 」 が参考になるかと思います。「 標準XML 」 と 「 タイムライン 」 はまだよく分かってません。
↓幅と高さは stage の wifth と height です。「 100％ 」 のチェックボックスにチェックを入れると、生成される HTML 内の CSS で div要素の width と height として設定されます。「 中央に表示する 」 も CSS で flash 領域を画面中央に指定してくれます。
設定したら、「 作成する 」 をクリック。
すると、勝手に関連するファイルを自動生成してくれます。
↓こんな感じ。
deploy フォルダの中には他にもファイルが生成されていて、swfmacmousewheel.js、swfaddress.js、swfobject.js の３つは標準装備されていて、それも簡単に設定可能。src フォルダ内 のclasses の中には Tweener も入ってるという至れり尽くせり仕様ｗ
すごーい！ nium さんグッジョブ！！！ｗ
いや、グッジョブどころではないよ、コレは＠
てら子でもらったサンプルを元にページを作ってみる。
上で紹介したパネルで設定しようと思ってもできなかったこと。・ width も height も 100% 設定で、 StageScaleMode.NO_SCALE にしてセンタリングする。
要するにやりたいことは、こういうこと です。ブラウザ内いっぱいに flash 領域を広げたいのだけれど、ScaleMode.NO_SCALE でいくとコンテンツ（ステージ）が左上に行っちゃうんですよね。センタリングしようと思ったら、resize イベントを取らないといけない。
さすがにそれは自分でやらなきゃってな話でしたｗ
というわけで progression のコードを色々見てたのですが、IndexScene.as 内に 「 progression 」 を発見。これは IndexScene が継承している SceneObject のプロパティで、Index.as で new Progression() した時にセットされる模様。
542 // root を設定する
543 _root.progression_internal::progression = this; // (this is Progression)==true
で、この Progression オブジェクトは stage の参照を持っている （ Progression.stage ） ので、
_page = new IndexPage(progression.stage);
とでもして、IndexPage に stage の参照を渡し、
private var _stage:Stage;
public function IndexPage(stage:Stage) {
_stage = stage;
positioning(0);
_stage.addEventListener(Event.RESIZE, positioning);
}
private function positioning(e:Object):void {
x = (_stage.stageWidth - width) / 2;
y = (_stage.stageHeight - height) / 2-20;
}
という感じで、ようやくステージリサイズに対応。。
走り書きな感じのメモ。詳しく説明できたら、次回以降のエントリーにでも。
もっといいやり方があるやも？
てら子のサンプルファイル
Progression 作者の taka:nium さんの blog の この記事 から てら子のサンプルをダウンロードできますよ。関連記事
・ AS3.0 : Progression Framework 2.0.3 を使って Flash サイトを構築する。
この記事を ブックマーク :
<< 使いどころ難しくない？ｗ Google Talk chatback badge ( ウィジェット ) | 第４回 東京てら子で Progression 講座受けてきたよ。 | AS3.0 : Progression Framework 2.0.3 を使って Flash サイトを構築する。 >>
Hatena Ring netnomad 
prev 
random 
next
コメント (2)
ワークショップ参加していただいてありがとうございました！
プロジェクトタイプの「標準 XML」は「シーン構造は（CMS とかの都合上）XML で作りたいけど、それ以外は ActionScript で書きたい派」向けの機能で、「タイムライン」はクラスに書いてある内容がフレームアクションに書いてあるので「AS2.0 以前のようにフレームアクションベースで造りたい派」向けという感じです。
SWF 内でセンタリングするのは僕もよくやるんですが、センタリング対象をどう設定するかを含めてうまい具合に汎用的な仕組みが思いつかなかったので保留しつつ、とりあえず以下のように手段をいくつか用意して取捨選択してもらっている状態でした。
・DocumentRoot.root の onResizeProgress イベントハンドラメソッドを設定もしくはオーバーライドする
・DocumentRoot.stage プロパティから static に参照する
・DocumentRoot.addEventListener( DocumentEvent.RESIZE_PROGRESS ) で受け取る
ただ、これを書いていて思ったんですが DocumentRoot クラスや Progression.container プロパティはルート扱いなので、これに対して centering プロパティを持たせて、それを true or false で切り替えるのであれば使うのもシンプルでいいかなと思ったので、さっそく実装してしまいましたｗ
正式リリース版には含まれるので、楽しみにしておいてください！
posted by taka:nium | 2008年03月05日 02:16
＞「標準 XML」、「タイムライン」
→なるほど、理解しました。色々試していきたいと思います！
＞centering プロパティ
→さっそく実装されましたかｗ
正式リリース版、楽しみにしてます＾＾
詳しい説明、ありがとうございました！
posted by Ko:ki | 2008年03月05日 10:00