WOW-Engine + PV3Dによる3次元物理演算

3Dの物理演算コンテンツのデモを作ることがあったので覚書。
物理演算のライブラリは数あれど、何も分からなかったのでとりあえず3D対応を謳っていたWOW-Engineを選択。
調べていく中で分かりましたが、物理演算系ライブラリは基本内部計算のみ、表示部分は自前か他のライブラリを使用する必要があるため、 例えばよく知られたBox2Dのような2次元物理演算のライブラリを利用して、3Dでの物理表現を実装することも可能です。
比較なんぞしていないですが、表現によってはそちらの方が動作が軽かったりしそうですね。
ここでは導入方法と実装の考え方をざっくりと。
3Dエンジン部分はPapervision3Dを使用しました。

【導入方法】
まず公式サイトからファイルを入手します。
そのままパブリッシュしようとすると、DListNode云々と怒られるので、ここからpolygonalクラスというのを入手して配置する必要があります。データ構造を扱いやすくするライブラリだそうです。

【実装】
まず各クラスの処理を簡略化したものがこちら。WOW-Engine + PV3D による3D物理演算コンテンツ概略図

“WOW-Engine + PV3Dによる3次元物理演算” の続きを読む

Flash間での日本語クエリの受け渡し

Flashで生成した日本語文字列を、
ページ遷移後の別のFlashに受け渡したいという場面がありました。
なるべく簡易な方法ということで、
遷移するページURLにクエリとして日本語文字列をくっつけることに。
そのままブラウザでページ遷移すると文字列がURLエンコードされるので、
JavaScriptのdecodeURI()でデコードしてFlashに渡すということをしたのですが、
ブラウザによって動いたり動かなかったり。
動かないブラウザは2重にエスケープされているっぽい?

きっと何か方法があると思いつつ、Flash側で回避。
JSはクエリ部分を取得してFlashに渡すのみで、余計なことはしない。

送信Flashで送りたい日本語文字列をUTF-8エンコードescape()にかける。
クエリで受け取った文字列をFlash内部でunescape()すると元の日本語に戻ります。

//■送信Flashでエンコード
var str_ori:String = "トライナイン";
var str_esc:String = escape(str_ori);
trace(str_esc); //出力:%E3%83%88%E3%83%A9%E3%82%A4%E3%83%8A%E3%82%A4%E3%83%B3


//■受信Flashでデコード
trace(unescape(str_esc)); //出力:トライナイン

 
【6月28日追記】
外部から読み込んだXML等のテキストをエンコードするとうまくいかない場合が。
 System.useCodepage = false;
を明示的に前に書いてやると直るかもしれません。

TwitterAPI

Twitterと絡めた案件がありそうなので、TwitterAPIを使ったサンプルを作ってました。
簡単にいろいろデータが取れるんですね。
基本は、

http://twitter.com/xxxxxxx/xxxxxxx/(ID).xml

(ID)にはユーザー名が入り、XML形式の他『.json』とすれば、
JSON形式でデータが返ってきます。

http://twitter.com/statuses/friends/TNKHRYK.json

とすれば、自分がフォローしているアカウントの情報が取得できます。

urlLoader.addEventListener(Event.COMPLETE, jsonLoadComp);
urlLoader.load(new URLRequest("http://twitter.com/statuses/friends/TNKHRYK.json"));

private function jsonLoadComp(e:Event):void {

	var json:String = URLLoader(e.target).data;
	var content_json = JSON.decode(json);
	var total:int = content_json.length;
	for (var i:int = 0; i <total ; i++)
	{
		trace("フォローしている人のサムネイル画像URL" +
		content_json[i].profile_image_url);
	}
}

フォローしている人のサムネイル画像のURLをJSONデータから取り出しています。

http://twitter.com/statuses/friends/TNKHRYK.json?count=50

データの数を制限するには上記のようにクエリを指定します。

 

こちらの日本語訳仕様書を参考にさせていただきました。
Twitter API 仕様書

・・・と、サンプルを制作してアップしたところ、クロスドメインのことを完全に失念していました。
ローカルで動かす分にはFlash単体で支障ないですが、
webにアップすると別ドメインからのデータ参照に制約がかかります。
これを回避するためにデータを中継するPHPを置くなどの対策が必要となるのでした。
以下参考にさせていただきました。
FlashでTwitterの発言を取得してみる

Progression備忘録

先月Progressionをはじめて案件で導入しました。
全画面表示、Macでのマウスホイール、個別ページURLの設定等、Progressionの恩恵を様々授かったのですが、初めてということでいろいろ躓いたことや、反省点も。
それらを備忘録として晒しておきます。
使用したバージョンは3.1.82

■CastButton継承クラスを使わないシーン移動

途中までシーン移動するトリガーボタンはCastButtonを継承したクラスをひとつひとつ作っていました。
が、途中CastButtonを使わなくても”execute()“メソッドでProgressionのコマンドは実行出来ることを教えてもらいました。

//シーンhogeへ移動
new Goto(new SceneId("hoge")).execute();

またテンプレートとなるシーンやボタンクラスを作っておけば、こんな感じでそれらを一括で作成することができます。

for (var i:int = 0; i <= total; i++)
{
	/*SCENE_ARRAYには各シーンIDを格納*/
	var scene:CommonScene = new CommonScene( SCENE_ARRAY[i] );

	/*引数のオブジェクトに自由に値を付加できる
	  initObject.sIdで取り出し移動先を振り分けする*/
	var btn:CommonBtn = new CommonBtn( { sId:SCENE_ARRAY[i] } );
}
 

■シーン遷移時の処理は計画的に

Progressionの肝であるシーン遷移。
自分は各シーンにcontainerというコンテンツの入れ物(CastMovieClip継承)を作っていったのですが、
ただシーン移動をするだけでも前のシーンのcontainerの”_onCastRemoved“やシーンの”_onGoto“,”_onUnload“、次のシーンの”_onLoad“,”_onInit“、さらにこのシーンのcontainerの中などいろんなところに処理を書くことができます。
それぞれきちんと役割や実行される順番があるのですが、これがどうして適当に書いていってもなんとなく動いてしまいます。
結果、必要以上にいろんなところにコードが分散してしまいました。ボタンの処理も中と外にそれぞれロールオーバーの処理が書いてあったり。。。
『作りたいものは、楽しいところだけ作る』のProgressionですが、しっかりそこらへん挙動を把握したうえで最低限プロジェクトでのルール決めはしましょう、当たり前ですが。
下記サイトに書かれているとおり基本”onLoad“と”onUnload“という考え方が良さそうです。
http://www.muraken.biz/blog/2009/06/02/case-study-of-progression-vol2/

■Tweenerのトランジションに注意

細かい動きはフレームアニメーションでつくり、DoTweenerコマンドで実行。
しかし動きが何だか変だ。
これはProgressionというよりTweenerの話ですがtransitionプロパティの初期値は”linear“ではなく”easeOutExpo“となぜか尖った動きとなっています。
このままではせっかく調整したフレームアニメが台無しなので、しっかり”linear“指定してやります。

// 実行したいコマンドを登録します。
addCommand(
	// "end"フレームまで2秒かけてアニメーション
	new DoTweener(this , { _frame:"end" , time:2 , transition:"linear" } )
);
 

■Preloaderの注意

これもProgressionサイトに限った話ではないですが嵌ったこと。
全シーン共通で使用する静的パラメーターを一つのクラスにまとめて管理していたのですが、
そこへ加えた修正が何故か反映されない。
検証するとindex.swf単体で動作させたときは問題なく修正されていることを確認。
原因はpreloaderからもそのクラスを参照していたため、その時点で該当クラスがインスタンス化されていたことによるもの。
preloaderは修正していない状態でパブリッシュしたものをそのまま使用していたため、preloaderを通すと修正が反映されていなかったというわけ。
以降修正のたびにpreloaderも書き出しなおし&アップし直しということになってしまい、設計段階で切り分けはしっかりしましょうねという教訓になりました。

 

とまあいろいろボロボロでしたがその便利さは十分実感できました。
今回はネット上のドキュメントの豊富さからProgression3で制作しましたが、いろいろバグも修正されているようなので次回はProgression4で制作したいと思います。

KTweenを使ってみる

フラッシュをやる上で現状必須と言えるTweenライブラリ。
既に開発・サポートが終了したTweenerをいつまでも使っているはどうなのよと、
乗り換え先を探していたところKawa.netさんが軽量・高速に特化したTweenライブラリ、
KTweenを開発したということで飛びついてみた。
いくら最近のPCのスペックが良いとはいえ、軽いに越したことはなし。
仕事ではもっとサクサク動くようにならないのかと戻されることもままあり、
チューニングに四苦八苦するのですが、ライブラリの中味まで手が届かず
もどかしい思いをすることも。
最初から最速、すばらしい。

“KTweenを使ってみる” の続きを読む

wonderfl本発売記念イベント行ってきた&初wonderfl

26日銀座のアップルストアで開催されたwonderfl本発売記念イベントへ行ってきました。
内容はTwitter実況(http://twitter.com/#search?q=%23wonderfl)や、
実際のコード(http://wonderfl.net/tag/wonderfl本刊行記念イベント)を見ていただくのが一番ですね。
wonderflのウリをフルに活かしたライブコーディングがメインでした。
フォークビッツと呼ばれる現人神の中から3人の凄腕ワンダフラーが解説を加えつつ
コーディングを進めていったのですが、3人がともに3Dだったのが時代の流れか。
でもネイティブ3D or PV3D の違いや、それぞれ3Dをどう使うかという個性が際立って逆に面白かったです。
自分も3Dもっと勉強なきゃなぁと。
あとパーリンノイズ万能説。

そんなこんなで3Dではないですが、自分も初ワンダフルってみました。
なんかnengaflって年始のイベントフォーク大会で現在1位を独走している作品をフォーク。
ドラクエライクなRPGマップを自由にデザイン生成できる、なんとも素敵なものなのですが、
ちょいと弄らせていただいて倉庫番ゲームに。
RPGからパズルゲームへ簡単に作り変えることができるのも、フォーク元のエラい人とwonderflのおかげ。

今回の収穫はASでもXOR(排他的論理和)が使えるのだということ。
知りませんでした。

if( A ^ B )

A,Bは数値型、Booleanではダメなようです。

クリア判定とかはマップを2次元配列でまわすより、一次元の番号を格納して、
都度横サイズで除算したりした方が早いのかな?

  
という事でこれからも暇を見つけてwonderflで遊びたいと思います。