YAIMO BLOG » Progression

Progression 作成記録(1)

admin — Sat, 29 Aug 2009 11:33:36 +0000

今更ながら、Progressionを使用して実験サイトの土台を作成してみました。
実際に案件で使う前に一度使いたかったのが大きな理由。

コンテンツなど何も今の所ないのですが、随時追加予定。

http://yaimo.net/>

今回はメモリのことはあまり考えず実装、構築してみました。
ざっくり使用した感想は、

Progressionでのメモリなどのある程度幅広い知識がないと実際の案件では投入できない

コマンドを使用したり、ｓｗｆを読み込んだ際のunLoad時にメモリをうまく解放できないというのがあるそうです。
検索すると色々な方がエントリーしているので、探してみてください。
Progressionでガベージコレクションされないのをどうにかしようとした記録

メモリだけではなく、swfaddressを使用したパーマリンクを実現する際にも注意が必要。
たまに、Progressionを使用したサイトに見るのですが、Progressionのイベントフローでの処理を理解していないと、アドレスを直接入力した際、Progressionの出力エラーが表示されることがあります。

制作フローを確立すれば、デザインなどの方に時間が割けるのでより良いものが作れる

Progressionを使用することで、同じコンテンツを作成する場合、かなり時間が短縮できると感じました。
特に、ボタンの自動で有効/無効にしてくれるなどの機能や、シーンという概念が最初は理解しにくかったのですが、これがあることにより、とても作りやすくなりますね。

制作後の管理が容易

オレオレプログラムより、Progressionで管理したら、引き継ぎなどをする際も簡単なのでは？
更新する際や、コンテンツ追加の際も、prmlをうまく利用すればとても素敵！！な予感がしました。

今回作成した際に、得たものをこれから、ちょっとずつエントリーしていきます。

とりあえずProgressionデビューだ！！！！

Progression this の扱い(Q) 無名関数, Func, function

admin — Mon, 20 Jul 2009 10:37:21 +0000

Progression this の扱い(破) 無名関数, Func, functionの続き。

Progressionクラスを生成し、コンストラクタで”id”を指定します。

this.id = "yaimo";
trace("クラスのid: "+this.id);
//出力:クラスのid: yaimo
trace("普通にthis: "+this);
//出力:[IndexScene sceneId="/index" id="yaimo" name="index" group="null"]

今回はSerialList.addCommand()内でのthisの扱いについて、全体のコードはこんな感じです。

var sList:SerialList = new SerialList();
			sList.id = "sList";
			sList.addCommand(
				//[		
				new Trace("SerialList.addCommand内でのthis.id: " + this.id),
				new Func(function ():void 
				{
					trace("SerialList.addCommand内でのthis" + this);
					trace("SerialList.addCommand内でのthis.parent" + this.parent);
					this.id = "Function";
					trace("SerialList.addCommand内でのthis.id: " + this.id);
				}),
				function ():void 
				{
					trace("SerialList.addCommand内でのthis.parent" + this.parent.id);
					this.parent.insertCommand(new Trace("追加1"));
					insertCommand(new Trace("追加2"));
				},
 
				[//ここからParallelList
				new Func(function ():void 
				{
					trace("SerialList.addCommand内でのthis: " + this);
					trace("SerialList.addCommand内でのthis.parent" + this.parent);
				}),
				],

全体の出力結果です。

SerialList.addCommand内でのthis.id: yaimo
 
SerialList.addCommand(コード)での実験------new Func()---------
SerialList.addCommand内でのthis[Func id="null" name="command_47" group="null"]
SerialList.addCommand内でのthis.parent[SerialList id="sList" name="command_42" group="null"]
SerialList.addCommand内でのthis.id: Function
-------------------------------------------------------------
 
SerialList.addCommand(コード)での実験-----function()----------
SerialList.addCommand内でのthis.parentsList
-------------------------------------------------------------
追加1
 
SerialList.ddCommand([コード])での実験-----new Func()----------
SerialList.addCommand内でのthis: [Func id="null" name="command_48" group="null"]
SerialList.addCommand内でのthis.parent[ParallelList id="null" name="command_54" group="null"]
-------------------------------------------------------------

基本は前回とほとんど同じなので省きます。
それで注目したいのが、10行目の

trace("SerialList.addCommand内でのthis.parent" + this.parent);

での出力が

SerialList.addCommand内でのthis.parent[SerialList id="sList" name="command_42" group="null"]

でthis.parentの参照がsListになることです。
なので、19,20行目のthis.parentでsListにinsertCommandによる挿入を行わないと思ったとおりの実行をしてくれません。
“追加１”の実行されるタイミングはfunctionのCommandが終わってから。
“追加2″はおそらく、クラスに定義されているaddCommand()｛｝に登録されるんじゃないかと思われます。

【まとめ】

new Func(function:void{}),function():void{}内でのthisはFuncクラスを指す。

SerialList.addCommand(){}の場合、function():void{this.parent}はSerialListを指す。

Progression this の扱い(破) 無名関数, Func, function

admin — Sun, 19 Jul 2009 08:11:26 +0000

Progression this の扱い(序) 無名関数, Func, functionの続き。

Progressionクラスを生成し、コンストラクタで”id”を指定します。

this.id = "yaimo";
trace("クラスのid: "+this.id);
//出力:クラスのid: yaimo
trace("普通にthis: "+this);
//出力:[IndexScene sceneId="/index" id="yaimo" name="index" group="null"]

今回はaddCommand()内でのthisの扱いについて、全体のコードはこんな感じです。

addCommand(
				new Trace("addCommand内でのthis.id: " + this.id),
				new Func(function ():void
				{
					trace("addCommand内でのthis" + this);
					trace("addCommand内でのthis.parent" + this.parent);
					this.id = "Function";
					trace("addCommand内でのthis.id: " + this.id);
					trace("addCommand内でのthis.parent.id: " + this.parent.id);
					this.parent.id = "parentはSerialList";
					trace("addCommand内でのthis.parent" + this.parent);
				}),
				function ():void
				{
					trace("addCommand内でのthis" + this);
					trace("addCommand内でのthis.parent" + this.parent);
					this.id = "fuction";
					trace("addCommand内でのthis.id: " + this.id);
					trace("addCommand内でのthis.parent.id: "+this.parent.id);
				},
				[//ここからParallelList
				new Func(function ():void
				{
					trace("addCommand内でのthis" + this);
					trace("addCommand内でのthis.parent" + this.parent);
					this.id = "Function";
					trace("addCommand内でのthis.id: "+this.id);
					trace("addCommand内でのthis.parent.id: "+this.parent.id);
				}),
				]
			);

全体の出力結果です。

addCommand(コード)での実験-----new Func()----------
addCommand内でのthis[Func id="null" name="command_12" group="null"]
addCommand内でのthis.parent[SerialList id="null" name="command_4" group="null"]
addCommand内でのthis.id: Function
addCommand内でのthis.parent.id: null
addCommand内でのthis.parent[SerialList id="parentはSerialList" name="command_4" group="null"]
 
addCommand([コード])での実験-----function()----------
addCommand内でのthis[Func id="null" name="command_28" group="null"]
addCommand内でのthis.parent[SerialList id="null" name="command_4" group="null"]
addCommand内でのthis.id: fuction
addCommand内でのthis.parent.id: null
 
addCommand([コード])での実験-----new Func()----------
addCommand内でのthis[Func id="null" name="command_19" group="null"]
addCommand内でのthis.parent[ParallelList id="null" name="command_29" group="null"]
addCommand内でのthis.id: Function
addCommand内でのthis.parent.id: null

実際にコードを細かく見ていきます。

まず2行目の、

new Trace("addCommand内でのthis.id: " + this.id)

これは普通にクラス変数なので”yaimo”の出力です。

addCommand内でのthis.id: yaimo

5~11行目

trace("addCommand内でのthis" + this);
trace("addCommand内でのthis.parent" + this.parent);
this.id = "Function";
trace("addCommand内でのthis.id: " + this.id);
trace("addCommand内でのthis.parent.id: " + this.parent.id);
this.parent.id = "parentはSerialList";
trace("addCommand内でのthis.parent" + this.parent);

出力は

1.addCommand内でのthis[Func id="null" name="command_12" group="null"]
2.addCommand内でのthis.parent[SerialList id="null" name="command_4" group="null"]
3.addCommand内でのthis.id: Function
4.addCommand内でのthis.parent.id: null
5.addCommand内でのthis.parent[SerialList id="parentはSerialList" name="command_4" group="null"]

1.thisはFuncコマンドを指すようです。
2.Funcコマンドの親はクラス全体のことを指すと思ったのですが、
どうやらaddCommandで登録したSerialListの方を指すようです。
3.1より、this = Funcなのでidを登録して出力しました。
4.2からわかるようにSerialListのidは”null”です。
5.なので同様に、this.parent.idを登録して出力しました。

■じゃぁ、function():void{}でやってみたらどうなるの？っていうのが15~19行目。
同じですね。function():void{}はnew Func(){function():void{}}を省略した書き方だった気がします。

■3つ目は、addCommand()内に”[]“を使用することによってParallelListを使ったらどうなるかという実験です。
this.parentがParallelListを参照するようになりました。
なるほど、insertで追加するタイミングではParallelListにもなるということですね。
これは応用できそうです。　

【まとめ】

new Func(function:void{}),function():void{}内でのthisはFuncクラスを指す。

this.parentがSerialListなどを指してるのが意外。
スーパークラスでaddCommand()を定義してあるだろうSerialListを指すのはあたりまえか（?)
insertCommandをfunction内で記述する際は、クラスに定義されているaddCommand()｛｝に登録に追加するというイメージ
```
addCommand(
function():void{
insertCommand(new Trace("this.addCommand()に追加"));
});
```

これが次につながってくる。つづく。

Progression this の扱い(序) 無名関数, Func, function

admin — Sat, 18 Jul 2009 07:04:06 +0000

ProgressionのCommand時におけるthisの参照の違いと、無名関数におけるブロックスコープとthisの参照について考える。

Progressionクラスを生成し、コンストラクタで”id”を指定します。

this.id = "yaimo";
trace("クラスのid: "+this.id);
//出力:クラスのid: yaimo
trace("普通にthis: "+this);
//出力:[IndexScene sceneId="/index" id="yaimo" name="index" group="null"]

まずはじめに無名関数におけるthisの扱いから、

private function hoge():void
		{
			var target:MovieClip = new MovieClip();
			trace("普通の関数内でのthis.id: "+this.id);
 
			target.addEventListener(MouseEvent.MOUSE_OUT,function ():void
			{
				trace("無名関数内でのtarget: "+target);
				trace("単純にthis: " + this);
				trace("ではthis.parent: " + this.parent);
				trace("無名関数内でのthis.id: " + this.id);
				trace("無名関数内でのthis.target: " + this.target);
				this.id = "this.idは無名関数内のidとして登録されています。";
				trace("登録後のthis: "+this.id);
			});

出力結果は以下の通り

1.無名関数内でのtarget: [object MovieClip]
2.単純にthis: [object global]
3.ではthis.parent: undefined
4.無名関数内でのthis.id: undefined
5.無名関数内でのthis.target: undefined
6.登録後のthis: this.idは無名関数内のidとして登録されています。

では、無名関数のthisはいったいどこを参照することになるんだろうか。
予想だとthis = function()である無名関数を指してるんだと思う。

ActionScriptではブロックスコープというものがないので無名関数を使用した場合、hoge()のtargetが参照できる。
(外側のローカル変数を参照できる)

this: [object global] global?Functionクラスってグローバルクラスとして生成されるの？

もし、this.parentがMovieClipならfunctionはtargetの下に存在し、this=fuction()のことだと思ったけどなんか違うみたい。

無名関数がクラス全体を指してるなら”yaimo”と出るはずだけどもちろん出ない。

もちろんでない。(this=hoge()??なんていう考えを疑った)

グローバルクラスなので、変数をつけ足せちゃうみたい！へんな発見をした。

【まとめ】
無名関数ではthis の正体はなんなのかわかったような分からないような結果だったけど、
無名関数で this 使うとやけどする!!

無名関数でのthis扱いとしては、
"this=クラスの参照"を実装する時は、無名関数の外でローカル変数を定義し、無名関数での使用を推奨。

つづく。

Progression URLObject の使い道

admin — Mon, 13 Jul 2009 08:02:09 +0000

Progression URLObject ってデータベースのやりとりに便利？な予感。AIRとか。
その他にもURL指定してあげれば

url.navigateTo("_blank");

navigateToURLみたいに使えます。

flash on 2009-7-13 – wonderfl build flash online

package {
    import flash.display.Sprite;
    import jp.nium.net.*;
    import flash.text.*;
    import jp.nium.external.*;
 
 
    public class FlashTest extends Sprite {
        private var textList:Array =[];
 
        public function FlashTest() {
 
            var url:URLObject = new URLObject("http://asdoc.progression.jp/test.swf");
            var url2:URLObject = new URLObject("http://localhost:8081/yaimo");
 
            url.password = "password";
            url.user = "me";
            textinit();
 
            textList[0].text = url.toString();
            textList[1].text = url.host;
            textList[2].text = url.password;
            textList[3].text = url.url;
            textList[4].text = url.fileExtension;
            textList[5].text = ""+URLObject.validate("URLOBjectととはなんぞや");
            textList[6].text = url.fileName;
            textList[7].text = url2.port;
            textList[8].text = url.user;
 
            //URLRequestでかえってくるのでとりあえずURLはURLObjectに入れとけば管理しやすいとか？
            textList[9].text = url.toURLRequest();
 
            //Flash Player のコンテナを含むアプリケーション（通常はブラウザ）でウィンドウを開くか、置き換えます。
            //コメントをはずすと指定URLに飛びます。
            //user設定してあるとuserでログインしたりもできる。
            //url.navigateTo("_blank");
 
            //あとはデータベースと連動するときに役に立ちそうな予感(AIRとか)
            //指定URLに飛んだりするのが便利だった！！
 
        }
        public function textinit():void{
            for(var i:int = 0; i<10;i++){
                var text:TextField = new TextField();
                text.width = 300;
                text.y = i*20;
                addChild(text);
                textList.push(text);
                }
            }
    }
}

Progression SWF Profiler デバックやってみた

admin — Wed, 22 Apr 2009 12:43:22 +0000

Progressionのindex.asでSWF Profilerを以下のように書き込んで使ってやるとうまくいかなかったのでどうにかならないかやってみた。

SWFProfiler.init(stage, this);

原因はおそらく

Progressionのオブジェクトが右クリックの対象の場合、Progressionの自分で作ったコンテキストメニューにうまく追加ができない（自分の力不足）
SWFProfiler.init(stage, this);のthisでのProgressionオブジェクトの登録がよろしくない。
コンテキストメニューを登録したProgression以外のオブジェクトより上にProgressionオブジェクトの設置

1の方法でSWF Profilerのコンテキストメニューの参照を Progressionのコンテキストメニューにいれてやろうかと思ったけど、CastMovieClip.contextMenu できるかなとおもったけどできなかったので保留。
Progressionでコンテキストメニュー追加はどうやるのかと、別の疑問が。。

var menu_item:ContextMenuItem = new ContextMenuItem("Test",false,true,true);
var menu_cm:ContextMenu = new ContextMenu ();
menu_cm.customItems = [menu_item];
CastMovieClip.contextMenu = menu_cm;//ここおかしいだろ

2の方法は、Progressionオブジェクトを SWF Profiler に渡すとうまくいかない。SWF Profilerの中身をのぞいてみると第2引数の

(swf : Stage, context : InteractiveObject)

と記述されておりProgressionのオブジェクトの参照がうまくいかなそうな予感がしなくもない。

3の方法は、上にあるので上にある方を参照してしまうだろうのでいい。

で解決案として、SWF Profiler用のオブジェクトを作成し、そいつに割り当ててやればいいんじゃないかと思います。

// SWF Profiler用のスプライト
var shape:Sprite = new Sprite();
stage.addChild(shape);
shape.graphics.beginFill ( 0xFF9999 , 0.8 );
shape.graphics.drawRect(0,0,200,200);
shape.graphics.endFill();
//shapeのコンテキストメニューにSWFProfilerを登録してやる。
SWFProfiler.init(stage, shape);

YAIMO BLOG » Progression

Progression 作成記録(1)

関連する投稿

Progression this の扱い(Q) 無名関数, Func, function

関連する投稿

Progression this の扱い(破) 無名関数, Func, function

関連する投稿

Progression this の扱い(序) 無名関数, Func, function

関連する投稿

Progression URLObject の使い道

関連する投稿

Progression SWF Profiler デバックやってみた

関連する投稿

YAIMO BLOG » Progression

Progression 作成記録(1)

関連する投稿

Progression this の扱い(Q) 無名関数, Func, function

関連する投稿

Progression this の扱い(破) 無名関数, Func, function

関連する投稿

Progression this の扱い(序) 無名関数, Func, function

関連する投稿

Progression URLObject の使い道

関連する投稿

Progression SWF Profiler デバック やってみた

関連する投稿

Progression SWF Profiler デバックやってみた