Home > Progression

Progression Archive

東京てら子15 『Error Handling&Security』での発表内容


先日開催された東京てら子15 『Error Handling&Security』に参加された皆様、お疲れさまでした。

そこで発表した内容を(当日はスライドなど用意していなかったので、簡単なサンプルを作って)、記事にまとめてみました。

ちなみにですが、僕はProgressionのデバッグやエラー処理に関してお話させて頂きました。

サンプルファイルは、こちらからダウンロードしてください。(FlashCS3形式)

LoaderListでのイベント処理

いろんなものを読み込む時(プリローダーとか)で、よく使用すると思います。

DLしたファイルのpart1を、ムービープレビューしてみてください。

読み込みを開始
読み込んでいます
txtを読み込み
読み込んでいます
xmlを読み込み
読み込みが完了

このように表示されるかと思います。

txt、xmlの読み込みを待って、完了のイベントが送出されています。

SceneManagerオブジェクトのイベント

SceneManagerオブジェクトでは、実行、中断、エラーなどはProcessEventとして取得出来ます。

//Progressionのmanagerを使った使用例
manager.addEventListener(ProcessEvent.PROCESS_START, startHandler),
manager.addEventListener(ProcessEvent.PROCESS_SCENE, sceneHandler);
manager.addEventListener(ProcessEvent.PROCESS_EVENT, processHandler)
manager.addEventListener(ProcessEvent.PROCESS_CHANGE, changeHandler)
manager.addEventListener(ProcessEvent.PROCESS_COMPLETE, completeHandler)
manager.addEventListener(ProcessEvent.PROCESS_ERROR, errorHandler);

Debuggerを使おう!

step1

次にDLしたファイルのpart2>step1を、ムービープレビューしてみてください。

あああああ
いいいいい
ううううう

このように表示されるかと思います。

SerialListを二つ作成し、addCommandで一つに纏めているだけです。

step2

次にDLしたファイルのpart2>step2を、ムービープレビューしてみてください。

今回は、ちょっとエラーを発生させてみます。

あああああ
いいいいい
Error: Error #2032: ストリームエラー。 URL: file:///Macintosh%20HD/Users/flabaka/Desktop/DebugTest/part2/step2/sumple.xml
on 5/6 positions of the [object SerialList]
at [object LoadURL url=”sumple.xml” factor=1]

at jp.progression.commands.net::LoadURL/_ioError()
at flash.events::EventDispatcher/dispatchEventFunction()
at flash.events::EventDispatcher/dispatchEvent()
at flash.net::URLLoader/redirectEvent()

エラーログを見ると、SerialListのLoadURLの箇所でエラーが発生していることが分かります。(sample.xml→sumple.xmlなので)

今回は、単純にSerialListが二つだけなので、エラー発生箇所が見つけやすいのですが、コードが長くなってしまう時は、これでは不便ですよね?

step3

次にDLしたファイルのpart2>step3を、ムービープレビューしてみてください。

あああああ
いいいいい
Error: Error #2032: ストリームエラー。 URL: file:///Macintosh%20HD/Users/flabaka/Desktop/DebugTest/part2/step3/sumple.xml
on 5/6 positions of the [object SerialList id=”sList1″]
at [object LoadURL url=”sumple.xml” factor=1]

at jp.progression.commands.net::LoadURL/_ioError()
at flash.events::EventDispatcher/dispatchEventFunction()
at flash.events::EventDispatcher/dispatchEvent()
at flash.net::URLLoader/redirectEvent()

今回は[object SerialList id=”sList1″]と表示されていますよね?

//SeriaListを作成
//それぞれのSerialListにidをつけておく
var sList1:SerialList = new SerialList({id:"sList1"},
			
//SeriaListを作成
//それぞれのSerialListにidをつけておく
var sList2:SerialList = new SerialList({id:"sList2"},

step2では、new SerialList(null,と書いていたんですが、今回はinitObjectにidを指定してあります。

こうしておくことで、[object SerialList id=”sList1″]のようにidがsList1の中でエラーが発生していますよ! と対象を絞り込むことが出来るようになります。

step4

次にDLしたファイルのpart2>step4を、ムービープレビューしてみてください。

[info] コマンドを実行
[info] コマンドを実行
あああああ
[info] コマンドを実行
[info] コマンドを実行
いいいいい
[info] コマンドを実行
[info] コマンドを実行
[error] DebugError #001: コマンドの実行中に例外発生
Error: Error #2032: ストリームエラー。 URL: file:///Macintosh%20HD/Users/flabaka/Desktop/DebugTest/part2/step4/sumple.xml
on 5/6 positions of the [object SerialList id=”sList1″]
at [object LoadURL url=”sumple.xml” factor=1]

at jp.progression.commands.net::LoadURL/_ioError()
at flash.events::EventDispatcher/dispatchEventFunction()
at flash.events::EventDispatcher/dispatchEvent()
at flash.net::URLLoader/redirectEvent()

今回は、より詳細なログが表示されましたかと思います。

これは何をしたのかというと、Debuggerクラス(jp.progression.debug.Debugger)を有効にしています。

//Debuggerクラスをimportしておく
import jp.progression.debug.Debugger;
(略)
//Debuggerを使ってsList1を監視する
Debugger.addTarget(sList1);

Progressionをお使いの方なら、Index.asで以下の記述を見たことがあるかと思います。

//Index.as
// 開発者用に Progression の動作状況を出力します。
Debugger.addTarget( manager );

これを有効にすることで、シーン遷移などが出力パネルに表示されますよね?

今回はaddTargetの対象を、managerではなく、sList1に変更してあります。

すると、より詳細なログが取れるようになります。

Debuggerクラスの中を見ると分かるのですが、引数に渡せるものはProgression、Command、DataHolderなど多様です。

もっと便利な方法があるよ!

僕は(addCommand&insertCommadなどを使って)managerに紐付る&initObjectでidをつける&addTarget(●●●●)を組み合わせて使っていたんですが、@kappaLabさんにより便利な使い方を教えて頂きました。

import jp.progression.debug.Debugger;
(略)
override protected function atSceneLoad():void {
			//以下を追加
			Debugger.addTarget(this);
			addCommand(
						 new LoadURL(new URLRequest("sample.txt")),
						 new Trace("txtを読み込み"),
						 new LoadURL(new URLRequest("sample.xml")),
						 new Trace("xmlを読み込み")
			);
}

atSceneLoadとかで、Debugger.addTarget(this);を記述しておきます。

すると、対象シーン内のatSceneLoad、atSceneInit、atSceneGoto、atSceneUnloadのコマンド処理内で、より詳細なログが取れる様になります。

このコードを書いているシーン内だけログを取りたいのであれば、以下の記述を追記しておきます。

override protected function atSceneGoto():void {
			//以下を追加
			Debugger.removeTarget(this);
			addCommand(
			);
}

ページが遷移したら、Debuggerの対象を削除するということです。

これを書いておくと、遷移後のシーン(例えばhogeシーン)では、Debuggerクラスは無効になります。

ちまちまとaddTargetとかを書いていた、今までの自分が恥ずかしい…

@kappaLabさん、ありがとうございました!

以上、当日話した内容をザックリとですが…

CS4&CS5からのソースコードでの書き出し方法


Progressionは、FlashCS4&CS5からはswcファイルでの書き出しが可能になりました。

「これ、中でどういう処理が行われているんだろう?」と思った場合、ソースコードを見たい時が…

その方法をド忘れしていたので、メモがてらエントリ。

swcライブラリを使用するのチェックを外す

プロジェクトの作成時、ActionScriptタブの「swcライブラリを使用する」のチェックを外し、プロジェクトを作成します。

Progressionでソースコードでの書き出し方法

すると、swcではなくソースコードでプロジェクトが書き出されます。

MovieClipUtilを掘り下げてみる


MovieClipUtilはその名の通り、MovieClipを操作する為のクラスになります。

MovieClipUtil

labelToFrames

これを使うと、対象のMovieClipインスタンスの引数に指定したフレームラベルから、フレーム番号を取得します。

boxというMovieClipがあって、1フレーム目に、hogeというラベル名が。15フレーム名に、piyoというラベル名が割り当てられているとします。

trace(MovieClipUtil.labelToFrames(box,"hoge"));

これを実行すると、1がtraceされます。

frameToLabels

これを使うと、対象のMovieClipインスタンスの引数に指定したフレーム番号から、フレームラベルを取得します。

boxというMovieClipがあって、1フレーム目に、hogeというラベル名が。15フレーム名に、piyoというラベル名が割り当てられているとします。

trace(MovieClipUtil.frameToLabels(box,15));

これを実行すると、piyoがtraceされます。

getDistanceFrames

これを使うと、引数に指定した二点間のフレーム差を取得します。

trace(MovieClipUtil.getDistanceFrames(box,1,15));

これを実行すると、14がtraceされます。

playheadWithinFrames

これを使うと、引数に指定した指定された二点間に、再生ヘッドがあるかどうかを取得出来ます。

trace(MovieClipUtil.playheadWithinFrames(box,1,15));

再生ヘッドがある場合は、trueが。ない場合は、falseがtraceされます。

hasFrame

これを使うと、引数に指定したフレームが対象のMovieClipに存在するかしないかを取得出来ます。

trace(MovieClipUtil.hasFrame(box,20));

これを実行すると、フレームが存在する場合には、trueが。ない場合には、falseが返ってきます。

doLater

これを使うと、引数に指定した関数を、対象のMovieClipの1フレーム経過後に実行します。

MovieClipUtil.doLater(box,function hoge():void{trace("1フレーム経過したよ!");})

これを実行すると、1フレーム経過したよ!がtraceされます。

addEnterFrameListenerとremoveEnterFrameListenerは、まだ使いこなせていないので、ひとまず保留。

Versionもあるけど…

あとjp.nium.utilsクラスにはVersionというものもあるのですが、これはProgressionのバージョンを判定してあれこれするものなので、今回は割愛したいと思います。

StageUtilを掘り下げてみる


StageUtilは、Stageの操作を行うクラスになります。

StageUtil

getDocument

これを使うと、SWFの書き出しの際、ドキュメントクラスに設定してあるクラスを取得出来ます。

trace(StageUtil.getDocument(stage));

これを実行してみると、[object Index]とtraceされます。

getMarginLeft

これを使うと、ステージの左マージンの値を取得出来ます。

trace(StageUtil.getMarginLeft(stage));

これを実行すると、StageScaleModeの設定により、異なる値が返ってきます。

getMarginTop

これを使うと、ステージの上マージンの値を取得出来ます。

trace(StageUtil.getMarginTop(stage));

これを実行すると、StageScaleModeの設定により、異なる値が返ってきます。

今回は引数にstageインスタンスを設定しましたが、必要に応じてcontainer.stageやCastDocument.stageなどを使い分けるといいのではないかと思います。

TextFieldUtilを掘り下げてみる


TextFieldUtilは、TextFieldを操作する為のクラスになります。

TextFieldUtil

clipを設定しない場合

var tf:TextField = new TextField();
tf.autoSize = TextFieldAutoSize.LEFT;
tf.text = "東京てら子。東京てら子。東京てら子。";
(略)

これを実行すると、TextFieldAutoSize.LEFTが設定されているので、TextFieldには「東京てら子。東京てら子。東京てら子。」と表示されます。

clip

これを使うと、対象のTextFieldの表示領域に収まるようにテキストを切り抜き、切り抜いた箇所を「…」で表示してくれます。

var tf:TextField = new TextField();
tf.autoSize = TextFieldAutoSize.LEFT;
tf.text = "東京てら子。東京てら子。東京てら子。";
TextFieldUtil.clip(tf);
(略)

これを実行すると、TextFieldには「東京てら子。東…」と表示されます。

切り抜かれる文字の範囲を変更したい場合ですが、TextFieldの表示領域を変更してあげます。

var tf:TextField = new TextField();
tf.autoSize = TextFieldAutoSize.LEFT;
tf.text = "東京てら子。東京てら子。東京てら子。";
tf.width = 150;
TextFieldUtil.clip(tf);
(略)

これを実行すると、TextFieldには「東京てら子。東京てら子…」と表示されます。

ホーム > Progression

Search
Feeds
Meta

flashDevelopスポンサー

Return to page top