Home > progression | study > [progression勉強]シーン、ボタンを一気に量産してみる

[progression勉強]シーン、ボタンを一気に量産してみる

progressionのワークショップではsceneの数だけクラスを用意する基本的な方法を教えていただきましたが、
trick7さんのこの記事や、
apeirophobiaさんのこの記事のように、
シーンの共通クラスからシーンを量産したり、ボタンの共通クラスからボタンを量産するのをやってみました。

まず、src>classes>myproject(デフォルトの書き出し場所)直下のIndex.as,Preloader.as,IndexScene.asのほかに

  • シーンの共通クラス MyScene.as(SceneObjectを継承)
  • シーンの中の要素 MyPage.as(CastSpriteを継承)
  • ボタンの共通クラス MyBtn.as(CastBtnを継承)

を用意します。

ボタンはIndex.asで作成、
シーンはIndexScene.as作成で追加することにします。

Index.asの_onInitに、下記のコードを追加。

Actionscript:
  1. // ボタンを作成する
  2. var btnId:Array=["index","scene1","scene2","scene3"];
  3. for (var i:int = 0; i <= 3; i++) {
  4.     var btn:MyBtn = new MyBtn( { sId: btnId[i], sceneNum:i } );
  5.     btn.x = 10;
  6.     btn.y = 60 * i;
  7.     addChild( btn);
  8. }

MyBtn.asのコンストラクタの引数initObject にオブジェクト形式でデータ渡を渡す。
arrayに入れてるのはボタンに表示したい名前。sceneNumはボタンの識別番号。

んで、これがMyBtn.asのコンストラクタ↓

Actionscript:
  1. public function MyBtn( initObject:Object = null ) {
  2.     super( initObject );
  3.     // クリック時の移動先を設定する
  4.     if (!initObject.sceneNum) {
  5.         sceneId = new SceneId( "/index" );
  6.     } else {
  7.         sceneId = new SceneId( "/index/"+"myScene"+initObject.sceneNum );
  8.     }
  9.     // 表示を作成する
  10.     var myShape:Shape = new Shape();
  11.     myShape.graphics.beginFill(0x000000);
  12.     myShape.graphics.drawRect(0, 0, 100, 50);
  13.     myShape.graphics.endFill();
  14.   addChildAt(myShape,0);
  15.     var txt:TextField = new TextField();
  16.     txt.mouseEnabled = false;
  17.     txt.textColor = 0xFFFFFF;
  18.     txt.text = initObject.sId;
  19.     addChild(txt);
  20. }

sceneNumが0ならindexに、それ以外なら/index/myscene+sceneNumにリンクするように設定。
あとはボタンらしくするためにシェイプで四角形書いて、テキストフィールドにsIdを表示させました。

これでボタンは終了。
次はシーンの追加です。

IndexScene.asのコンストラクタに下記を追加

Actionscript:
  1. //シーンを追加します。
  2.             var sceneNum:int =3;
  3.             for (var i:int = 1; i <= sceneNum; i++ ) {
  4.                 // sceneを作成する
  5.                 var myScene:MyScene = new MyScene ("myScene" + i, { mySceneNum:i } );
  6.                 myScene.name = "myScene" + i;
  7.                 addScene(myScene);
  8.             }

これはほとんどtrick7さんのコピペですけどwありがたや~
ボタンの時とおんなじ感じでinitObjectに値渡して個性つけてます。

んで、これがMySceneのコンストラクタ。

Actionscript:
  1. public function MyScene( name:String = null, initObject:Object = null ) {
  2. super( name, initObject );
  3.             //ページを作成します。
  4.             _page = new MyPage({myPageNum:initObject.mySceneNum});
  5. }

あと、なにも中にないので、ボタンと一緒でシェイプとテキストだけ入れたいと思うのでCastSpriteを継承したMyPageクラスで表示を作成します。sceneObjectはシーンの制御だけであと(表示)はキャストに任せるってわけです。

MyPageクラスのコンストラクタを以下のように設定。

Actionscript:
  1. public function MyPage( initObject:Object = null ) {
  2.             super( initObject );
  3.             // 表示を作成する
  4.             var myShape:Shape = new Shape();
  5.             myShape.graphics.beginFill(0x999999);
  6.             myShape.graphics.drawRect(0, 0, 640, 480);
  7.             myShape.graphics.endFill();
  8.             addChildAt(myShape,0);
  9.             var txt:TextField = new TextField();
  10.             txt.mouseEnabled = false;
  11.             txt.textColor = 0x000000;
  12.             txt.text = "scene" + initObject.myPageNum;
  13.             addChild( txt );
  14.             this.x = 640;
  15.             this.y = 0;
  16.             this.width = 640;
  17.             this.height = 480;
  18.         }

ここのクラスのaddcommandを設定してやって、完了!

こんな感じ

さーっと手順書いてますが、出来上がるまでは結構モタモタしてました。。。
メモ代わりなんでわかりずらいと思います。
as3まだあんまりよくわかっていない私の記事なので、
もっといい方法がたくさんあると思うので参考になるかどうかわかりませんが…

あっ!あと、すっごいしょうもないとこでつまづきました。
addCommannd内でnew DoTweenerを使おうとしてるときに、

new DoTweener(this, { x:120, time:1,transition:EaseOutExpo}

と書くと、
「未定義のプロパティ EaseOutExpo へのアクセスです。」ってエラー返ってきて、
なんでなんでーと迷路にはまり、必死でググるがヒットする記事がなく…

二時間後ぐらいにやっと解決。

new DoTweener(this, { x:120, time:1,transition:"EaseOutExpo"}

EaseOutExpoを""で囲んでやればいいだけでした。。。

あぁぁぁぁぁなんてしょぼいミスなんやろう。。。
はずかしいー
as3とかtweenerとかよくわかってないからやぁー
もっとちゃんと理解していかなあかんなぁ(;´∀`)

関連する投稿

Comments:0

Comment Form
Remember personal info

Trackbacks:3

Trackback URL for this entry
http://kanariia.com/blog/archives/38/trackback
Listed below are links to weblogs that reference
[progression勉強]シーン、ボタンを一気に量産してみる from kanariia.com blog
pingback from blog.progression.jp» ブログアーカイブ » [お知らせ] 今週の Progression 関連エントリー(2008/11/08 ~ 2008/11/14) 08-11-14 (金) 20:13

[...] kanariia.com blog / [progression勉強]シーン、ボタンを一気に量産してみる [...]

pingback from Progression クラスベース シーンとボタンをforで量産してみる! « FlashとかActionScriptとか 08-12-27 (土) 16:16

[...] trick7さんのこの記事や kanariiaさんの記事 [...]

pingback from kanariia.com blog - [progression勉強]階層のあるサイトを作ってみる 09-01-25 (日) 3:44

[...] Older [...]

Home > progression | study > [progression勉強]シーン、ボタンを一気に量産してみる

bookmark
nakanohito

あわせて読みたい
あわせて読みたいブログパーツ

Return to page top