Archive for the ‘actionscript’ Category

[AS3] 簡単にカレント切り替えメニューが実装出来る SwitchMenuクラス

Category:{ actionscript }  Tag:{, } Comments:{ No Comments }
Posted:{ 2010.10.11 04:22:36 }

意外とこういうクラスを探しても無いので、自分用に作っていた、カレント切り替えメニューが簡単に実装出来る SwithMenuクラス [AS3]を公開します。

ポイント(というか設計思想というか)

スクリプトのみでメニュー群にマウスアクションの演出や、オーバーエリアの設定するのって、結構手間がかかったりして、意識して作らないと、すごく味気ないものになっちゃいますよね?
 このクラスは、出来るだけそういう負荷を減らすため、マウスアクションやオーバーエリアを、タイムライン上で設定する事を目的としています。(一応スクリプトでも出来ます)

動作サンプル

SwitchMenuクラスサンプル

(続きを読む…)

[as3]ImageLoadQueueクラスドキュメントとサンプルコードアップ

Category:{ actionscript }  Tag:{ } Comments:{ 1 Comment }
Posted:{ 2010.10.04 07:18:16 }

先日公開した、複数画像を非同期で順にロードするImageLoadQueue(イメージロードキュー)クラスのドキュメントとサンプルコードをアップしました。

ドキュメント

http://www.romatica.com/dev/imageloadqueue/asdoc/

サンプルコード

ダウンロード後のsample/ImageLoadQueueSample.asがサンプルコードファイルです

Spark Wiki

またSpark Wikiにも同じ内容をアップしてあります。
http://www.libspark.org/wiki/ImageLoadQueue

[AS3] 複数画像を非同期で順にロードしていくImageLoadQueue(イメージロードキュー)クラス

Category:{ actionscript }  Tag:{, } Comments:{ No Comments }
Posted:{ 2010.10.01 04:29:51 }

複数画像を非同期で順にロードしていくImageLoadQueueクラス(AS3)を公開します。

※追記 ドキュメントをアップしました。ImageLoadQueue ASDoc

こんな時に

大量画像ロード時、一気にロードすると高負荷になるので、非同期で1つづつLoadしたい時など。
例えば、
・背景に多くの画像がスライド、ループするような演出。
・画像の検索結果を表示し(ロード完了を待たずに)次々とページ送り出来るようなUI。
・さまざまな階層で同じ画像を何度も読み込むようなサイト。
など。

特徴

1.(シングルトンなので)どの階層からでも、キューに追加でき、読み込まれた画像はグローバルに保管されどこからでも取得できる
2.途中ロードエラーが起きてもスキップして順次ロードする(どのURLでエラーが起きたか取得可能)
3.ロード完了時、コンプリートリスナ関数に「画像のコピー」を返す(グローバルに保管された画像は変更されない)
4.ロード完了済URLをadd()した場合、保管された画像のコピーがコンプリートイベントで返される。
5.同じURLを複数add()した場合、登録された全てのリスナー関数が同時実行される。
(例えばhoge.jpgを3回add()すると、1番目がロード完了後、3つのコンプリートリスナー関数が同時実行される)
6.任意のタイミングでロードストップできる。

(続きを読む…)

[AS3][FDT] 意外と使えるAS3のFDTテンプレート10個

Category:{ actionscript, FDT, flash }  Tag:{, , , } Comments:{ No Comments }
Posted:{ 2010.08.06 09:32:03 }

よく使っている、AS3のFDTテンプレート10個です。

importや宣言って結局書かなきゃいけないから使うのメンドイよね?」と思ったあなた!
QuickFixで処理すればザクザクっと瞬殺で実装できまっすよ。(・∀・)

[1] 簡易スプライト作成

「あれっ?表示されるはずのMCが表示されない!?」なんて時に、その中にサクっと作って確認したり。

1
2
3
4
${name} = addChild(new Sprite()) as Sprite;
${name}.graphics.beginFill(0xcc0000);
${name}.graphics.drawRect(0,0,100,100);
${name}.graphics.endFill();

[2] 簡易テキストフィールド作成

何かとよく使います。

1
2
var ${_tf}:TextField = addChild(new TextField( )) as TextField;
${_tf}.text = "${cursor}";

[3] 簡易グラデーションボックス作成

背景にサクっと敷いたりする時に。

1
2
3
4
5
6
7
8
9
var gradType:String = GradientType.LINEAR;
var gradColors:Array = [ ${0xffffff} , ${0x0} ];
var gradAlphas:Array = [ 1, 1 ];
var gradRadios:Array = [ 0, 255 ];
var gradMrx:Matrix = new Matrix( );
gradMrx.createGradientBox( ${800},  ${600} , Math.PI/2, 0,0);
var gradSpread:String = SpreadMethod.PAD;
${this}.graphics.beginGradientFill( gradType , gradColors ,  gradAlphas , gradRadios , gradMrx ,gradSpread);
${this}.graphics.drawRect( 0 , 0, ${800}, ${600} );

[4] 配列を作る(要素番号指定で)

ループで作成できない配列作る時ってメンドいですよね。
下記だと、name とvalueの値が一気に指定できて便利。とりあえず10個

1
2
3
4
5
6
7
8
9
10
11
var ${name} : Array= new Array();
${name}[0]=${value};
${name}[1]=${value};
${name}[2]=${value};
${name}[3]=${value};
${name}[4]=${value};
${name}[5]=${value};
${name}[6]=${value};
${name}[7]=${value};
${name}[8]=${value};
${name}[9]=${value};

[5] 簡易ローダー作成

LoaderContext(true)にしているので、wonderflなんか用にサクっと使っています

1
2
3
${loader}= new Loader();
${loader}.contentLoaderInfo.addEventListener(Event.COMPLETE, loadCompleteHandler);
${loader}.load(new URLRequest("${cursor}"), new LoaderContext(true));

[6] ラジアン、角度、変換公式

覚えろって話ですが( ´д`; )、いつも忘れるので。

1
2
3
//radian<->angle
//var rad = angle *(Math.PI/180)
//var angle = rad * 180 / Math.PI;

[7] FlashVersを列挙する

デバッグ時などに何かと使えます。

1
2
3
4
var vars:Object = loaderInfo.parameters;
for (var i:String in vars) {
    _txt.appendText(i + "=" + vars[i] + "\n");
}

[8] プレイヤーのバージョンとタイプをトレース。

同じくデバッグ時などに何かと使えます。

1
2
3
4
trace( "************************************" );
trace( "[Player Version] " + Capabilities.version );
trace( "[Player Type]    " + Capabilities.playerType );
trace( "************************************" );

[9] Loggerテンプレート

@cellfusioinが作成したLoggerクラスを使用するためのテンプレート。
sosMaxと組み合わせると強力なログ出力環境が整います。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// @see http://github.com/cellfusion/Logger
Logger.initialize(Logger.LEVEL_FATAL);
//Logger.initialize(Logger.NONE);
 
Logger.trace(${cursor});
 
Logger.debug(${cursor});
 
Logger.info(${cursor});
 
Logger.warning(${cursor});
 
Logger.error(${cursor});
 
Logger.fatal(${cursor});

[10] コンパイルオプションで一部のコードを無視させる。

詳細はこちらの記事を御覧ください。
FDTでコンパイル時に一部のコードを無視させる

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
 //-define=CONFIG::Debug,true
//-define+=CONFIG::Release,false
/*FDT_IGNORE*/
CONFIG::Debug
{
/*FDT_IGNORE*/
		trace( 'Debug' );
/*FDT_IGNORE*/
}
CONFIG::Release
{
/*FDT_IGNORE*/
		trace( 'Release' );
/*FDT_IGNORE*/
}
/*FDT_IGNORE*/

上記10個セットをダウンロード

動作確認環境 [FDT4 M3 / MacOS10.5]

[memo][Progression4]ディープリンクに存在しないシーン名を指定した時のエラー処理

Category:{ actionscript, Progression }  Tag:{, } Comments:{ No Comments }
Posted:{ 2010.05.18 12:55:24 }

Progression小ネタメモ。

ディープリンクが動作する状態で、URLシャープ以下に、存在しないシーン名を指定された時、
そのままだと動作が止まってしまう。
※ex) ” http://www.○○○.com/#/存在しないシーン名 “など

その場合、ProcessEventクラスのPROCESS_ERRORで判断できるので、対策をとる。
ex)
「強制的にindexシーンに移動させる」
「Not Foundシーンを用意しそこに移動させる」
など

1
2
3
4
5
6
7
8
9
10
11
12
//
//IndexScene.as
//
protected override function atSceneLoad() : void {
	manager.addEventListener(ProcessEvent.PROCESS_ERROR, processError );
}
 
private function processError(event : ProcessEvent) : void {			
	//trace("ERROR");
	// 最初のシーンに移動します。
	manager.goto(new SceneId( "/index" ));
}

ProssesEventクラス

SceneManager オブジェクトが処理を実行、完了、中断、等を行った場合に ProcessEvent オブジェクトが送出されます。 通常は、Progression オブジェクトを経由してイベントを受け取ります。

FDTでANTを使って色々な処理を自動化!

Category:{ actionscript, FDT, flash }  Tag:{, } Comments:{ 4 Comments }
Posted:{ 2010.04.25 06:53:09 }

FDT_ATN_Image

FDTが徐々に手慣れてきて、Flashでコーディングしていた頃に比べ、
開発時間が2〜3割減。
といったところのitozです。

まだまだ使いこなせていないので「こんな機能あったんだ!」とステキ機能に出逢う事がありますが、
今日はそのうちの一つANTについて

(続きを読む…)

wonderflでFLARToolkitサンプル

Category:{ actionscript, FLARToolkit, flash, Wonderfl }  Tag:{, , , , , } Comments:{ No Comments }
Posted:{ 2010.04.08 02:19:30 }

WondreflでFLARToolkit(1.0系)が動くようになったので、
3Dモデルがマーカー位置にイージング移動するサンプルを作ってみた。

マーカーはこちらにアップしました。
プリントして、ウェブカメラにかざしてくださいな。

ただイージングさせたいなら、わざわざ
@rokubouさんのコードをFORKしなくてもよかったけど、
まぁいいか。

@tarotarorg さんが早くも
マルチマーカーサンプルも上げてますね。(シゴトガハヤイ!)
http://blog.tarotaro.org/archives/718

FDTテンプレート作りました。

Category:{ actionscript, FDT, flash }  Tag:{, , } Comments:{ 2 Comments }
Posted:{ 2010.04.04 03:18:38 }

(追記※FDT4 M2でも読み込めるよう修正しました。詳細)

–index—————————————-
【1】Papervision3Dテンプレート
   (1)BasicVeiw クラスを使用したシンプルなテンプレート
   (2)DAEモデルをさくっと表示確認するテンプレート
【2】「Public/Private/Protected」の「 ver」と「function 」
——————————————

【1】Papervision3Dテンプレート

下記(1)(2)をセットにしたものです。

(1)Papervision3DのBasicVeiw クラスを使用したシンプルなテンプレート。

さくっと3Dオブジェクトを表示したい時に。
BasicVeiwを使うことで、cameraとかviewportなどの基本定義を宣言せずに、シンプルに記述できるテンプレート。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
//pv3d_BasicView
/**
 * ${enclosing_type}
 * BasicViewクラスを使用したシンプルなテンプレート。
 */
package ${enclosing_package} {
	/**
	 * @see http://papervision3d.googlecode.com/svn/trunk/as3/trunk/src/
	 */
	import org.papervision3d.materials.*;
	import org.papervision3d.objects.primitives.*;
	import org.papervision3d.view.BasicView;
	import flash.events.Event;
 
	/**
	 * @author ${user}
	 */
	public class ${enclosing_type} extends BasicView {
 
		private var model : *;
 
		public function ${enclosing_type}() {
			setModel();//DisplayObject3D作成
			super.startRendering();//レンダリングスタート
		}
 
		private function setModel() : void {
			//ここでDisplayObject3Dを作成
			//ex)
			//model = new Plane(new WireframeMaterial(0xcc0000))
			scene.addChild(model);//シーンに追加
		}
 
		//レンダリング
		override protected function onRenderTick(event : Event=null) : void {
			super.onRenderTick();
			//DisplayObject3Dに対して行う操作
			//ex)
			//model.yaw(1);//回転
		}
	}
}

(2)DAEモデルをさくっと表示確認する。

DAEデータを確認するのに、いちいちPV3Dの基本構造を組んでいたんだけど、メンド臭いので作りましたよっ。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
//pv3d_checkDAE
/**
 * ${enclosing_type}.
 * DAEモデルをさくっと表示確認するPapervision3Dテンプレート
 * マウスドラッグで横回転。
 */
package ${enclosing_package}{
 
	/**
	 * @see http://papervision3d.googlecode.com/svn/trunk/as3/trunk/src/
	 */
	import org.papervision3d.view.BasicView;
	import org.papervision3d.objects.parsers.DAE;
 
	import flash.events.Event;
	import flash.events.MouseEvent;
 
	/**
	 * @author ${user}
	 */
	public class ${enclosing_type} extends BasicView {
 
		//*********************************************************************
		private var _daeURL : String= "../model/sample.DAE";//DAEモデルのパスを指定
		//適宜調整
		private var _cameraZ : Number= -100;//カメラZ位置
		private var _cameraY : Number= 0;//カメラY位置
		private var _modelScale : Number= 1;//モデルのスケール
		//*********************************************************************
 
		private var mouseDownX : Number;
		private var mouseDownY : Number;
		private var isDragging : Boolean= false;
		private var model : DAE= new DAE( );
 
		public function ${enclosing_type}() {
			camera.z = -_cameraZ;
			camera.y = _cameraY;
			stage.addEventListener( MouseEvent.MOUSE_DOWN, onMouseDownHandler );
			stage.addEventListener( MouseEvent.MOUSE_MOVE, onMouseMoveHandler );
			stage.addEventListener( MouseEvent.MOUSE_UP, onMouseUpHandler );
			setDO3D( );
			super.startRendering();//レンダリングスタート
		}
 
		/**
		 * DAEモデルロード
		 */
		private function setDO3D() : void {
			model.load( _daeURL );
			model.scale = _modelScale;
			scene.addChild( model );
		}
 
		/**
		 * レンダリング
		 */
		override protected function onRenderTick(event : Event=null) : void {
			super.onRenderTick();
			if (!isDragging) {
				model.rotationY -= 1;//回転の速さ
			}
			camera.y = (mouseY / stage.stageHeight) * 100;
		}
		/**
		*マウスイベント
		*/
		private function onMouseMoveHandler(e : MouseEvent) : void {
			var xx : Number= (mouseX - mouseDownX);
			if (isDragging) {
				model.rotationY -= xx;
				mouseDownX = mouseX;
				mouseDownY = mouseY;
			}
		}
 
		private function onMouseDownHandler(e : MouseEvent) : void {
			isDragging = true;
			mouseDownX = mouseX;
			mouseDownY = mouseY;
		}
 
		private function onMouseUpHandler(e : MouseEvent) : void {
			isDragging = false;
		}
 
	}
}

【2】「Private/Public/Protected」の「 ver」と「function 」

こちらのサイトでも「Public/Private/Protected Functions」が公開されていたのですが、「puf ptf prf」というショートカットが個人的に使いにくかったので、普通に「public…」などと打つと候補が出てくるようにしました。

↓こんな感じ。

//private
private var ${cursor}${name};
 
private function ${cursor}${name}(${}):${void}{
 
}
 
//public
public var ${cursor}${name};
 
public function ${cursor}${name}(${}):${void}{
 
}
 
//protected
protected var ${cursor}${name};
 
protected function ${cursor}${name}(${}):${void}{
 
}

FDT.jpのテンプレートページにもアップしました。

FDTでFlashHelpを高速に表示するCapabilities設定

Category:{ actionscript, FDT, flash }  Tag:{, , } Comments:{ No Comments }
Posted:{ 2010.03.15 05:38:52 }

[環境:FDT3/MacOS10.5]

前のエントリでFDTでFlashHelpを使用出来るよう設定しましたが、その後、
「FDT>環境設定>Capabilities」の「Disable All」を押して、チェックボックスをすべて外すと、ヘルプの検索が高速になります。

(理由は分かりません&Capabilities自体が何の設定かわかりませんが、何かを検索する機能をOFFにしているっぽい。( ´д`; )ダレカシッテタラオセーテ)

特にガシガシヘルプ使うときは外していてもいいかもしれませんね。


レンタルサーバー豆知識