[ CATEGORY ] FLASH…

http://www.dango-itimi.com/blog/archives/flash/

FLASH tips Google Maps API for Flash : マップ上に Polyline で円を描くクラス

javascript 版の Google Maps API (Version3)では円を描く処理はサポートされているようですが、Flash バージョンの Google Maps API では円描画はサポートされていない模様(javascript 版 Version2 相当?)なので、ネット上の記事を参考に円を描く処理をクラス化しました。

【 参考サイト 】

http://www.nanchatte.com/map/circle.html

【 ダウンロード 】

ファイル一式ダウンロード
http://www.dango-itimi.com/blog/swf/101/com.zip

上記ファイル内には以下の二つのファイルを配置しています。

・楕円頂点座標群取得用クラス
com.dango_itimi.geom.core.Polygons

・Google Maps 上に円描画用クラス
com.dango_itimi.googlemap.Circle


【 利用方法 】

事前に map インスタンス(com.google.maps.Map)を生成し、利用準備可能状態にしておく必要があります。
東京の緯度(35.689506)と経度(139.691701)に 頂点数 360 半径 300メートルの円を描画したい場合以下となります。

var lat:Number = 35.689506;
var lng:Number = 139.691701;
var circleData:Circle = Circle.create(new LatLng(lat, lng), 360, 300);
Circle.draw(map, circleData);


以下クラスのソースコードをそのまま記述。

▽続きを読む

[ FLASH ] [ tips ] 2010年08月13日 16:47 | コメント (0) | トラックバック

FLASH tips 原点座標(0, 0)にシンボルを再配置する jsfl

シンボルを原点座標(0, 0)に配置するだけの jsfl を作成しました。
前回記事の続きの記事ともなります。

【 ダウンロード 】
http://www.dango-itimi.com/blog/swf/100/OriginalPositioner.zip

【 jsfl ファイル解説 】

■ OriginalPositioner.jsfl

メインクラスファイル
このファイルを実行しても何も起こらず

■ OriginalPositionerOfSelectedLayer.jsfl

現在編集中のステージ内で
選択している1つのレイヤーの
全てのフレームに配置している
一つ目の要素(シンボルやシェイプ)の配置位置を
原点(0, 0)に設定する jsfl ファイル

ステージ上に複数シンボル等が配置されている場合、どれが「一つめの要素」と判定されるかわかりません。上記スクリプトは、一つのフレーム内にシンボル等が1つだけ配置している場合を用途としています。

【 使用手順例 】

前回記事からの続きとなります。

(1)

ムービークリップ walk_bottom.psd 内の、フレーム 1~6 に配置されている各ムービークリップ 1~6 を処理の都合上原点座標に配置したい場合があります。

(2)

OriginalPositionerOfSelectedLayer.jsfl を実行することで、各ムービークリップ 1~6 が原点座標に自動で配置されます。

[ FLASH ] [ tips ] 2010年07月15日 19:49 | コメント (0) | トラックバック

FLASH tips シンボル配置位置の小数点以下を四捨五入して再配置する jsfl

シンボル配置位置の小数点以下を四捨五入して再配置する jsfl を作成しました。

【 ダウンロード 】
http://www.dango-itimi.com/blog/swf/100/IntegralValuePositioner.zip

【 jsfl ファイル解説 】

■ IntegralValuePositioner.jsfl

メインクラスファイル
このファイルを実行しても何も起こらず

■ IntegralValuePositionerOfStage.jsfl

現在編集中のステージ内全てのレイヤーの
再生ヘッダ一にあるフレーム(currentFrame)に配置している
全ての要素(シンボルやシェイプ)の配置位置に対し
小数点以下を四捨五入して再配置する jsfl ファイル

■ IntegralValuePositionerOfSelectedItems.jsfl

ライブラリで選択したアイテム(シンボル)内全てのレイヤーの
1フレーム目に配置している
全ての要素(シンボルやシェイプ)の配置位置に対し
小数点以下を四捨五入して再配置する jsfl ファイル

■ IntegralValuePositionerOfSelectedLayer.jsfl

現在編集中のステージ内で
選択している1つのレイヤーの
全てのフレームに配置している
全ての要素(シンボルやシェイプ)の配置位置に対し
小数点以下を四捨五入して再配置する jsfl ファイル


【 作成経緯と使用手順例 】

Photoshop での大量のキャラクターアニメーション制作後、Flash の psd インポート機能にて以下の状況が大量に発生しそうなため、今回の jsfl の制作を行ないました。

(1)

ゲーム制作において都合のよい、足元を中心とした基準点で各レイヤー毎にムービークリップを作成する設定で psd を読み込みます。

(2)

psd が読み込まれた後のライブラリの様子です。ムービークリップ 1~6 内には同数値のビットマップデータ 1~6 が配置されています。
ここで例えばムービークリップ1 の内容を見てみると…

(3)

ビットマップデータの横幅が 21 ピクセルため、配置 X座標が -10.5 という 0.5 ピクセルの少数値が付与されてしまっています。こいつはいただけねえぜ…!

(4)

ライブラリのムービークリップ 1~6 を選択し IntegralValuePositionerOfSelectedItems.jsfl を実行すれば、小数点以下は四捨五入されて再配置されます。

次にライブラリ内 walk_bottom.psd ムービークリップを見てみます。

(5)

Photoshop で作成したそのままの配置位置に、各ムービークリップ 1~6 が フレーム 1~6 に割り当てられているのがわかります。ここでよく見ると、配置されているムービークリップ の X座標 が 24.5 という、またしても小数点以下の数値が見えます。

(6)

walk_bottom.psd レイヤーを選択し IntegralValuePositionerOfSelectedLayer.jsfl を実行すれば、選択したレイヤー内全てのフレームのムービークリップの小数点以下は四捨五入されて再配置されます。

次の記事「原点座標(0, 0)にシンボルを再配置する jsfl」へ続きます。

追記 2010年7月19日)
jsfl ソースファイル内に誤りがあったため修正したものを再アップロードしました。

[ FLASH ] [ tips ] 2010年07月15日 17:11 | コメント (0) | トラックバック

FLASH tips 選択された一つのレイヤー内全てのキーフレームに指定数フレームを挿入or削除するjsfl

すでにどこかにありそうですが、勉強も兼ね、選択された一つのレイヤー内全てのキーフレームに指定数フレームを挿入or削除する jsfl を作成しました。


■ 実行イメージ図

 ↓ 1フレーム挿入

 ↓ 1フレーム挿入 

 ↓ 1フレーム削除


■ ダウンロード

[ jsfl ファイル一式をダウンロード ]


■ jsfl ファイル解説


FrameTotalChangerToKeyFrames.jsfl
コアとなるクラスファイル
このファイルを実行しても何も起こらず

FrameInserterToKeyFrames.jsfl
1フレーム 挿入

FrameRemoverToKeyFrames.jsfl
1フレーム 削除

FrameTotalChangerToKeyFramesGUI.jsfl
プロンプトにて挿入 or 削除数を指定

[ FLASH ] [ tips ] 2010年07月12日 17:52 | コメント (0) | トラックバック

FLASH tips Flash CS4 → Flash CS5 にて _ゴシック のテキストフィールドに設定した文字列が埋込みフォント(静止テキスト)扱いになってしまう

一つ前の記事の Flash CS4 から CS5 で swf 容量が大きくなってしまう現象にて、原因の調査を行いました。

結論は記事タイトルの通りでした。以下の手順で確認を行なえます。

(0)Flash CS4 で以下の(1)~(5)までの作業を行う
(1)「ダイナミックテキスト」に設定したテキストフィールドをステージ上に配置
(2)フォントファミリーを「_ゴシック」に設定
(3)テキストフィールドに適当な文字列を記述
(4)パブリッシュ設定内「サイズレポートの作成」にチェックを入れる
(5)サイズレポート _gothic 箇所に何も文字列が埋め込まれていないことを確認し fla ファイル(test.fla とする)を保存

(6)Flash CS5 にて test.fla を開きパブリッシュ
(7)サイズレポート _gothic 箇所に(3)で設定した文字列が埋込み設定されてしまっている事を確認


上記(2)で _sans を設定した場合 CS5 では文字列は埋め込まれない事を確認。また、CS4 ではなく CS5 で _ゴシック のテキストフィールドを作成し、テキストフィールド内に文字列を設定した場合、文字列は埋め込まれない事も確認。

CS5 にて新規で何かを制作する場合は問題は起きませんが、今まで CS4 で制作していたものを CS5 に移行しようとした場合の問題点となりそうです。

[ FLASH ] [ tips ] 2010年06月16日 19:14 | コメント (1) | トラックバック

FLASH tips Flash CS4 で作成していた Flash Lite を Flash CS5 で書き出すと swf 容量が増加

Flash CS4 の Flash Lite にて swf 容量が 100 KB ギリギリになるように制作していた fla ファイルを そのまま Flash CS5 でパブリッシュしてみると、swf 容量が 115 KB となってしまいました。

Flash CS4 までは Player バージョンを Flash Lite に設定しておけば、パブリッシュ時 自動的に Device Central が立ち上がりましたが、CS5 では通常のムービープレビューが行われるのみ。パブリッシュ時 Device Central を立ち上げるような設定項目は見つからず。Device Central が立ち上がらないから Flash Lite 用に swf がパブリッシュされず容量がふくれあがってしまっている、とかそういったことがあるのですかなあ?

他、気になる点といえば、ライブラリにフォントシンボルが自動的に作成されているという点。Flash CS5 からはフォントの埋め込みは一括で設定できるようになった、とのことですが、このフォントシンボルが何か容量増加に影響を及ぼしているのかどうか。

Flash CS5 に関する情報がまだ少ない状況なので原因がわかるまでひとまず Flash Lite の開発は Flash CS4 で行う事に。

追記)
メニューの[制御]-[ムービープレビュー]から Device Central でムービープレビューを行える項目を発見しました。容量の問題に関しては未解決。

追記2)
CS5 で容量が大きくなってしまった原因がなんとなく判明。
CS4 と CS5 とでパブリッシュ時のサイズレポートを作成し比較してみたところ、CS5 ではフォントの _gothic(_ゴシック) に設定した文字列が swf 内に埋め込まれてしまっているようです。その他フォントに関しても CS4 に比べ CS5 では埋め込まれている文字数が増えています。CS5 では新たに何かフォント設定を変更しなくてはならない模様。

追記3)
問題の原因が判明しました。 → 次の記事へ

[ FLASH ] [ tips ] 2010年06月16日 17:39 | コメント (0) | トラックバック

FLASH tips Flash ライブラリウインドウ内のサウンド一式再生確認でいい方法はないものか

サンプルライブラリのサウンドで何か利用出来そうなものはないかと、一つ一つ曲を再生確認してみたのですが、あまりのマウス移動の多さに腕がつりそうになりました。

CS4 よりも前のどのバージョンかの Flash では、ライブラリウインドウ内のサウンドシンボルを選択した状態で Enterキーを押すとサウンドが再生・停止されたり、再生後 または再生中に上下キーを押すことで次のサウンドシンボルにフォーカスを当てることができたはずですが、この操作仕様は破棄されてしまったのですかね。ライブラリシンボル操作用のショートカットキーが割り振られていないのかと探してみたもののみつからず。

[ FLASH ] [ tips ] 2010年06月08日 18:07 | コメント (0) | トラックバック

FLASH info Flash CS5 は XFL に期待

来月末に発売されるという Flash CS5。どのような新機能があるのかネットを徘徊してみたところ、「XFL」という新フォーマット形式による fla ファイルの保存というものがあると知りました。

 xingxx : 動画でみる Flash CS5 の 押さえておきたい新機能
 http://log.xingxx.com/2010/04/flash-cs5.html

XFL が Flash CS5 の一番の売りになりそうなものですが、それほどプッシュされてる感はないので、過度な期待はしないほうがよいのかどうなのか。

fla ファイルライブラリ内の構造や、各シンボル内のレイヤーやタイムライン内の情報が全て xml ファイルに記述され、その xml ファイルの記述や XFL 内画像データを変更することで fla ファイルを編集せずとも Flash オーサリングが行えるというもの、のようですが実際に触ってみないとどこまで出来るかはわからず。

Flash オーサリング自動化処理は jsfl で可能でしたが、今後はどのようなツールを用いても可能ということになりそうなので、Flash オーサリング自動化処理ツールを Flash(AIR) で作成、といったこともできるのでしょうか。


想定している XFL の機能で行いたいことといえば、タイムラインアニメーションムービークリップの自動スクリプト処理変換です。

指定のフォーマットでタイムラインアニメーションを作成し、XFL 形式で保存。XFL 内 xml から 各フレームに配置された各シンボルの配置座標等読み取り、クラスファイルにそれら情報を出力。また、スクリプトで操作しやすいようなムービークリップを自動生成。

ゲームのキャラクターの動作イメージをタイムラインアニメーション(ムービークリップ)で作成し、XFL を利用して変換処理を自動化すれば、キャラクター動作用スクリプトの調整は一切手をつけずにムービークリップの編集内容そのままをゲーム内画面の動作に反映させる、なんて事が可能となります。


ありそうな難点といえば、xml 構造を破壊して fla ファイルを開く事ができなくなってしまうということ。要バックアップとなりそうです。

[ FLASH ] [ info ] 2010年04月15日 11:08 | コメント (0) | トラックバック

FLASH update ドット絵ベルトスクロールアクション3D 2

もろもろ適当なベストスクロール処理実装。マウス方向にキャラクターが移動します。キャラクターはまだ奥の壁を突き抜けます。また、衝突判定確認用に立方体の表示を行っています。

 http://www.dango-itimi.com/blog/swf/98/

【 3Dカメラ操作方法 】

 ・マウス
 [マウスドラッグ] --- Y軸を軸にした回転
 [マウスドラッグ + Shift] --- 拡大縮小
 [マウスドラッグ + Ctrl] --- 焦点位置変更

軸回転は微量行われるようにしています。ゲーム中演出としてY軸の微量回転もありかな、といったところです。

[ FLASH ] [ update ] 2010年04月11日 17:32 | コメント (2) | トラックバック

FLASH info update OH! DANGO JAM が起動しなくなってしまった場合の対処

OH! DANGO JAM が起動しなくなってしまった、という報告を時たま受けていました。ネットワーク上に登録された おかしなデータの敵と戦うと、自分のデータもおかしいことになってしまい、起動しなくなってしまうというものです。

なので、データを一度リセットするためのツールを用意しました。
http://www.dango-itimi.com/jam/jamClear.html

大変申し訳ありませんが、上記ツールを用いてデータをリセットし、それでも宜しければ再び 1 から遊んでやってください。

敵の名前が「CPU」とつくものは戦っても安全な敵となっています。NaN と表示される敵と戦うと データが壊れてしまうという報告を受けていますのでご注意ください。

[ FLASH ] [ info ] [ update ] 2010年02月18日 02:14 | コメント (1) | トラックバック

FLASH update ドット絵ベルトスクロールアクション3D

今まで作成してきたドット絵キャラクターが3D表現上にどのように映るか一度確認したかったため、適当な背景画像を作成し、簡単なサンプルを作成しました。

 http://www.dango-itimi.com/blog/swf/97/

※要 最新の Flash Player 10
 豆粒のように小さく表示される場合は Flash Player 10 が最新のものではありません

【 3Dカメラ操作方法 】

 ・キーボード
 [W] --- 上移動
 [S] --- 下移動
 [A] --- 左移動
 [D] --- 右移動

 ・マウス
 [マウスドラッグ] --- Y軸を軸にした回転
 [マウスドラッグ + Shift] --- 拡大縮小
 [マウスドラッグ + Ctrl] --- 焦点位置変更

軸回転は微量行われるようにしています。

用意した背景画像はこちら

今度は 3D上の表示を確認しつつ描き込んで行く予定。

[ FLASH ] [ update ] 2010年02月17日 01:46 | コメント (3) | トラックバック

FLASH tips Flash CS4 上でリンケージクラス設定を行うと jsfl からリンケージクラス設定変更は不可となる

Flash CS4 上から一度でも設定されたリンケージクラス名は、Flash CS4 上にて「ActionScript用に書き出し」のチェックボックスを外す等をして リンケージ設定を完全に解除しない限り、jsfl からはリンケージクラス名設定は変更不可能な状態となってしまうようです。

「Flash CS4 上からリンケージ設定が完全に解除された状態」とは、「対象となるアイテムのライブラリウインドウ内の『リンケージ』の項に何も表示されていないない状態」とします。(図2)

Flash CS4 上でリンケージ設定を行ったアイテムに対し jsfl でリンケージ設定の解除命令(Item.linkageExportForAS = false)を実行しても、ライブラリウインドウ内の『リンケージ』の項には、設定されていたクラス名のみが表示される状態となり(「書き出し:」という文字列は消える)、完全解除とは言わない状態となります。(図3)

Flash CS4 からのリンケージ設定が完全に解除されていない状態では、jsfl からリンケージクラス名を設定しようとしても、その設定は fla ファイルへは反映されません。

jsfl にて Flash CS4 で行われたリンケージ設定を完全に解除する方法を調査してみましたが、現在のところわからない状況です。対象となるアイテムを複製し元アイテムは削除…といった方法で解決できるかもしれませんが、削除するという操作を入れるのは危険なので、調査対象からは外しています。


検証は以下の環境で行いました。

 Flash CS4 10.0.2
 Windows Vista Home 64bit

OS や Flash のバージョンによっては上記現象の動作が異なる可能性があります。


開発途中では、どんどんクラス名やクラスのディレクトリ構造の変更をかけるので、普段は jsfl でリンケージ設定を行っているのに、まれに Flash CS4 上のシンボルプロパティから設定してしまったりすると、後にそれが原因でつまずいてしまうことが結構あります。


参考: Flash の拡張機能 Item オブジェクト
http://help.adobe.com/ja_JP/Flash/10.0_ExtendingFlash/WS5b3ccc516d4fbf351e63e3d118a9024f3f-7f92.html


参考図

図1) リンケージ設定が行われている状態

図2) リンケージ設定の解除が完全にが行われている状態

図3) リンケージ設定の解除が完全にが行われていない状態

図4) 図3の状態でシンボルプロパティを開いた状態
   この状態から「OK」ボタンを押すと図2の状態に移行する

[ FLASH ] [ tips ] 2010年02月13日 21:20 | コメント (0) | トラックバック

FLASH tips update PNGEncoder フレーム分割処理版

Flex SDK の mx.graphics.codec.PNGEncoder クラスを改造し、負荷が高くなる箇所を分割して処理を行う PNGEncoder クラスを作成しました。

すでに分割処理を行う PNGEncoder を作成されている方はいますが、私が改造したものは 指定した数値分処理を行ったら中途でループを抜けるものとなっています。イベント発行などは行わず、処理が終了したら 取得対象となる ByteArray インスタンスを返却します。

サンプルファイル一式

http://www.dango-itimi.com/blog/swf/90/sample.zip

使い方

サンプルファイルの一部を抜粋/見やすく修正

private var main:Function;
private var pngEncoder:PNGEncoder;

...

public function Sample() {

	...
	
	pngEncoder = new PNGEncoder(
		new TypeBitmapData32(bitmapData), //32bit PNG エンコード指定
		bitmapData.width, bitmapData.height,
		5000 //1フレーム内に実行するループ数を任意に設定	
	);
	main = encode;	
	addEventListener(Event.ENTER_FRAME, run);
}
private function run(event:Event):void{
	
	main();
}
private function encode():void{
	
	var pngBytes:ByteArray = pngEncoder.run();
	trace(pngEncoder.getProgress());
	if(pngBytes) main = stop;	
}
private function stop():void {}

PngEncoder.run メソッドを実行し、戻り値が null の場合はまだ処理が完了していません。ByteArray インスタンスが返却されると処理が完了したことを示します。PngEncoder.run メソッドを実行後 PngEncoder.getProgress メソッドを呼び出すことで現在の進行状況(0~100%)が確認できます。

mx.graphics.codec.PNGEncoder では、処理行数が多くなる for 文内で if 文があり、これはなくしたほうがよいのではと考え、コンストラクタの引数には あらかじめ一定の処理を行うためのインスタンスを渡すようにしました。しかし逆にこれでは処理が遅くなってしまうという場合はごめんなさい。

サンプルでは 32bit PNG エンコードを行いますが、アルファチャンネルなしの PNG エンコードを行いたい場合は、TypeBitmapData24 クラスのインスタンスを引数に指定します。

	pngEncoder = new PNGEncoder(
		new TypeBitmapData24(bitmapData),
		bitmapData.width, bitmapData.height,
		5000
	);

コンストラクタの第四引数に何も数値を指定しない(デフォルト数値 0を指定した)場合は、分割処理は行われません。PNGEncoder.run メソッド一度の実行で ByteArray インスタンスを取得できます。

その他改造点としまして、Array を Vector に変更しています。Flash Player 9 対応にする場合は Vector 記述箇所を Array に戻す必要があります。

mx.graphics.codec.PNGEncoder 内にある Adobe の著作権表示箇所やその他コメントは、そのまま残しておいたほうがよいのか、記述を何か変えるべきなのか、削除したほうがいいのか、どのように扱えばいいか判断がつかなかったため、改造後のソースには何も書いていません。何か問題がありましたらご指摘願います。

■ Flex SDK mx.graphics.codec.PNGEncoder
http://opensource.adobe.com/svn/opensource/flex/sdk/trunk/frameworks/projects/framework/src/mx/graphics/codec/PNGEncoder.as

[ FLASH ] [ tips ] [ update ] 2009年12月10日 19:07 | コメント (0) | トラックバック

FLASH update web service GridCutter

習作として GridCutter という画像加工出力を行う Web ツールを製作しました。
各ピクセルデータを拡大して等間隔に配置し 32bit の PNG で出力を行います。

logo2.png

以下簡単な操作手順です。

・FILE から加工元となる画像ファイルを PC 上から選択
・各ピクセルデータを 四角か丸か どちらの模様で表示するかを TYPE から選択
・zoom (倍率)、margin(間隔ピクセル数) に数値を入力
・出力される 画像サイズ W(横幅)と H(縦幅)を確認
・VIEW ボタンを押して画像トレース開始
 → 進行状況はツールバー最下部に表示
・画面に表示されたトレース画像で問題なければ SAVE ボタンで PC 上に保存


help.png


すべての処理はローカルPC上で行われます。「四角」あるいは「丸」の模様を配置するだけなので、画像加工処理自体は非常に簡単なものですが、何か機会がありましたらお気軽にご利用ください。

Opera で発生する問題

現在の Opera のバージョンは 10.10

zoom あるいは margin のテキストフィールドそばにマウスカーソルがあると、各テキストフィールドに自動的にカーソルがあたり、ハイライトするようにしています。これにより、テキストフィールドをクリックすることなくキーボードから数値入力が可能となります。
しかし、以下の条件が合わさると、テキストフィールドの数値はハイライトされているのにキーボードから数値入力ができなくなる、という場合があります。

・ブラウザに Opera を用いている
・FILE または SAVE ボタン押下からファイル選択ダイアログ表示を行い
 ファイル選択あるいはキャンセルからダイアログを閉じた直後の状態

上記条件の場合、ユーザは swf 画面を一度クリックしないと 数値入力ができません。
Opera のみフォーカスの動作が少々異なるのかもしれません。

[ FLASH ] [ update ] [ web service ] 2009年12月06日 13:57 | コメント (0) | トラックバック

FLASH tips ビットマップ 表示サイズ限界値

Flash Player 10 で扱えるビットマップの表示サイズの限界はいくつなんだと以前から気になっていましたが、Flash のヘルプに書いてあったのでメモ。

---
AIR 1.5 および Flash Player 10 では、ビットマップイメージの最大サイズは幅または高さが 8,192 ピクセルで、ピクセルの総数が 16,777,216 を超えないようにする必要があります(したがって、ビットマップイメージの幅が 8,192 ピクセルの場合、高さは 2,048 ピクセル以下にする必要があります)。Flash Player 9 以前では、高さの制限は 2,880 ピクセル、幅の制限は 2,880 ピクセルです。
---

[ FLASH ] [ tips ] 2009年12月04日 02:48 | コメント (0) | トラックバック

FLASH tips update BoxScroller

AS3 ライブラリ整理を一旦終了。ライブラリ内の一機能を用いたサンプルの紹介です。

まず、核となるスクロールバー機能があり、そのスクロールバー機能を用いて四角形の領域に縦方向と横方向にスクロールバー表示を行う BoxScroller というものを作成しました。

BoxScroller を用いることにより、ブラウザのデフォルト機能であるスクロールバー表示のような表現を行うことが可能となります。以下のサンプルを閲覧ください。表示には Flash Player 10 が必要です。

 → サンプル1(表示領域の外側にスクロールバーを表示する例)
 → サンプル2(表示領域の内側にスクロールバーを表示する例)

画面内に表示されるスクロールバーは Flash で実装しています。スクロールバー押下でのスクロール処理の他、マウスホイールによるスクロールや、各ページをドラッグ&ドロップすることでもスクロールする事が可能です。

画面右下の数値ボタンを押すことにより、表示されるページが変化します。ブラウザサイズを変更することにより、あるいはページを切り替える(PAGE1, PAGE2を切り替える)ことにより、スクロールバーの表示サイズや位置が適切に調整されます。また、ページの表示サイズに対しブラウザの表示サイズが大きい場合、スクロールバー表示は消去されます。

PAGE3 は BoxScroller を複数画面内に適用した例となります。BoxScroller が複数存在する場合、マウス位置により どの BoxScroller をマウス処理対象とするかの判定を行うかの機能を組みこんでいます。

[ FLASH ] [ tips ] [ update ] 2009年11月24日 11:11 | コメント (0) | トラックバック

FLASH tips 「プロファイラ内容変更」+「フレームへのスクリプト記述」 jsfl サンプル

Flash Lite でのキャリア毎の swf 書き出し作業の問題点

Flash Lite では、どのキャリアの携帯端末で swf が実行されたのか 動的に判別することができません。swf 実行時、各キャリア専用の認証用 URL にアクセスしたいといった場合等、あらかじめキャリアごとに専用の swf を書き出しておく必要があります。(サーバ側で swf 内の変数を動的に書き換える方法もありますが、その環境がないものとして話を進めます。)

例えば以下のようなスクリプトを、ルートのフレーム 1 に記述します。

//1 : docomo
//2 : au
//3 : softbank
CARRIER = 1;

//1 : 本番サーバ
//2 : 検証サーバ
SERVER = 1;

//認証 URL 一覧
URL1_1 = "http://~"; //docomo 本番サーバ用
URL1_2 = "http://~"; //docomo 検証サーバ用
URL2_1 = "http://~"; //au 本番サーバ用
URL2_2 = "http://~"; //au 検証サーバ用
URL3_1 = "http://~"; //softbank 本番サーバ用
URL3_2 = "http://~"; //softbank 検証サーバ用

//実際に認証で用いる URL
url = eval("URL" add CARRIER add "_" add SERVER);

変数 CARRIER, SERVER の各値を手動で書き換えた後 パブリッシュを行い、書き出された swf を docomo.swf, au.swf, softbank.swf …、といった具合に名前を変更します。

ここで、ファイルにどこか修正が入る場合、再び上記 swf 書き出し作業を繰り返す必要がでてきます。この作業の繰り返しは、ミスが発生しやすく、時間も浪費し、精神衛生上よろしくありません。


サンプルファイル ダウンロード

上記問題を解決するために、「プロファイラ内容変更」と「フレームへのスクリプト記述」を行う jsfl のサンプルを作成しました。

 → サンプルファイル一式 ダウンロード[trunk.zip]

今回作成した jsfl ファイルは Flash CS4 以降対応となっています。

サンプルファイルディレクトリ構造は以下のようになっています。

trunk
 ├ fla 
 │ ├ PublishChanger.fla
 │ └ test
 └ jsfl
   ├ publish.jsfl
   ├ Main.jsfl
   ├ ProfileXMLReplacer.jsfl
   └ CarrierActionScript.jsfl


サンプル実行手順

jsfl ファイルから fla ファイルのパブリッシュを行うには、fla ファイルへの絶対パスの指定が必要です。まず publish.jsfl ファイルに fla ファイルへの絶対パスの記述を行います。

publish.jsfl をテキストエディタで開き、一行目に trunk ディレクトリはどこかの指定を行ってください。ダウンロード直後は例として以下の記述が行われています。

var PROJECT_DIRECTORY = 
	"file:///f:/MyDocument/eclipse/workspace/PublishChangerJsfl/trunk/";

例えば以下の環境の場合
 OS : windows XP
 ユーザ名 : Owner
 trunk 配置ディレクトリ : デスクトップ
以下のように変更を行います。

var PROJECT_DIRECTORY = 
	"file:///C:/Documents and Settings/Owner/デスクトップ/trunk/";

上記設定後 publish.jsfl をダブルクリックで実行することで fla ディレクトリ内の PublishChanger.fla ファイルがパブリッシュされ、各種 swf ファイルが fla ディレクトリ内に書き出されます。書き出し先ディレクトリを指定することも可能で、test ディレクトリにも swf が書き出されるようにしています。

書き出される swf ファイルは以下の形式にするようにしています。

(キャリア名 + サーバ種別).swf

各種 swf をパブリッシュする直前には、フレーム 1 に以下のスクリプトを組み込むようにしています。

testTxt = 'キャリア名' add 'サーバ種別';

各 swf ファイルに上記スクリプトが正常に埋め込まれているかを確認するために、PublishChanger.fla 内には testTxt というテキストフィールドを配置しています。各 swf を開いてご確認ください。

今回のサンプルでは上記書き出しと設定を行なうだけのサンプルなので、プロジェクトに合わせて jsfl の処理内容を書き換えてください。swf 名書き出しに関する処理は Main.jsfl 内の for 文以下、フレームへのスクリプト埋め込みに関する処理は CarrierActionScript.jsfl 内に記述されています。各 jsfl ファイル内のスクリプトはさほど長いものではないので、細かい説明は省略します。


参考 プロファイル設定を行う jsfl 処理説明

Flash から swf 等の各種ファイルを書き出す設定プロファイル(xmlファイル)内の、以下の要素を設定する事で swf 出力ファイル名を任意に変更する事が可能となります。

<PublishFormatProperties enabled="true">
	<defaultNames>0</defaultNames>
	<flashDefaultName>0</flashDefaultName>
	<flashFileName>任意のswf名</flashFileName>
</PublishFormatProperties>

ProfileXMLReplacer.jsfl は プロファイル内の指定要素の値を 変更・設定 する処理を行います。Main.jsfl は ProfileXMLReplacer.jsfl を用いて defaultNames, flashDefaultName, flashFileName 要素の値を変更するようにしています。


問題点

私は、Flash Lite の swf は容量を削減するため Flash 8 で書き出す事があります。しかし、Flash 8 では今回作成したサンプルの jsfl 内に記述したスクリプトが使用できないものがあり、せっかく作ったのに使用できないなんて事が。


その他 参考

Adobe Flash CS4 Professional の拡張機能(jsfl API ドキュメント)
http://help.adobe.com/ja_JP/Flash/10.0_ExtendingFlash/index.html

[追記 2009年11月2日]
サンプル内の
this.doc.getTimeline().layers[0].frames[0].actionScript
という記述は root ではなく現在開いているシンボルやシーンのタイムラインを編集することになってしまうようなので、注意!

開いたflaファイルから取得したドキュメントオブジェクト変数(doc)に対し、以下の記述を追加することでルートタイムラインを参照するようになる模様。

this.doc.currentTimeline = 0;

[ FLASH ] [ tips ] 2009年10月29日 14:12 | コメント (3) | トラックバック

FLASH tips MouseEvent 検出処理周りの大幅な変更

ここ最近 UI 関連のライブラリを再構築してく中(現在はスクロールバー関連処理再構築中)、マウスイベント(MouseEvent)は Stage インスタンスのみから検出できるようにするべきではないか、と考えました。

以下予定している今後についてまとめ書きを行いました。

変更内容

(a) MouseEvent を扱うクラスは一つ

・MouseEvent は Stage インスタンスからのみ検出する
・各種 DisplayObject への MouseEvent 検出処理定義は削除
・検出したい MouseEvent はあらかじめ一通り定義しておく

(b) MouseEvent.MOUSE_OUT, MouseEvent.MOUSE_OVER 処理削除

・Rectangle を用いて、領域上にマウスが存在するかを判定する
 → Rectangle.contains 等を利用

(c) 領域がクリックされたかどうかを判定

・(a)でマウスクリックを検出された時
 (b)の領域内にマウスポインタが存在する場合 とする

ポイント

・各所に散らばっていた addEventListener の MouseEvent 処理は不要となる
・DisplayObject 関連インスタンスを生成せずともマウス状況に対する処理が扱える

数値上で計算を行っておき、任意のタイミングで DisplayObject 関連インスタンスを生成し表示・位置設定、といった描画処理を行う事が可能となります。
不要なインスタンスや処理を定義する箇所が減り、なおかつ処理が分割され、見やすいクラス設計が可能となります。

まだ実際に変更作業は行っていないので、あくまで「おそらく」の話となります。

別途考慮が必要になる点

Stage インスタンスに addEventListener で MouseEvent を検出するようにするため いつでも MouseEvent は発生するようになる

DisplayObjectContainer の表示重なり具合を考慮する必要がでてきます。
この SimpleButton は手前に Sprite が表示されているから、マウスクリック判定は無効とする、等です。

複雑な形状の判定

シンプルな UI ならば矩形領域判定で十分かと思われますが、複雑な形状の UI に対して領域クリック調査などを行いたい場合は別途考慮が必要となりそうです。

---


UI 関連ライブラリ全体(特にボタン(SimpleButton)の扱い)に修正が入りそうです。
個人的なコーディングスタイルがよりいっそう統一されたものになりそうです。

考え方にどこか欠陥は必ずありそうです。変更作業を行いながら気づくかもしれません。
やっぱりこうしないほうがいいや、といった事もあるかも。

[ FLASH ] [ tips ] 2009年10月24日 18:07 | コメント (0) | トラックバック

FLASH tips AS3 Slider コンポーネントカスタマイズ : マウス当たり判定を増やす

Slider コンポーネントの部分部分のマウス当たり判定がとても小さく操作しにくいため、当たり判定を大きくするための手順を記述します。

手順

(1)前準備

Flash のコンポーネントウインドウから Slider コンポーネントを ライブラリに配置してください。

(2) fl.controls.Slider クラスの拡張

fl.controls.Slider クラスの configUI メソッド内で、スライダーの三角のボタン(thumb)とスライダーのバー(track)のインスタンスが生成されています。そして、各インスタンスは setSize メソッドにより表示サイズが設定されています。
thumb, track の各インスタンスは protected 設定されており外部クラスから操作できないため、Slider のサブクラスを作成し、外部から表示サイズを変更できるようにします。

package {

	import flash.display.Sprite;
	import flash.utils.getDefinitionByName;
	import fl.controls.Slider;
	
	public class CustomSlider extends Slider {

		override protected function configUI():void{
			
			super.configUI();

			//表示変更したい任意の大きさにする
			thumb.setSize(16, 52);
			track.setSize(80, 40);
		}
	}
}

thumb, track 各インスタンス内にはライブラリ内にある各種スキン用ムービークリップが配置されます。実際には以下のようなソースコードにすれば、スキン用ムービークリップの表示サイズそのままの大きさが各インスタンスに適用されるようになります。

package {

	import flash.display.Sprite;
	import flash.utils.getDefinitionByName;
	import fl.controls.Slider;
	
	public class CustomSlider extends Slider {

		override protected function configUI():void{
			
			super.configUI();
			
			var cls:Class;
			
			cls = getDefinitionByName("SliderThumb_upSkin") as Class;
			var tmpThumb:Sprite = new cls();
			thumb.setSize(tmpThumb.width, tmpThumb.height);
			
			cls = getDefinitionByName("SliderTrack_skin") as Class;
			var tmpTrack:Sprite = new cls();
			track.height = tmpTrack.height;
		}
	}
}


(3) クラス設定

上記 CustomSlider クラス作成後、ライブラリ内にある Slider コンポーネントのクラス設定を fl.controls.Slider から CustomSlider へ変更します。

(4) スキン変更

ライブラリ内にある以下のムービークリップシンボルを編集します。

Component Assets
 └ SliderSkins
  │ 
  ├ SliderThumb_downSkin
  ├ SliderThumb_overSkin
  ├ SliderThumb_upSkin
  │
  └ SliderTrack_skin

サンプルでは、デフォルトのグラフィックほぼそのままで、当たり判定のみが広がるように透明のシェイプを hitArea というレイヤーに追加しています。

SliderTrack_skin には 9 スライス設定がされているので、編集には少々コツがいるかもしれません。後のサンプルファイルをご参考ください。


サンプルファイル

http://www.dango-itimi.com/blog/swf/86/slider.zip

追記) サンプルの fla ファイルを Flash CS3 からでも開けるようにしました

[ FLASH ] [ tips ] 2009年09月07日 23:29 | コメント (0) | トラックバック

FLASH info update web service Twice Me

■ Twice Me
http://www.dango-itimi.com/twiceme/

zoome で公開されている動画をアンチエイリアスなしで拡大して閲覧可能

個人用に製作。あれこれやってるので小さく宣伝。
最低限の機能のみ実装し UI グラフィックは適当です。
時間帯によっては API からまったく反応が返ってこないため使い物になりません。

[ FLASH ] [ info ] [ update ] [ web service ] 2009年08月31日 00:47 | トラックバック

FLASH tips Flash(AS3) から XML-RPC を利用(zoome API)

最近動画に関して少々調査を行っています。
ここで、動画共有サイト zoome で提供されている API で XML-RPC という単語を目にしました。XML-RPC とはなんぞや、と調べて見たところ、指定の形式の XML データ(request)を指定のサーバ(URL)に送信すると、指定の形式の XML データ(response)が得られるというもののようです。

そういえば、XMLをサーバに送信するような処理を書いたことはなかったな、ということで、zoome API を元に Flash(AS3) から XML-RPC をどのように利用するかのメモを以下に記述します。

例として「マイページのURLネーム(zoomeurl)」が「sample」という会員の、「zoome の会員ID(zoomeid)」を取得します。

 zoome API 解説ページ
 http://www.zoome.jp/help10

 会員基礎情報 取得メソッド説明
 http://www.zoome.jp/help10#zoome.getUserInfo

会員基礎情報 取得メソッド(zoome.getUserInfo)の説明箇所の「▼request」 に記されている XML データを、APIのURI(エンドポイント) http://up.zoome.jp/xmlrpc に送信することで、「▼response」 に記されている XML データを取得することができます。

package twm.index.analyze {
	
	import flash.events.ErrorEvent;
	import flash.events.Event;
	import flash.net.URLLoader;
	import flash.net.URLRequestMethod;
	import flash.net.URLRequest;

	public class Sample {

		private var response:URLLoader;
		
		public function Sample() {
		}
		
		public function startRequest():void{
			
			var requestXml:XML = 
				<methodCall>
					<methodName>zoome.getUserInfo</methodName>
					<params>
						<param><value><struct>
							<member><name>zoomeurl</name><value><string></string></value></member>
						</struct></value></param>
					</params>
				</methodCall>
			;
			var zoomeurl:String = "sample";
			requestXml.params.param.value.struct.member.value.string = zoomeurl;
			
			var request:URLRequest = new URLRequest();
			request.contentType = 'text/xml';
			request.data = requestXml;
			request.method = URLRequestMethod.POST;
			request.url = "http://up.zoome.jp/xmlrpc";
			
			response = new URLLoader();	
			response.addEventListener(Event.COMPLETE, eventComplete);
			response.addEventListener(ErrorEvent.ERROR, eventError);
			response.load(request);
		}
		
		private function eventError(event:ErrorEvent):void {
		}
	
		private function eventComplete(event:Event):void {
				 
			var loader:URLLoader = URLLoader(event.target);
			var responseXml:XML = new XML(loader.data);
			
			var zoomeidList:XMLList = responseXml.params.param.value.struct.member.(name == "zoomeid");
			var zoomeid:String = zoomeidList.value.i4;
			trace('zoomeid: ' + (zoomeid));
		}
	}
}

追記) zoome API はクロスドメインの関係で web 上からは直接アクセスできない事に気づきました。上記サンプルコードはローカル PC 上では動作します。

[ FLASH ] [ tips ] 2009年08月27日 16:39 | コメント (0) | トラックバック

FLASH update 絶賛放置中だった PICT PUZZLE を修正しました : ver1.03 へ

Flash Player 10 にすると動作しなくなってしまうという欠陥ゲーム PICT PUZZLE の修正を行いました。サイトに設置してくださっていたみなさま、何ヶ月も放置してしまいまことに申し訳ございませんでした・・・!

 PICT PUZZLE 説明ページ
 http://www.dango-itimi.com/download/pictpuzzle/

 最新版ファイル一式 pict.zip ver1.03
 http://www.dango-itimi.com/download/pictpuzzle/pict.zip

過去のバージョンから ver1.03 へバージョンアップを行うには、pict.zip 内の pict.swf のみを差し替えてください。

▽続きを読む

[ FLASH ] [ update ] 2009年07月29日 02:17 | コメント (0) | トラックバック

FLASH tips mixi アプリ調査中2 Opera でスクロールバーが表示されてしまう問題の解決

前回記述した Opera でスクロールバーが表示されてしまう問題が解決しました。xml 要素の記述の仕方が悪かった事が原因でした。


mixi Developer Center にある 「はじめてのmixiアプリ」の項で以下のような記述箇所があります。

<div>Hello, <span id="target"></span>!</div>

これをこのまま流用して、span 要素内に swf を埋め込ませようとしていました。

<div><span id="target"></span></div>

しかしこれが誤りでした。上記記述だと Opera でスクロールバーが表示されてしまいます。
ここで、span 要素を削除し div 要素に id 設定を行なってみたところ Opera にてスクロールバー表示がなくなりました。

<div id="target"></div>

gadgets.flash.embedFlash の第四引数に何も指定しなくても、gadgets.window.adjustHeight メソッドを呼び出そうともスクロールバーは表示されなくなります。
以下のように div 要素で入れ子にしても問題ありませんでした。

<div><div id="target"></div></div>

[ FLASH ] [ tips ] 2009年07月16日 10:29 | コメント (0) | トラックバック

FLASH tips mixi アプリ調査中

mixi アプリがまだベータ版という事と、私もまだ調査し始めたばかり、ということでどちらに問題があるかわかりませんが、ひとまず現在までにひっかかった点と不明点を記述。

■embedFlash、IE6、 Flash Player 10 表示指定不可

mixiアプリに Flash を利用する場合のサンプル例として公式サイトに以下の説明があります。

gadgets.flash.embedFlash(
      "http://your.server.host/flash/content.swf",
      document.getElementById("target"),
      6);

数値の 6 は Flash Player のバージョンを示すものですが、ここに 10 を指定すると IE6 で何も表示されなくなってしまう。swf 自体が埋め込まれないようです。

IE6 で Flash Player 10 対応の swf を問題なく表示するにはどうすればよいのか、現時点では不明。上記公式の swf 表示方法ではなく swfobject での swf 表示を試してみる予定。

■Opera 9.64 で縦スクロールバーが表示されてしまう

公式の mixi アプリに Flash を 表示する方法に順番に従っていくだけでは Opera 9.64 で mixi アプリ表示領域右側にスクロールバーがデフォルトで表示されてしまいます。(IE6, Firefox3, Safari3.2.3 では表示されず)

公開されている swf を用いた mixi アプリではスクロールバーが表示されていないので、何か解決策があると思いますが、どうすればよいのか情報が見つからず。ありとあらゆる手を模索して色々試してみるしかなさそうです。

※開発環境は Windows XP です。

---
[ 追記 2009年7月15日 ]

Opera でスクロールバーが表示されてしまうケースが少々判明

■判明内容

(1) embedFlash 第四引数 パラメータ設定で width や height を記述しない

swf の表示サイズ設定を行なわない場合にスクロールバーが表示されてしまうようです。上記 コード引用にあるような gadgets.flash.embedFlash に第三引数までしか設定していない場合に起こります。

(2) gadgets.window.adjustHeight メソッドを実行

マニュアルによると、表示対象コンテンツ縦幅 が アプリ表示領域を超える場合、gadgets.window.adjustHeight() を実行するとアプリ表示領域が調節される、とあります。しかしこの命令を実行すると Opera ではスクロールバーが表示されてしまいます。
gadgets.window.adjustHeight 単体実行ではスクロールバー表示は行われません。embedFlash メソッドと同時に利用するとスクロールバーが表示されてしまいます。


表示されてしまうスクロールバーの長さを見る感じ 2px ほど表示対象コンテンツの縦幅が余計に加算されている感じがします。2px という数値、ブラウザの違いで起こる CSS のバグで見たことがあるような気が。


■現在までの解決案

以下の全ての条件を満たせばよしとなりそうです。

・表示対象コンテンツ縦幅をアプリ表示領域内に収める
・embedFlash 第四引数 パラメータ設定で width や height を記述する
・gadgets.window.adjustHeight メソッドを実行しない


■引き続きの調査項目

公開されている Flash を用いた mixi アプリでは gadgets.window.adjustHeight() にて高さ調節を行っているにもかかわらずスクロールバーが表示されていないものもあります。何か解決策がありそうです。

---
[ 追記2 2009年7月16日 ]

上記 2009年7月15日 の内容は誤りがありました。
mixi アプリ表示箇所は home, profile, canvas 三つありますが
上記スクロールバーを表示させない方法は canvas にのみに適用されます。
home, profile に関しては上記内容でも Opera でスクロールバーが表示されてしまいます。

---
[ 追記3 2009年7月16日 ]

Opera でスクロールバーが表示されてしまう件は解決しました。
次の記事

[ FLASH ] [ tips ] 2009年07月14日 17:32 | コメント (0) | トラックバック

FLASH tips FDT + FCSH キャッシュ有効設定

現在製作している Flash コンテンツにてクラスファイル数が 200 近くになっているのですが、一度のパブリッシュ時間が 30 秒近くかかる状況になってしまっています。グラフィックシンボルは別 fla ファイルに切り分けているので、ソースコードの解析に時間がかかっていそうです。

少々のソースコード変更に対して 毎回 30 秒待たされるのは非常に時間の無駄です。まだまだ未完成コンテンツもあり今後さらにソースコードは増加していきます。

ここで、FCSH というものの存在を思い出しました。劇的にパブリッシュ速度を速めてくれるといものです。AS3 を記述するエディタは FDT を利用しており、FDT には丁度 FCSH で簡単に swf を書き出す機能がついています。

早速試してみたところ、確かに swf を書き出す速度は早くはなりましたが、時間は半分くらい短くなった程度。確か初回書き出し時はあまり早くはならず、二回目以降はキャッシュが効き劇的に早くなるはずですが早くなってくれない。おかしいなあと調べてみたところタイムリーな記事が。

 FDTでFCSHのキャッシュがきかない問題 : RingoDiary
 http://d.hatena.ne.jp/rin_go/20090612/1244799938

 俺は口うるさい姑か?的fcshを英語版で動かす話。: タロタローグ ブログ
 http://blog.tarotaro.org/archives/15

flex SDK インストールフォルダ内 bin/jvm.config の内容を書き換えれば、FCSH のキャッシュが有効になるとのこと。書き換えてみたら、うおー、なんじゃこの速度は。今までの時間を返せと言いたくなるくらいの速度で swf を書き出してくれます。(1秒かからない)
上記設定を行なうことで同時に、FDT AS3 Application の Run コマンド実行時、何故か External SWF Viewer 等が起動しなかった不具合が直ってしまったのもめでたい。

以下、FDT AS3 Application から FCSH を設定するまでの動画と簡単な説明です。

▽続きを読む

[ FLASH ] [ tips ] 2009年06月26日 02:28 | コメント (0) | トラックバック

FLASH info tips Flash CS4 10.0.2 アップデートで ムービープレビュー時の Flash Player のバージョンもアップデート

Flash CS4 10.0.2 へのアップデートができるとのことで早速アップデートしてみたところ、ムービープレビュー時の Flash Player のバージョンはめでたく最新?の 10,0,22,91 となりました。今後も Flash Player のアップデートとともに Flash CS4 のアップデートもしてほしいですなあ。

アップデートページ
http://www.adobe.com/support/flash/downloads.html

その他もろもろ改善されているようですが、まだあまり調査はしていません。
http://blogs.adobe.com/rgalvan/2009/05/flash_cs4_update_now_available.html

オーサリング上でのテキストの扱いが非常に重たい(動作が遅くなる)ので、それも改善されればなあ、と考えましたが アップデート後もあまり変化無し。そろそろ PC 買い換え時か。

関連記事
Flash Player のバージョンにより Matrix3D.transformVector で Vector3D の値が 1/20 になるバグ?

[ FLASH ] [ info ] [ tips ] 2009年05月14日 22:49 | コメント (0) | トラックバック

FLASH tips Loader.unloadAndStop でエラー : Flash CS4 ムービープレビュー用 Flash Player

自作スクロールバーコンポーネントのインスタンスを生成・表示した swf を Loader.unloadAndStop メソッドで破棄すると以下のエラーが発生する問題に直面。

Error #2044: ハンドルされていない IOErrorEvent : text=Error #2036: 読み込みが未完了です。

Loader.unloadAndStop を用いず Loader.unload メソッドを用いると上記エラーは発生しません。

大抵エラーが発生すると、Flash の出力パネルに、どのクラスのどのメソッドでエラーが発生したか表示されるのですが、上記エラーはどこで発生したかの表示がなされず調査に時間がややかかってしまいました。

自作スクロールバーコンポーネントの何か作りが悪い、あるいは外部 swf 読み込みでのややこしいセキュリティなんたらが原因でエラーが発生しているのかもしれません。
ただし、上記エラーは Flash CS4 内のムービープレビューの Flash Player(以前も記事にした、3D関連処理にバグのある Flash Player) で実行すると起こるようで、バージョンアップしたデバッグ用 Flash Player では上記エラーは発生しませんでした。

Flash Player のバージョンアップにより、Loader.unloadAndStop に関して何らかの問題が解決した可能性もありますが、Flash Player 10 Release Notes には Loader.unloadAndStop に関しての記述はみつからず。

 Flash Player 10 Release Notess
 http://www.adobe.com/support/documentation/en/flashplayer/10/Flash_Player_10_Release_Notes.pdf

ひとまず最新の Flash Player で問題なく動作するので上記エラーは無いものとすることに。しかし、Flash CS4 で動作確認を行なう際 ムービープレビューとデバッグモードとで動作が異なるというのは避けたいので、Loader.unloadAndStop の使用は一旦とりやめに。
Loader.unloadAndStop はとりあえずとして用いていましたが、内部の作りとしては Loader.unload でも問題ないようになっています。

[ FLASH ] [ tips ] 2009年05月05日 17:22 | コメント (0) | トラックバック

FLASH tips SWFAddresss で変更したページタイトルも Google Analytics は解析収集してくれる

SWFAddress で動的に設定される URL と html のページタイトル(ブラウザウインドウ左上に表示される文字列)を、Google Analytics は解析収集してくれるのかどうか、という疑問点がありました。
検証してみた結果、見事解析収集してくれることがわかりました。


【 詳細 】

デフォルト設定では swfaddress.js を利用する html 上に Google Analytics トラッキングコード用タグを記述することで、SWFAddresss から設定される URL が Google Analytics へ送信されます。

例えば以下の URL の場合

http://www.dango-itimi.com/#/sample/

以下の URI データが Google Analytics へ送信されます。

/sample/

また、Google Analytics 上では 解析した URL にページタイトル(html の title タグ内のデータ)が設定してある場合、Google Analytics 内の「コンテンツ」→「タイトル別のコンテンツ」と選択することで、解析された URL に対するタイトル文字列を一覧とした解析結果表示がなされます。

例えば以下の用な Google Analytics トラッキングコード タグを埋め込んだ ページが存在するとします。

ページタイトル名 : Flash ページ
URL : http://www.dango-itimi.com/flash/

ページタイトル名 :OH! DANGO JAM
URL : http://www.dango-itimi.com/jam/

Google Analytics 上では以下の文字列が表示されます。

[ URL一覧 ]
 /flash/
 /jam/

[ タイトル別コンテンツ一覧 ]
 Flash ページ
 OH! DANGO JAM


ここで、SWFAddress で出力される各 URL と、その URL と同時に SWFAddress で設定したページタイトルは Google Analytics は解析収集してくれるのだろうか、と試してみたところ、以下のような結果になり、見事解析してくれることがわかりました。

ページタイトル名 : サンプル
http://www.dango-itimi.com/#/sample/

ページタイトル名 : サンプル 記事1
http://www.dango-itimi.com/#/sample/001/

ページタイトル名 : サンプル 記事2
http://www.dango-itimi.com/#/sample/002/
[ URL一覧 ]
 /sample/
 /sample/001/
 /sample/002/

[ タイトル別コンテンツ一覧 ]
 サンプル
 サンプル 記事1
 サンプル 記事2


【 経緯 】

以下のような経緯があり、今回の調査にいたりました。

・Google Analytics に表示される URL 一覧では
 ぱっと見どの URL がどのページとなっているのかわかりにくい

・解析されたページが html の場合
 「タイトル別のコンテンツ」から日本語でタイトル一覧閲覧が可能

・Full Flash で製作されたサイトの場合 html に設定されるタイトルは一つなので
 「タイトル別のコンテンツ」に表示されるタイトルは一つだけになってしまう

・SWFAddress を用いて動的に URL や タイトルが変化する場合はどうなるのだろうかと検証

きっと、すでに Progression と Google Analytics を利用している方は周知の事なのでしょうね。


【 別件 】

swfaddress.js 経由で URL 文字列を送信するのではなく、日本語のタイトル文字情報を swf から直接 Google Analytics へ送信すれば、解析結果一覧に日本語文字が一覧で表示され見やすくなる?のでは、という案も挙がりました。

というわけで以下のように Google Analytics へデータを送信するための pageTracker._trackPageview メソッドに日本語文字列をどんどん送信してみました。

 ExternalInterface.call("pageTracker._trackPageview", 日本語文字列);

しかし Google Analytics は日本語は解析してくれない(URL形式になっていないとダメ?)のようで解析結果一覧には反映されませんでした。

[ FLASH ] [ tips ] 2009年04月24日 20:19 | コメント (2) | トラックバック

FLASH tips AIR パッチで再インストール作業短縮

以前、SWFAddress を用いたサイトに使用する、xml ファイル出力 AIR アプリケーションを製作しました。しかし 出力する xml ファイルのフォーマットが変更されるたびに、AIR アプリケーションをパブリッシュし直し、アプリケーションを再インストールする必要がある、という問題がありました。

AIR で製作されたアプリケーションは、インストールとアンインストール作業がやや面倒です。Windows にインストールする場合、まず、以前のバージョンのアプリケーションを コントロールパネルの「プログラムの追加と削除」からアンインストールする必要があります。アンインストール後、インストーラを実行します。


現在 SWFAddress を用いたサイト製作の第一回納品が完了し、今後未完成部分をどんどん製作していくことになっています。各ページの表示に必要な xml ファイルのフォーマットも随時変化していくこととなりそうな状況です。

ここで、xml のフォーマットが変化するたびに プロジェクトメンバーの PC に AIR アプリケーションのインストール/アンインストール作業を繰り替えす事は時間の無駄となってしまうため、どうしたらいいか考えてみました。そして、以下の方法を試してみる事に。

 1)xml フォーマットの変更に伴い処理変更のかかる箇所は
  AIR アプリケーション内で扱うのではなく 別途 swf(xmlParser.swf) で扱う

 2)AIR アプリケーションは 上記 xmlParser.swf を読み込み実行する

 3)各プロジェクトメンバーは Subversion 経由で xmlParser.swf を随時更新する

AIR からの外部 swf 実行にエラー等が発生しなければ、これで問題が解決するはず。

追記)
どうやら AIR のパブリッシュ設定によっては、インストーラーを実行するだけで即アンインストールや新しいバージョンの AIR アプリケーションにアップグレードできるようです。「このセッションのパスワードを保存する」という項目にチェックを入れたらその設定が有効になった?模様。

また、外部 swf で利用したクラスAのインスタンスを AIR 側で利用しようとしたら コンバートエラーが発生。loader.context の ApplicationDomain の設定を一通り試してみましたがダメでした。クラスA は複数のデータを一まとめとして受け渡すだけのためのクラスなので、ひとまず Object 型に変換し利用してお茶を濁すことに。

[ FLASH ] [ tips ] 2009年04月21日 11:05 | コメント (0) | トラックバック

FLASH tips SWFWheel を利用してみる

以前どこかで FlashPlayer10 から Mac でもマウスホイール対応、といった旨の記事を読んだことがあり、おーそうなんだと特に何も考えず マウスホイール処理を記述し あぐらをかいておりました。しかし Mac ではマウスホイールが動作しない、Windows IE7 でも動作しない等、色々と不具合報告をいただきました。自分で検証してみたら Windows Safari でも動作しない模様。うおー

そんな中、SWFWheel というライブラリがあるのを見つけました。

 SWFWheel
 http://www.libspark.org/wiki/SWFWheel

 使用方法の詳しい解説記事
 http://feb19.jp/blog/archives/000167.php

SWFWheel.initialize メソッドを呼び出した後、通常通り MouseEvent.MOUSE_WHEEL イベントにリスナー定義をすればよいだけの模様。どういう仕組みになっているのか理解しておりませんが、利用させていただこうと思います。

[ FLASH ] [ tips ] 2009年04月10日 21:23 | コメント (0) | トラックバック

FLASH tips SWFAddress の各 URL は検索エンジンに認識されないのだろうか

当 blog X-LABO でも利用している Google Sitemaps というものがあります。サイト内の URL 一覧を登録しておくことで google がその URL を巡回するようになり、検索結果に反映されやすくなる、たしかそんな感じでした。

ここで、Google Sitemaps に SWFAddress を用いた Flash サイト内で生成される URL 一覧を登録するとどうなるのだろうか、という疑問が一つわきました。登録した一つ一つの URL を一つの Flash サイトとしてではなく、別途 URL として判定し検索結果に各 URL が表示されるのであれば是非実行してみたいところ。

現在 google は、動的にテキストデータを読み込む Flash サイトのテキストデータも検索が可能になってきているとの事です。もしかしたら Google Sitemaps に URL を登録しなくとも SWFAddress を利用した Flash サイト内の各 URL は google 検索結果に表示されるのではないだろうか?とも思い、SWFAddress を用いて作られている世の各サイトを「site:http:~」と検索してみました。しかし 検索結果は swf を配置している html と swf, その他 swf を配置している以外の別ページのみという事に。

私のような考えは当然持つだろうし、検索結果に表示されないと言うことは、無理ということなのですかなあ。


例えば http://www.dango-itimi.com に SWFAddress を用いた swf を配置していたとして、以下のような 二つのテストページ用 URL があるとします。

 テストページ1
 http://www.dango-itimi.com/#/test1/

 テストページ2
 http://www.dango-itimi.com/#/test2/

理想は テストページ1, テストページ2 が検索結果にでてくれればいいのですが、現実は

 団子一味の野望
 http://www.dango-itimi.com

と判定されてしまいそう。


■参考
SWFコンテンツ検索に関するFAQ
http://www.adobe.com/jp/devnet/flashplayer/articles/swf_searchability.html

ディープリンク URL と サイトマップについて少々書かれています。

[ FLASH ] [ tips ] 2009年04月04日 14:19 | コメント (0) | トラックバック

FLASH tips update スクロールバーコンポーネント3 可変サイズのスクロール対象コンテンツ

スクロール対象コンテンツ長が一定時間ごとに変化する場合の スクロールバーコンポーネントの動作確認用 swf を作成しました。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2009年03月29日 16:00 | コメント (0) | トラックバック

FLASH tips update スクロールバーコンポーネント2 動的なバーの長さ変化

スクロール対象のコンテンツの高さが変化する場合、スクロールバーの高さや表示位置を同時に変化させる必要があります。その動作確認を行なうための swf を作成しました。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2009年03月27日 20:44 | コメント (0) | トラックバック

FLASH tips update スクロールバーコンポーネント 習作

必要になりそうなので、AS3 による定番のイーズ処理で滑らかに動作するスクロールバーコンポーネントの製作を行ないました。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2009年03月27日 11:29 | コメント (0) | トラックバック

FLASH tips update SWFAddress を用いたサイト構築5 設定ファイルを扱う AIR 製作

ライブラリで用いる設定ファイルを扱うアプリケーションを Adobe AIR にて製作。

以下は自分用のメモ

サイト全体の設定ファイルとしてまず index.xml という XML ファイルを用意し、そこにサイト内で読み込む対象の設定項目を記述します。現在までの習作 の index.xml の内容は以下のようになっています。

 index.xml

この index.xml ファイルはデータ量が多くなるので直接 Flash からは読み込みません。コンテンツごとの複数の xml ファイルに分割し、各コンテンツ表示時に読み込むようにします。
ファイル分割を行なうには AIR を用います。index.xml を AIR で作成したアプリケーションで読み込み、index.xml の内容を解析し、定めたフォーマットに整形した後、コンテンツごとの xml ファイルを出力させます。

出力している xml ファイルは以下のとおりです。

 page.xml
 etc.xml

page ボタンで表示されるコンテンツと etc ボタンで表示されるコンテンツ用の xml ファイルです。読み込む 画像やswf ファイル名、表示するテキスト情報が主となります。

また、当ライブラリでの核となる scene.xml ファイルも index.xml を元に AIR で生成します。

 scene.xml

scene.xml には、各コンテンツシーンをいくつ生成する必要があるのかの情報が記述されます。scene.xml を元に全てのシーンインスタンスを生成し、id を割り振ったり、アドレスバーから指定された URL は存在するか、といったチェックを行なう事が可能となります。


今回作成した AIR アプリケーションのスクリーンショット

scene.jpg

「選択」ボタンを押すことでファイル選択ダイアログが表示され、index.xml のディレクトリ位置指定が可能となります。
「書き出し実行」ボタンを押すことで、 index.xml を配置しているディレクトリを基準に scene.xml, page.xml, etc.xml が 指定のディレクトリに書き出されます。


xml 編集ソフトは XMLEditor.NET を用いています。

http://www.xmleditor.jp/

サイトの更新を行なう人は index.xml を編集し AIR にて xml ファイル書き出し処理を実行後、各更新ファイルをサーバにアップロードします。上記 xml 編集ソフトは Windows 用のものなので Mac の人は別途何かいい xml 編集ソフトを探す必要がありそうです。

[ FLASH ] [ tips ] [ update ] 2009年03月25日 11:02 | コメント (0) | トラックバック

FLASH tips update SWFAddress を用いたサイト構築4 外部データ読み込み優先処理実装

自シーンでの外部データ読み込み中に 子孫シーンで外部データ読み込みが発生した場合、子孫シーンの読み込みが完了するまで 自シーンの読み込みを一旦停止し、子孫シーンの読み込み終了後、自シーンの読み込みを再開するための処理を実装しました。内容は以前のエントリーの通りです。子孫シーンとはしていますが、現在は子シーンのみの監視を行なうテストしか行なっておりません。

今回までの習作は以下の URL から確認できます。

http://www.dango-itimi.com/blog/swf/82/

page ボタンを押すと、サムネイル画像が複数読み込まれるページが表示されます。サムネイル画像を押下すると、大きな画像が画面下に読み込み表示されます。複数のサムネイル画像の読み込み途中で どれかサムネイル画像を押下すると、サムネイル画像の読み込みが一旦停止し、大きな画像を先に読み込んだ後、サムネイル画像の読み込みが再び開始されます。

その他実装内容として、ディレクトリの ID 表示に関して設定が可能となりました。以下はその仕様のルールとメモ。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2009年03月25日 03:45 | コメント (0) | トラックバック

FLASH update AS3 での複数ファイル一括入出力操作は AIR で

Flash Player 10 から FileReference クラスによる ファイル入出力機能がサポートされたとのことで、簡易的な xml ファイル操作と xml 入出力アプリケーション製作をしてみようかと調査してみました。しかし FileReference クラスでは一括で複数のファイル出力を行なうといった事は無理なのですね。一度のユーザのボタン押下等のタイミングに対し、ひとつのファイル操作処理が可能、という仕様でした。

Flash でファイル入出力ができるようになったので、個人的な AIR の用途はますますなくなった、と思っていましたが見当違いでした。AS3 を用いて複数のファイル操作を行なうアプリケーションを作成するには AIR で、ということで。

[ FLASH ] [ update ] 2009年03月21日 14:40 | コメント (0) | トラックバック

FLASH tips update SWFAddress を用いたサイト構築3 外部データ読み込みに関する考察

Flash で製作された以下のような構造になっているページがあるとします。
page, btn, window はどれもムービークリップです。

page
├ btn1 --> window1
├ btn2 --> window2
├ …
└ btnN --> windowN

仕様は以下のようになっています。

・page 内に btn が複数(1~N)個ある
・各 btn を押すと 対応する window を開く
・各 window はブラウザで新規ウインドウで開くのではなく
 page 内の指定の位置(page前面、page右側等)にムービークリップとして表示する

更に外部データの扱いに関して以下のような仕様となっています。

・各 btn には外部から読み込んだ画像(サムネイル画像等)を表示
・window 内に表示するデータは btn が押された後に外部から読み込む

今までの私の AS2 での作りでは btn の画像が全て読み込み終了するまで btn は押せず window は開かないようにする、といったものにしていました。しかし btn に読み込む画像が多ければ多いほど各 window を開くまでの時間がかかってしまいます。

読み込み中断処理可能な AS3 からは次の仕様を考えていくことに。

・各 btn に表示する画像が読み込まれなくても各 btn は押下可能に
・各 btn 押下後は 全 btn の読み込みは中断し
 開く window 内で表示するデータを読み込む

ここでの考慮事項として、画像が表示されていない(読み込みが完了していない) btn は押せないようにしてほしい、という要望が挙がる場合もあるかもしれないので、画面遷移の仕様を決める段階でどうするか決めておいたほうがよさそうです。

更に次のような page 内処理で window の状態を監視する処理も考えていくことに。

・window 内のデータの読み込みが完了したら
 中断していた page 内の各 btn の画像読み込みを再び開始する

・window が閉じられ再び btn 選択 page 画面が表示されたら
 中断していた page 内の各 btn の画像読み込みを再び開始する

前者の方法ならば、window 内のデータを閲覧している間、バックグラウンドで全 btn のデータ読み込みを完了しておく、といったことが可能になります。
window から更に外部データを読み込む別ページを前面に表示する...といったいったものになってくると、後者のほうがいいかもしれません。

回線速度が上がっており、待機時間に関して考慮するのであるならば、まずは別の製作箇所優先 となっている今日ではありますが、よりよいテンポのいいページを製作するためにも、こういった工夫は随時行なっていけたらよいものです。

[ FLASH ] [ tips ] [ update ] 2009年03月16日 18:17 | コメント (0) | トラックバック

FLASH tips update SWFAddress を用いたサイト構築 習作2

シーン外部 swf 対応と読み込み中断処理実装や、表示切替処理最適化などを行ないました。今回までの習作は以下の URL から確認できます。

http://www.dango-itimi.com/blog/swf/81/

画面一番右上のボタンが 外部 swf を読み込んで表示するとなっております。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2009年03月09日 18:32 | コメント (0) | トラックバック

FLASH tips update SWFAddress を用いたサイト構築 習作

Progression で構築されたサイトが増える中、今後の Flash サイト製作ではディープリンク機能は欠かせないものになりそうです。というわけで、ディープリンク機能を実現するための SWFAddress を用いてのサイト構築を行なうためのライブラリを作成中。

SWFAddress を用いると、ユーザは URL 指定によりコンテンツ表示切替を行なう命令を いつでも行なうことが可能となります。これは、どのような表示状態からでも 指定した URL に対応するコンテンツ表示を行なうことができるシステム構築が必要になることを意味します。

どのような表示状態からでもコンテンツ表示切替が可能、とはいえ、矛盾が生じないためにある程度決め事が必要となります。現在作成中のシステムでは以下のような決め事を行ないました。

1)コンテンツA表示切替中に コンテンツBへの表示切替命令が行なわれた場合
 コンテンツA表示切替が終了するまでコンテンツBへの表示切替は行なわれない

2)コンテンツA表示切替中に 他コンテンツへの表示切替命令が 複数 行なわれた場合
 コンテンツA表示切替終了後は
 最後にリクエストのあったコンテンツ表切り替え命令に対するコンテンツを表示する

画像やボタンや画面遷移がとっても適当な今回の習作はこちら
http://www.dango-itimi.com/blog/swf/80/

ブラウザの[戻る][進む]にも対応しています。

存在しない URL が指定された場合の対処はまだ行なっておらず、適当な URL をアドレスバーに入力すると 処理が停止し画面が止まります。

[ FLASH ] [ tips ] [ update ] 2009年03月01日 20:39 | コメント (0) | トラックバック

FLASH tips Flash CS4 デフォルトで出力されるHTMLファイルから SWFAddress が正常に動作せず

Flash でディープリンク機能を実現するための SWFAddress を試してみることに(バージョンは 2.2)。しかしもっとも簡単なサンプルを作成するも、意図どおりに動作してくれず。
ブラウザの「戻る」「進む」を押すと SWFAddress.CHANGE イベントが実行されるはずなのですが、まったく呼ばれる気配がないのです。

原因は Flash CS4 のパブリッシュで書き出される HTML ファイルの一行目に ドキュメントタイプ宣言がないからだった模様です。SWFAddress のサンプルフォルダ(samples/splash)内にある indes.html ファイル一行目にある ドキュメントタイプ宣言を何も考えずそのままコピペしたら意図どおり正常に動作するようになりました。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

ちなみにドキュメントタイプ宣言は一杯あって、それぞれが何を示すのかよく意味がわかっておりません。

[ FLASH ] [ tips ] 2009年02月26日 02:54 | コメント (0) | トラックバック

FLASH update ローグライクマップ3D その2 マップスクロール

3Dで表示されるローグライクマップにスクロール機能を実装。
ひとまずよくある操作方法 [W][S][A][D]各キーで 上下左右に移動します。

今回は色々あって swf 直リンクではなく ページ埋め込みです。

▽続きを読む

[ FLASH ] [ update ] 2009年02月24日 00:08 | コメント (0) | トラックバック

FLASH update ローグライクマップ3D

AS2で作成していたローグライクマップ生成処理をAS3に移植し3D表示。
3Dカメラ機能も向上させ、マウスホイールがなくても拡大縮小・焦点位置の変更が可能になりました。

http://www.dango-itimi.com/blog/swf/78/automap3D.swf

※要 最新の Flash Player 10
 豆粒のように小さく表示される場合は Flash Player 10 が最新のものではありません

【 操作方法 】

 [マウスドラッグ] --- 回転
 [マウスドラッグ + Shift] --- 拡大縮小
 [マウスドラッグ + Ctrl] --- 焦点位置変更

 [マウスホイール] --- 拡大縮小
 [マウスホイール + Ctrl] --- 焦点位置変更

マップの一部を表示するようにしています。マップ移動はまだできません。
swf を表示するたびにマップ表示が切り替わります。ブラウザの再読み込みで swf の表示が更新されます。
表示画像が二種類しかなかったり等、見た目はまだまだいまいちです。

カメラをぐっと寄せれば、一人称視点の3Dダンジョン風ゲームも作れそうです。

[ FLASH ] [ update ] 2009年02月16日 00:41 | コメント (0) | トラックバック

FLASH update Flash CS4 勉強6 3D空間上に2Dの絵表示2

ようやく3D空間上に2D絵を表示する際の表示サイズの取得方法がわかりました。いわゆる、3D空間上の とある一点の座標の表示サイズを求めるための方法です。一点の座標の表示サイズ、というのは変な話なのですかね。どのように求めればよいのかずっと悩んでいましたが、とても簡単な方法でできました…
今までの勉強内容のソースがまったくまとまっていないので、後日にまとめて記事にしたいところです。

http://www.dango-itimi.com/blog/swf/77/Test3D.swf

[ 操作方法 ]

・マウスドラッグ:回転
・マウスホイール操作:拡大縮小
・右クリック(Mac では Ctrl + クリック)でコンテキストメニューを表示
 →マウスホイールによるカメラ操作方法の変更が可能

Y軸を軸とした回転の他に X軸での回転も可能とし、常にフィールド(地面)をスクリーンに向けたまま回転するようにしています。

マウスホイールが無い PC の事を考え、Shift + マウスドラッグ等で拡大縮小等を行えるようにする予定。

[ FLASH ] [ update ] 2009年01月12日 21:55 | コメント (4) | トラックバック

FLASH GRAPHIC update Flash CS4 勉強5 3D空間上に2Dの絵表示

http://www.dango-itimi.com/blog/swf/76/Test3D.swf

[ 操作方法 ]

・マウスドラッグ:回転
・マウスホイール操作:拡大縮小
・右クリック(Mac では Ctrl + クリック)でコンテキストメニューを表示
 →マウスホイールによるカメラ操作方法の変更が可能

2Dドット絵の表示サイズ拡大縮小処理に不整合が起きないよう、Y軸のみを用いて回転させています。青い四角のワイヤーフレーム表示は当たり判定を行う領域です。試験的に表示しています。
ドット絵周囲に一ピクセルの黒い線と白い線を描き込んでいますが、線につぶれた感がでてあまり綺麗には見えないですね。足元に影表示を行えば、少し地面から浮いている感が薄れるかもしれません。

今回用意した二つのドット絵

puu.png floor3.png

[ FLASH ] [ GRAPHIC ] [ update ] 2009年01月11日 13:22 | コメント (0) | トラックバック

FLASH update Flash CS4 勉強4 コンテキストメニューから焦点位置変更処理選択

マウスホイールで拡大縮小表示調節を行うだけではなく、スクリーンからの焦点位置?の変更を行えるようにしました。焦点位置を変更すると、3Dの奥行き感が変わります。
デフォルトではマウスホイールは3Dオブジェクトの拡大縮小を行いますが、右クリック(Mac では Ctrl + クリック)でコンテキストメニューを表示することで、マウスホイールの処理を変更することが可能です。

http://www.dango-itimi.com/blog/swf/75/Test3D.swf

※要 最新の Flash Player 10
 豆粒のように小さく表示される場合は Flash Player 10 が最新のものではありません

[ 操作方法 ]

・マウスドラッグ:カメラ回転
・右クリック(Mac では Ctrl + クリック)でコンテキストメニューを表示
 →マウスホイールによるカメラ操作方法の変更が可能

ブラウザ上にスクロールバーが表示されている場合、マウスホイールがブラウザのスクロールバーも同時に操作してしまうようなので swf 直リンクで表示させることにしました。

[ FLASH ] [ update ] 2009年01月04日 15:29 | コメント (0) | トラックバック

FLASH tips update Flash CS4 勉強 3Dカメラマウス操作 + イージング

3Dカメラをマウスで操作する処理を実装。ドラッグすることでカメラが回転し、マウスホイールで拡大縮小します。
マウスにぴったりひっついてカクカクとカメラが動作するのもあまり面白くないので、イージング処理(イーズアウト/イーズイン)を加え、多少滑らかに動作させるようにしました。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2009年01月03日 13:47 | コメント (0) | トラックバック

FLASH update Flash CS4 勉強 3D和室

正月も近づいている事なので和室っぽい簡易的な3Dの部屋を作成してみました。
各面に対する光源処理も追加し、斜面になると少し暗くなるようにしています。

▽続きを読む

[ FLASH ] [ update ] 2008年12月29日 22:38 | コメント (0) | トラックバック

FLASH tips update Flash CS4 勉強 3Dテクスチャ

ようやくできました、遠近法 + テクスチャ描画。いつかできるようになってやるんだ…!と意気込んでから長かった。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2008年12月27日 20:10 | コメント (0) | トラックバック

FLASH info tips Flash CS4 Professional 用 Adobe Flash Player 10 アップデートできず

http://support.adobe.co.jp/faq/faq/qadoc.sv?230767+002#anc_b

上記サイトから Flash CS4 から使用される Flash Player のバージョンをアップできるようなので早速インストールしてみました。しかし手順通り行ってみるも更新が反映されず、Flash CS4 の ムービープレビューから表示される Flash Player のバージョンは WIN 10,0,2,54 のままです。

~\Adobe\Adobe Flash CS4\Players\FlashPlayer.exe

上記ディレクトリにある Flash Player を立ち上げて調査してみると バージョンは「WIN 10,0,12,36」と最新のものに置き換わっています。Flash CS4 のムービープレビューはどの Flash Player を見に行っているのだろうか?
原因がさっぱりわからないので一度 Flash CS4 をインストールし直す予定。
Cドライブに Flash CS4 をインストールしていないのが問題なのですかなあ。

追記)
ノートPCの Windows Vista で Flash CS4 をインストールし試してみたところ、同じく前の記事の問題が発生し、Flash CS4 ムービープレビューの Flash Player もバージョンアップされず。
手詰まりじゃあー!

追記2)
[ムービープレビュー]ではなく [ムービーのデバッグ] から立ち上がる Flash Player は どうやらバージョンアップが反映されているようなので、問題が解決するまで [ムービーのデバッグ]を用いることにします。

[ FLASH ] [ info ] [ tips ] 2008年12月25日 21:12 | コメント (0) | トラックバック

FLASH info tips Flash Player のバージョンにより Matrix3D.transformVector で Vector3D の値が 1/20 になるバグ?

Flash Player 10 から利用できる 3D関連処理の勉強をするためにネットとヘルプを見ながら格闘している最中です。それらしいものはできたのですが、期待する結果と異るものができている感じがする。なぜか3D変形を行ったオブジェクトが豆粒のような小ささになってしまうのです。

何がいけないのかと原因を調べてみると、Matrix3D.transformVector の処理でおかしくなってしまっているらしい。

var m:Matrix3D = new Matrix3D();
var v:Vector3D = new Vector3D(500, 1000, 0);
var c:Vector3D = m.transformVector(v);

trace(c); 出力結果
c: Vector3D(25, 50, 0)

特に何も変形を行っていないのですが、Matrix3D.transformVector を実行することにより Vector3D の各値が 1/20 の値になってしまっている。この 1/20 はいったいどこからきたのだ、と調べてみたところ Flash Player バージョンによっては上記バグが発生するらしき記述が英語のサイトにありました。

各ブラウザのバージョンの異なる Flash Player で試してみたところ以下のような結果に。

IE : Flash Player バージョン 10,0,2,54
 cの値 → Vector3D(25, 50, 0)

Opera : Flash Player バージョン 10.0.12.36
 cの値 → Vector3D(500, 1000, 0)

残る問題は Flash CS4 自体の Flash Player のバージョンをアップグレードするにはどうしたらよいのだ、という点だ。 →続き

[ FLASH ] [ info ] [ tips ] 2008年12月25日 19:11 | コメント (0) | トラックバック

FLASH info tips Flash CS4 : Flash Lite 書き出し swf 容量調査

Flash CS4 が Amazon から届いたので早速調査。

Flash CS3 で書き出した Flash Lite 用 swf は Flash 8 で書き出したものに比べ swf の容量が大きくなってしまう、という事がありました。→以前の記事

Flash CS4 ではどうなのかな~、と早速 swf を書き出してみたところ Flash CS3 と同じく Flash 8 に比べ容量が大きくなってしまうようです。
Flash 8 は当面 PC にインストールしておく必要がありそうです。

[ FLASH ] [ info ] [ tips ] 2008年12月23日 15:48 | コメント (0) | トラックバック

FLASH info tips Flash Player 10 正式リリースによる弊害 : Flash Player バージョンチェック

Flash Player 10 が正式にリリースされた、との事ですが、某ちゃんねる掲示板で Flash Player 10 を導入してみたところ、色々なサイトの Flash が見れなくなってしまったとのこと。


169 名前:Now_loading...774KB[] 投稿日:2008/10/16(木) 15:11:46 ID:FTqYc9sh
なんかバージョンが古いって判別されてしまうサイト多いな
Ver.10なのにVer.1として認識されてるっぽい

UWAAAAAAAAAAA!
こいつはまずい。思い当たる節がたくさんありすぎます。
まだ未熟な腕でバージョンチェックスクリプトを記述していた頃、Flash Player のバージョンチェックは 一桁目しか想定していませんでした。団子一味のゲームも動かなくなってしまうものが結構ありそう。
以前 当blog X-LABO でのバージョンチェックスクリプトメモも一桁目しか想定していなかったものでした。(二年くらい後で気づいて修正しました)

[ FLASH ] [ info ] [ tips ] 2008年10月16日 15:30 | コメント (0) | トラックバック

FLASH tips 子をn個持つ親クラスのコンストラクタには引数は指定しない

ようやっと初めての AS3 の業務に取り掛かっています。今までなんだかんだの制約があり AS3 でまともな業務を行なったことはありませんでした。早速 AS3 で気付いた点を以下に記述します。恐らくとっても何をいまさらなエントリーです。


親クラスのコンストラクタに引数が指定してある場合、子クラスでは明示的に super メソッドを呼び出す必要がでてくるようです。
例えば以下のような Person クラスを親に持つ Boy クラスと Girl クラスを Sample クラスから利用するには以下のようになります。

※package記述は略

public class Person{
	private var name:String;
	public function Person(name:String){
		this.name = name;
	}
}
public class Boy extends Person{
	public function Boy(name:String){
		super(name);
	}
}
public class Girl extends Person{
	public function Girl(name:String){
		super(name);
	}
}
public class Sample{
	public function Sample(){
		var boy:Boy = new Boy("boy");
		var girl:Girl = new Girl("girl");
	}
}

ここで Person クラスを親に持つクラスが Boyクラス、Girl クラス以外に複数増える場合、それら複数のクラス全てに明示的なコンストラクタの実装と super メソッドの呼び出しを行なう記述が必要になってしまいます。また、Person コンストラクタに引数を追加したいという場合、子クラス全てのコンストラクタと super メソッド呼び出しの箇所に修正を入れる必要がでてきてしまいます。

これを避けるためには、Personクラスのコンストラクタに引数を指定するのはやめ、別メソッドで同処理を行なうようにします。

public class Person{
	private var name:String;
	public function create(name:String):void{
		this.name = name;
	}
}
public class Boy extends Person{
}
public class Girl extends Person{
}
public class Sample{
	public function Sample(){
		var boy:Boy = new Boy();
		var girl:Girl = new Girl();
		boy.create("boy");
		girl.create("girl");
	}
}

[ FLASH ] [ tips ] 2008年08月12日 20:33 | コメント (0) | トラックバック

FLASH tips update 透視投影 再々勉強

業務に必要になりそうなので再度透視投影について勉強。最近丁度 Flashによる透視投影方法について詳しく解説してある記事があったので参考にさせてもらいました。

 ■てっく煮ブログ
 AS3.0 で 3D プログラミングを1から勉強する (1)
 AS3.0 で 3D プログラミングを1から勉強する (2) - 行列の導入
 AS3.0 で 3D プログラミングを1から勉強する (3) - 透視投影

なんともシンプルな式と方法で透視投影ができてしまうようで、今まで私が知っていた方法はなんだったのと言わんとぞばかりです。

試しとして以前作成したローグライクマップ自動生成処理と組み合わせてみました。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2008年07月09日 10:31 | コメント (4) | トラックバック

FLASH tips Action Script 2.0 三項演算子内 getter 使用のコンパイルエラー

Action Script 2.0 三項演算子内で getter を使用する場合、代入対象の値を全て getter にするとコンパイルエラーが発生します。

以下のような Sampleクラスがあるとします。

class Sample{

	private var num1:Number = 1;
	private var num2:Number = 1;
	public function get _num1():Number{ return num1; }
	public function get _num2():Number{ return num2; }
}


ここで、以下の Test クラスのような三項演算子での Sample クラスの getter の利用は問題はありません。

class Test{

	public function Test(flg:Boolean){

		var sample:Sample = new Sample();

		var num1:Number = flg ? 1 : 2;
		var num2:Number = flg ? sample._num1 : 2;
		var num3:Number = flg ? 1 : sample._num2;
	}
}


しかし以下の用な記述を行うと、コンパイルエラーが発生します。

class Test{

	public function Test(flg:Boolean){

		var sample:Sample = new Sample();

		//コンパイルエラー発生
		var num:Number = flg ? sample._num1 : sample._num2;
	}
}
■エラー内容

代入ステートメントが一致しません。Function が見つかりましたが、Numberが必要です。

getter の sample._num1 と sample1._num2 がNumber型ではなく Function型として評価されてしまうようです。

上記エラーを避け、なおかつ三項演算子を使用したい場合は、キャストを用いて型変換を行えばよいようです。

class Test{

	public function Test(flg:Boolean){

		var sample:Sample = new Sample();

		//コンパイルエラーは発生せず
		var num:Number = flg ? Number(sample._num1) : Number(sample._num2);
	}
}

[ FLASH ] [ tips ] 2008年05月14日 20:27 | コメント (0) | トラックバック

ETC FLASH info tips 雑記といくつかメモ

山にこもって二ヶ月ほど経過しましたが、現在取り組んでいる仕事がなかなか終わりません。中途 細かい仕事がいくつか入り、頭がいい具合に煮詰まっております。

以下、業務を通していくつか覚えた事を参考サイトと共にメモ。


【 Subversion 上の html ファイルのブラウザ表示設定 】

Subversion 上の html ファイルにブラウザからアクセスすると、html のソースがブラウザに表示されます。しかし html ファイルに属性設定を行と、html をブラウザで開いたときのそのままの表示にすることができるようになります。この設定をしたおかげで、打ち合わせ時に Subversion 上のファイル一式を PC上にダウンロードしなくても 表示確認を簡単に行えるようになりました。

 日常の備忘録:: HTMLをSubversionで管理しながらWebで参照可能に
 http://www.kaede-software.com/2008/01/htmlsubversionw.html


【 デバイスフォント シェイプマスク適用にフィルタ設定 】

デバイスフォントにマスクをかける際、マスクはどのような形をしていようと、矩形マスクとして適用されてしまう問題があるようです。その問題を解決するために以下のサイトのような ビットマップキャッシュを用いた方法があります。

 fumiononaka.com : デバイスフォントが表示されない
 http://www.fumiononaka.com/TechNotes/Flash/FN0502002.html

上記サイトの他の方法として、デバイスフォントのテキストフィールドにフィルタ設定を行うと、ビットマップキャッシュを用いずとも、マスクは矩形として適用されず、シェイプの形そのままで適用することができるようです。


【 ローカル上で確認する際の 他バージョンへのswfへの変数アクセスの制限 】

FlashPlayer8で書き出した swf(8.swf) から FlashPlayer7 で書き出された swf(7.swf)を読み込む場合、ローカルPC上に配置している 8.swfを表示するhtmlをブラウザで開いて動作確認を行おうとしても、8.swf から 7.swf への変数へはアクセスできませんでした。

Flashのムービープレビューやネットワーク上では問題なく動作するため、おそらく他バージョンへのswfのローカルアクセスは制限されているのかもしれません。表示確認に、やや手間がかかってしまうのが面倒です。

[ ETC ] [ FLASH ] [ info ] [ tips ] 2008年05月14日 20:17 | コメント (0) | トラックバック

FLASH info tips FDT 3.0 Enterprise beta版で Refactor Moveコマンドがサポート

最近情報収集にうとくなっており見逃していました。
FlexBuilder なり FDT なり、早く Refactor Move コマンドがサポートされるようにならないかなあ、と鼻をほじほじしながら待ち望んでいたところ、FDT 3.0 Enterprise beta版 で Move コマンドがサポートされたとのこと。

http://fdt.powerflasher.com/blog/?p=40

早速利用してみましたが、oh ブラボー!としかいいようがありません。プログラミング中に、クラス名、メソッド名、変数名はおろか パッケージ名やパッケージ構造もモリモリ変更したくなる方にはうってつけのツールとなりました。

追記)ベータ版のせいなのか、パッケージ名付でクラスを newを行っている箇所に対しては Moveが実行されない等、まだ動作は完全ではない模様。

---

以下、Action Script での Refactor Rename コマンド実行における注意事項。
配列演算子による変数へのアクセスの記述は注意が必要となります。

▽続きを読む

[ FLASH ] [ info ] [ tips ] 2008年03月13日 21:42 | コメント (0) | トラックバック

FLASH tips Excelで開いているファイルは URLLoaderで読み込めない

今後のネットでの検索用に、20分ほどつまずいた ファイル読み込み時の簡単なエラーのメモ。

URLLoaderでcsvファイルを読み込む処理を作成し ローカルPC上で動作検証してみたところ、次のような csv ファイルが読み込めないという旨のメッセージが表示されました。

[IOErrorEvent type="ioError" bubbles=false cancelable=false eventPhase=2
text="Error #2032: ストリームエラー。 URL: file:///~/viewer.csv"]

原因は、読み込み対象の csv ファイルを Excel で開いていたからでした。Excelで開くことにより読み込み対象のファイルがロックされてしまっていたようです。Microsoft Office系のソフトは皆このようになるのでしょうか。メモ帳等のテキストエディタの場合は、この現象は起きません。csvファイルをExcelで開くようにファイル関連付けをしていると、ローカルPC上でのcsvファイル読み込み検証時、同じようにつまずく事があるかもしれません。

[ FLASH ] [ tips ] 2008年02月18日 16:57 | コメント (1) | トラックバック

FLASH tips update トレジャーボインゴ11

会社の携帯端末 docomo SO905i の Flash Lite 3.0 にてトレジャーボインゴの動作確認を行ってみました。そして見事動作させることができました。

---

■Flash Lite 3.0 搭載 携帯用アドレス

・サンプル5 直アドレス
 http://m.dango-itimi.com/trebo/test/5.swf

・携帯電話用 団子一味のアドレス
 http://m.dango-itimi.com/

・QRコード

携帯端末での操作方法は、「2」「8」「4」「6」キーでキャラクター移動&攻撃となっております。

携帯用のトレジャーボインゴは、フレーム分割処理というものを組み込んでいるため、マップ生成からステージ表示まで20秒くらい時間を必要とします。携帯版ではマップ生成中は「マップ生成中...」といった表示を行う予定です。

---

Flash Lite 3.0 が搭載されている docomo 905i シリーズのワークメモリは以下のページによると 一律 3072KB とのこと。

http://www.nttdocomo.co.jp/service/imode/make/content/spec/flash/index.html

Adobe Device Central CS3 のエミュレータ上では、トレジャーボインゴのワークメモリ使用数は 2400~2600KB 程度となっているので、携帯端末上でも問題なく動作してくれました。

現状わかっている問題点として、フロア切り替え後、階段をすぐさま下り次のフロアへ移動すると メモリ解放が上手く行われない、といったことがあるようです。使用メモリが上がったままになってしまい どんどん 3000KB に近づいいってしまう、という現象が起こってしまいます。

端末の性能がアップしていることからか、Flash Lite 2.0 が搭載されていた au よりも処理速度は早く動作しています。キャラクター等の移動速度は PC に比べると遅いですが、au よりは早く動作するようになりました。

docomo 905i シリーズから画面領域がいままでの倍となったので swf表示サイズを当初の予定通り倍にしています。ドット感が出ていい感じです。


■PC版はこちら

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2008年01月14日 22:21 | コメント (0) | トラックバック

FLASH update トレジャーボインゴ10

年の最後に今までに出来ているものまでをアップ。
ポップアップテキスト表示やステージ切り替え処理組み込みなどなど。

▽続きを読む

[ FLASH ] [ update ] 2007年12月27日 16:59 | コメント (1) | トラックバック

FLASH update トレジャーボインゴ9 「FLERR: メモリ不足エラーです。」

処理フレーム分割」を行った事により、ローグライクマップ自動生成処理を携帯端末で動作させることに成功しました。しかし、生成処理の処理行数が多いためかメモリを結構消費してしまい、ゲーム本体であるトレジャーボインゴのメイン処理を続けて実行すると「FLERR: メモリ不足エラーです。」というエラーが発生。

 モバイルデバイスに適した Flash Lite アプリケーションメモリの管理

上記ヘルプページによると、メモリを解放するには使用していない変数に null を代入すればよいとのことなので、色々 null なり delete なり試してみましたが一向に解放される気配を見せてくれず。

Adobe Device Central CS3のエミュレータからメモリについて調べてみたところ、現状の au の FlashLite のヒープメモリ量では トレジャーボインゴを動作させることは困難かもしれません。後もう少しで動作する…! というところでメモリが足りなくなってしまいます。vodafone は au よりもヒープメモリが高く設定されている(500KB程多い)ようで、動作するみたいです。

ローグライクマップ自動生成処理を AIR か何かで作成し、マップ情報をあらかじめたくさんの静的ファイルに書き出しておき、ゲーム実行時にそのファイルをランダムで読みに行く… といった対策が考えられますが、ローグライクマップ自動生成処理をAS3で作り直す気力は現在なし。

「処理フレーム分割」等、携帯用の対策を行っているだけで時間がかかり 先になかなか進めることができないため、しばらくは携帯で動作させる事はあきらめようと思います。当面は PC と Wii 用向けということで、今後 携帯端末の性能がもう少し上がってくれることを願います。

[ FLASH ] [ update ] 2007年11月18日 18:34 | コメント (0) | トラックバック

FLASH info FDT3.0

AS3対応になった FDT3.0、いつのまにやら発売されていた模様。

FDT3.0
http://fdt.powerflasher.com/

eclipseでAS2の開発を行う場合、もっぱらFDT2.0を用いておりました。
丁度仕事でAS3の開発を行うことになりそうなので、AS3の開発を行う場合、現在まだベータ版である FlexBuilder とどちらが開発がし易いか等、調査してみたいと思います。

追記)
FDT3.0をインストールした後、Flash Explorerを開こうとすると 「メモリが足りないから eclipse.ini 内のメモリ設定箇所を -Xmx512m に書き換えてください」といった旨のダイアログが表示され、起動することができませんでした。

調べてみたところ、以下のページが参考になり無事起動成功。

Hatena::Question
Eclipseが「応答なし」にならない方法を教えて下さい。

追記2) 2007/11/28
メインマシン Windows XP の eclipse 3.3.1 でソースコードを書いている途中 頻繁にeclipseがフリーズしてしまいます。ノートPC Windows Vista の eclipse 3.2.2 では快適に動作しています。フリーズの原因は eclipse が悪いのか FDT が悪いのか PCの性能がよくないのか、わからずの状況。

追記3) 2008/1/14
フリーズの原因が恐らく判明。
追記2では Vistaではフリーズは起こらないと書きましたが、その後Vistaでも頻繁にフリーズが起きてしまっていました。
viplugin を eclipse に導入していて、なおかつ vi のファイル保存コマンド「:w」を実行する、と eclipse がフリーズする可能性が高いようです。なので、Windowsデフォルトの「Ctrl + S」で保存すればフリーズを回避することができます。FDT と viplugin で何か処理がバッティングしてしまっているのですかね。

[ FLASH ] [ info ] 2007年11月16日 02:06 | コメント (0) | トラックバック

FLASH tips 処理フレーム分割

「ローグライクマップ自動生成処理」を 現在作成しているFlashLiteゲーム「トレジャーボインゴ」に組み込んでみた所 携帯端末上ではエラーが発生し動作しなくなった、と以前blogに記述しました。1フレーム内で処理する行数が多すぎたためエラーが発生しているものと思われます。

「ローグライクマップ自動生成処理」のみを携帯端末で動作させてみたところ、同じくエラーが発生。「ローグライクマップ自動生成処理」を行う各クラス内のメソッドを複数のフレームをまたぎつつ呼び出す必要がありそうです。

対処として以下のような方法をとることにしました。


【 メインクラスの変更 】

メインとなる Sampleクラス があるとします。

class Sample{

	private var testA:TestA;
	private var testB:TestB;
	private var testC:TestC;

	public function Sample(root:MovieClip){

		testA = new TestA();
		testB = new TestB();
		testC = new TestC();

		testA.run();
		testB.run();
		testC.run();
	}
}

TestA~Cクラスの runメソッドを実行すると それぞれの処理行数が多すぎてエラーが発生してしまう、という場合、各runメソッドを1フレームにつき一つずつ実行するためには以下の様に変更します。

class Sample{

	private var testA:TestA;
	private var testB:TestB;
	private var testC:TestC;

	private var main:Function = null;

	public function Sample(root:MovieClip){

		testA = new TestA();
		testB = new TestB();
		testC = new TestC();

		main = funcA;
		var sc:Sample = this;
		root.onEnterFrame = function(){ sc.run(); }
	}
	private function run():Void{

		main();
	}
	private function funcA():Void{

		testA.run();
		main = funcB;
	}
	private function funcB():Void{

		testB.run();
		main = funcC;
	}
	private function funcC():Void{

		testC.run();
		main = end;
	}
	private function end():Void{
		~
	}
}

上記変更により、一つのフレームで実行される処理は mainメソッドのみとなります。実際は、mainメソッドの参照先メソッド(funcA~C)が実行されます。参照先メソッド内の処理終了後 次に行いたい処理を再び mainメソッドに代入し、次々とTestA~Cクラスの runメソッドを実行していきます。

【 各クラスの変更 】

ここで TestA クラス の内容が以下のようになっているとします。

class TestA{

	public function TestA(){}

	public function run():Void{

		func1();
		func2();
		func3();
	}
	private function func1():Void{
		~
	}
	private function func2():Void{
		~
	}
	private function func3():Void{
		~
	}
}

TestAクラスの func1~3 メソッドの処理行数が多く、TestA.runメソッドを実行するとエラーが発生してしまう場合、以下の用に変更します。

class TestA{

	private var main:Function = null;

	public function TestA(){}

	public function run():Boolean{

		if(main == null) main = func1;
		main();
		return main == null;
	}
	private function func1():Void{
		~
		main = func2;
	}
	private function func2():Void{
		~
		main = func3;
	}
	private function func3():Void{
		~
		main = null;
	}
}

また、Sampleクラス の funcAメソッド を以下の用に変更します。

	~
	private function funcA():Void{

		if(testA.run()) main = funcB;
	}
	~
}

これにより、TestAクラス内の各メソッドが1つのフレームで一つだけ実行されるようになります。TestA.runメソッドから true が返ると、TestAクラス内のすべての処理が終了したことを意味します。


現在は「ローグライクマップ自動生成処理」に上記のような対処を各クラスに追加/変更中...
しかしなかなか動作してくれず。

[ FLASH ] [ tips ] 2007年11月14日 20:28 | コメント (0) | トラックバック

FLASH info これはひどい無断掲載

「おもしろFLASHゲーム集」というサイトに「OH! DANGO JAM」が無断掲載されているという情報をメールにていただきました、

おもしろFLASHゲーム集
http://flash.ge-mu.net/

おもしろFLASHゲーム集 の 「OH! DANGO JAM」が掲載されているページ
http://flash.ge-mu.net/html/072703.php
びっくりしたことに「自分のサイトに設置」タグまで用意されています。こ、こいつは信じられねえ…

このサイトを運営しているのが「有限会社チビコン」というところらしい。
http://chibicon.net/top.html

なんか見たことあるなこのURL、と、過去のメールをさかのぼって調べてみたところ、団子一味のゲームのURLに片端からリンクを貼り、ゲーム集リンクサイトを作っていたところではないですか。リンクが貼られるたびに、都度「ゲームを紹介しました」というメールがどんどん送られてきました。そのサイトには、各ゲームのURLと共にゲーム感想用掲示板というものが設置してあり、こちらの制作したゲームの感想が好き放題書けるようになっておりました。何が書いてあるかは、そのサイトがまだあるのであれば行って見るとわかります。こちらとしては、その書き込み内容に不快にさせられるだけだったためリンクを外してくれとメールを書きましたがスルーされてしまいました。

上記サイト、どうやら iframe で OH! DANGO JAM の swf を表示している模様。以前海外のサイトにて同じような事があった時、対策したような気がしましたがもう一度見直す必要がありそうです。何故こういう行為を行うサイトのために、こちらの時間を割かなくてはならないのかと、なんとも悩ましいものです。サクッとどこかに通報するだけで、対処してくるような所はないのですかね。.htaccessで制限かけることできるのですかなあ。

追記)
以下のページ 「さくらのレンタルサーバ非公式FAQ」の「画像への直リンクを防ぐ」を参考にさせてもらったところ、アクセス制限が上手くいった模様です。
http://faq.sakuratan.com/wiki/wiki.cgi?.htaccess

ばんじゃーい!

[ FLASH ] [ info ] 2007年11月09日 03:53 | コメント (10) | トラックバック

FLASH info docomo 905i シリーズは Flash Lite 3.0

docomo 905iシリーズに Flash Lite 3.0が搭載されることが公式から発表があった模様で以下のページに記述がありました。

 905iシリーズの主な特長

そのうち以下の一覧に 905i が載ることになりそうです。

 端末スペック一覧

docomoでは Flash Lite 2.x 対応の機種は出ることはなくなったのでしょうか。
Flash Lite 3.0 は FlashPlayer8 相当との事ですが、ActionScript 1.0~2.0 で FlashLite の開発を行いたい、という場合は、 au, vodafone の事を考え FlashPlayer7 相当の Flash Lite2.0 での開発を行ったほうが良さそうです。wiiにも対応できますしね。

後はFlashLite2.0を用いればこれくらいのゲーム/携帯サイトが作れます、といったものを作成し 色々な所にプッシュしていければと思います。時間はえらいかかってしまっていますが、トレジャーボインゴはなんとしても完成させなくては。

[ FLASH ] [ info ] 2007年11月01日 19:33 | コメント (0) | トラックバック

FLASH update トレジャーボインゴ8 ポップアップテキストエフェクト

OH! DANGO JAM」でも使用していた 数値や英字がポップアップして表示される テキスト表示処理をライブラリ化。トレジャーボインゴに用いる予定。
以前も作成したような気がしましたが、過去とコーディングスタイルが徐々に変わっており、現在のコーディングスタイルに合わせたものを作成し直しました。

▽続きを読む

[ FLASH ] [ update ] 2007年10月18日 20:53 | コメント (0) | トラックバック

FLASH tips Flashのバージョンの違いで FlashLite用 swf書き出しに容量の差が出る

Flash8で作成していたFlashLite用ゲームを Flash CS3(Flash9)でパブリッシュしてみると、Flash CS3で書き出される swfの方が容量が大きいことがあります。原因は詳しく調査はしていないのでわかりませんが、100KBの容量ギリギリにswfを作成している場合は とても困る問題です。

Flash CS3では ラスタデータの画像の書き出し処理に何か不備がある、といった記事をどこかで見かけたことがありますが、そこらへんが関係しているのかもしれません。

[ FLASH ] [ tips ] 2007年09月21日 10:40 | コメント (0) | トラックバック

FLASH update トレジャーボインゴ7 マップ自動生成処理組み込み

先日より作成していたマップ自動生成処理をトレジャーボインゴに組み込み。しかし携帯端末で動作確認をしてみるとエラーが発生しswfが停止してしまいまいた。
単一フレーム内での処理行数が多すぎたためエラーが発生したと思われます。まずマップ自動生成処理とゲームメイン処理の合間にフレームを一つまたぐ必要がありそうです。それでも動作しない場合、マップ自動生成処理の各処理毎の合間合間にフレームをまたがせる必要がでてきます。

■PC上での動作確認はこちら

▽続きを読む

[ FLASH ] [ update ] 2007年08月05日 17:45 | コメント (2) | トラックバック

FLASH GRAPHIC update トレジャーボインゴ6

トレジャーボインゴで使用するゲーム画像を作成中

【 タイトル画像とゲーム中の主な画面構成 】
treboo1.pngtreboo2.png

【 イベントシーン 】
ややこった家などを表示。
treboo3.pngtreboo4.png
複数マップチップをまたぐグラフィックの背景パーツを配置するのは何かと難しいので、左図の家はイベント中のみに表示されます。

【 自動生成マップ背景用ブロック配置イメージ 】
クォータービューなので、キャラクターが隠れない程度の高さがよさげです。
treboo5.png

【 アイテム 】
ハート、金塊、剣、盾、階段
treboo6.png

【 操作方法確認画面 】
見難いのでおそらく作り直します。
treboo7.png

[ FLASH ] [ GRAPHIC ] [ update ] 2007年06月18日 20:47 | コメント (6) | トラックバック

FLASH info PICT PUZZLE カスタマイズ設置してもろうた2

うわ~い!、またPICT PUZZLEをカスタマイズ設置したくださった方がきましたよ!
背景画像に加え音楽まで変更してくださっています。

wrv
http://wrv.jugem.jp/?eid=97

設置してくださった方は instantGarden のハラさんでした。
私mixiではロムに徹していてすみません><

instantGarden
http://www.ninefive95.com/ig/

[ FLASH ] [ info ] 2007年06月17日 14:18 | コメント (0) | トラックバック

FLASH tips Flex 3 パブリックベータ Refactorコマンド試用

Flex 3 パブリックベータがダウンロード可能になったようです。新機能の一つとして「コードのリファクタリング機能」がついたとのこと。こいつは待ちに待っていた機能ではありませんか、というわけで早速試してみることに。

Flex Builder 3 Public Beta
http://labs.adobe.com/technologies/flex/flexbuilder3/

ActionScript Project を作成し、メインクラスとなる Sample.asファイルを作成。

次にNavigatorウインドウから右クリックでメニュー表示を見てみると、ありました「Refactor」コマンド。
「Refactor」コマンドの項目内には「Rename」がありました。

ベータなのでまだこれだけなのかな、と思いつつ、Renameの項目からクラス名「Sample」を「Sample2」に変更してみると次のようなエラーダイアログが表示されました。

An unexpected exception occurred while performing the refactoring. See the error log for more details.

See the error log for more details.

なんだか Flex Builder 2 を使用していた時もこのようなエラーメッセージが表示されたことがあったような気がします。エラーの原因は少しわかりませんが、Flex Builderを何度か再起動してみたらエラーがでなくなりました。

「Rename」が成功すると、Sample.as内の「Sample」というクラス名とコンストラクタが「Sample2」にすべて変更されました。

次にtest.Testクラス(Test.as)を作成し、Sample2クラスからTestクラスのインスタンスを生成します。そしてTestクラスをRefactorコマンドでRenameし、クラス名を「Test2」にしてみるとどうなるか試してみます。

Previewボタンを押してみると、Testクラスを使用している全てのファイルの修正点を閲覧することが可能のようです。Sample2クラス内の「Test」の記述が「Test2」に変わることを教えてくれます。こ、こいつを待っていたんだぜ…!

今後できるようになるのかはわかりませんが、パッケージ名をRefactorコマンドで Rename等することはできない模様。属するパッケージを変更したい場合、今までどおり一個一個全てのクラスを修正していかなくてはならないようです。

Javaでeclipseによるリファクタリング機能説明のすごそうなページがありましたが、このようなことができるようになるのですかなあ。

実践!リファクタリング
http://gihyo.jp/magazine/wdpress/information/2007/vol37-refactoring

[ FLASH ] [ tips ] 2007年06月11日 19:12 | コメント (0) | トラックバック

ETC FLASH info PICT PUZZLE カスタマイズ設置してもろうた

ブログパーツ的に設置可能なパズルゲームとして、以前作成しました PICT PUZZLE というものがあります。
http://www.dango-itimi.com/download/pictpuzzle/
(カスタマイズ例の項の[サンプル1]か[サンプル2]を選択すると遊べます。)

ゲーム中の画像や音楽等が自由にカスタマイズ可能… とはしましたが、ファイルをサーバにアップロードする手間等含め、カスタマイズまでして設置していただける人はあまりいないだろうなあ、と思っておりました。

そんな どうやって作ったかも忘れかけていた今日この頃、いつものように団子一味へのアクセス解析を見ていたところ、PICT PUZZLE をカスタマイズして設置してくださった方がいるではありませんか。

405号室
http://blog.masa-sleep.but.jp/

うおお!? これはまさにプロの技。なんともありがたやにございます…!ボーナス画像いただきました。

[ ETC ] [ FLASH ] [ info ] 2007年06月05日 20:18 | コメント (2) | トラックバック

FLASH tips ローグライクマップ自動生成3

■パーツ配置処理実装

自動生成したマップに、プレイヤー、次のフロアへ行くための階段、敵、背景パーツ、アイテム、グループ背景パーツをランダム配置可能にしました。


【 自動生成したマップ 】

□□□□□□□□□☆□□□□□□□□☆□□□□□☆□□□□□
□□□□□□□□□☆□□□□□□□□☆□□□□□☆□●■●□
□□□□□□□□□☆□□□□□□□□☆□●■●□◆◆◆◆◆□
□□□□□□□□□☆□□□□□□□□◆◆◆◆◆◆◆□●■■□
□□□□□□□□□☆□●■■■■●□◆□●◆●□☆□■■■□
□□□□□□□□□☆□■■■■◆◆◆◆□■◆■□☆□■■■□
□□□□□□□□□☆□■■■■◆●□☆□●◆●□☆□●■●□
□□□□□□□□□☆□■■■■◆■□☆□□◆□□☆□□□□□
□□□□□□□□□☆□●■■■◆■□☆☆☆◆◆◆☆☆☆☆☆☆
□□□□□□□□□◆◆◆◆◆■◆■□☆□□□□◆□□□□□□
□□□□□□□□□◆□●■◆■◆●□☆□●■●◆●■■■●□
□●■■■■■●□◆□■■◆■◆◆◆◆◆◆■■◆■■■■■□
□■■■■■■■□◆□■■◆◆◆●□☆□●■■◆■■■■■□
□■■■■■■■□◆□●●◆●■●□☆□●■■◆■■■■●□
□■■■■■■●□◆□□□◆□□□□☆□□□□□□□□□□□
□■■■■■◆◆◆◆☆☆☆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆☆☆
□■■■■■◆●□☆□□□□□□□□□□□□□□□□□◆□□
□■■■■■◆■□☆□□□□□□□□□□□□□□□□□◆□□
□■■■■■◆■□☆□□□□□□□□□□□□□□□□□◆□□
□■■■◆◆◆■□☆□□□□□□□□□□□□□□□□□◆□□
□●■●◆●■●□☆□□□□□□□□□□□□□□□□□◆□□
□□□□◆□□□□☆□□□□□□□□□□□□□□□□□◆□□
☆☆☆☆◆☆☆☆☆☆□□□□□□□□□□□□□□□□□◆□□
□□□□◆□□□□☆□□□□□□□□□□□□□□□□□◆□□
□●■●◆●■●□☆□□□□□□□□□□□□□□□●●◆●□
□■■■◆■■■□☆□□□□□□□□□□□□□□□■■◆■□
□■■■◆■■●□☆□□□□□□□□□□□□□□□●■◆■□
□■■■◆■■◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆■◆■□
□●■■◆■■●□☆□□□□□□□□□□□□□□□●■◆●□
□□□□□□□□□☆□□□□□□□□□□□□□□□□□□□□

【 各パーツ配置 】
                          ■■■ 
                    ■I2■ ■■■■■ 
                  ■■■■■■■ ■E1■ 
           ■■■■E3■ ■ ■■■   B1■E1 
           B2■■■■■■■ ■■■   ■■■ 
           ■■■■■■   ■■■   ■■■ 
           ■■■■■■    ■        
           ■■■■■■    ■■■      
         ■■■■■■■■      ■      
         ■ ■■■■■■   ■■■■■■■■■ 
 ■■■■■■■ ■ ■■■■■■■■■■■■■■■■■■ 
 ■■■■■■■ ■ ■I1■■■■   B1■■■■■■■■ 
 ■■■■■■■ ■ ■■■■■■   ■■■■■■■■■ 
 ■■■■■■■ ■   ■                
 ■■■■■■■■■   ■■■■■■■■■■■■■■■  
 ■E2■■■■■                   ■  
 ■■■■■■■                   ■  
 ■■■■■PE1                   ■  
 ■■E3■■■■                   ■  
 ■■■■■E2■                   ■  
    ■                      ■  
    ■                      ■  
    ■                      ■  
 ■■■■■■■                 ■■■■ 
 ■■■■■■■                 ■B2■■ 
 ■B5B6■■■■                 ■■■■ 
 ■B7B8■■■■■■■■■■■■■■■■■■■■■■■S■ 
 ■■■■■■■                 ■■■I1

P : プレイヤー
S : 階段
En : 敵
In : アイテム
Bn : 背景パーツ

nはIDを示す
10以上のIDはXと表示される

登場させたい各パーツのID一覧をメインクラスに渡すことでランダム配置されるように処理しています。

プレイヤーと階段は、すべての部屋が繋がるための通路上に配置されます。プレイヤーと階段以外は、すべての部屋が繋がるための通路上には配置されません。(ローグライクマップ自動生成2参照)

グループ背景パーツは、複数チップで構成される大きな背景パーツを配置したい場合に指定します。上記例ではB5~b8の四つの背景パーツが固まっている箇所がグループ背景パーツとなっています。

配置処理順序は以下のようにしています。

 1.指定した各パーツを最低ひとつずつ配置
 2.各パーツをランダム数配置

パーツ配置可能なチップがなくなった時点で配置処理は終わります。
グループ背景パーツに関しては、配置可能なチップをランダムで探索させているため、特定の探索数を上回った場合、配置はとりやめになるように処理しています。よって、グループ背景パーツを配置するように指定したにもかかわらず、フロア上には配置されない事もあります。FlashLiteでは1フレーム内で実行する処理行数はさほど多くはないと思われるので、探索可能上限はあまり大きく設定はできません。

■敵登場位置設定

1フロア内で一定以下の敵の数になったら敵がどこかに登場するようにします。
一歩一歩プレイヤーが歩くたびに敵がどこに登場するかを決定する処理は行わず、あらかじめどの位置に敵が登場するかを設定して処理軽減を行います。

設定したマップは以下のようになります。

                          ■■■ 
                    ■E■ ■■■■■ 
                  ■■■■■■■ ■■■ 
           ■■■■■■ ■ ■■■   ■■■ 
           ■■■■■■■■ ■■E   ■■■ 
           ■■■E■■   ■■■   ■E■ 
           ■■■■■■    ■        
           ■■■■■■    ■■■      
         ■■■■■■■■      ■      
         ■ ■■■E■■   ■■■■■■■■■ 
 ■■■■■■■ ■ ■■■■■■■■■■■■■■■■■■ 
 ■■■■■■■ ■ ■■■■■■   ■■■■■■■■E 
 ■■■■■■■ ■ ■■■■■■   ■E■■■■■■■ 
 ■■■■■■■ ■   ■                
 ■■■■■■■■■   ■■■■■■■■■■■■■■■  
 ■■■■■■■                   ■  
 ■■■■■■■                   ■  
 ■■■■■■■                   ■  
 ■■■■■■■                   ■  
 ■■■■■■■                   ■  
    ■                      ■  
    ■                      ■  
    ■                      ■  
 ■■■■■■■                 ■■■■ 
 ■■■■■■■                 ■■■■ 
 ■■■■■E■                 ■■■■ 
 ■■■■■E■■■■■■■■■■■■■■■■■■■■■■ 
 ■■■■■E■                 ■■■■

指定した数値分、敵登場位置が設定されます。

これにてローグライクマップ自動生成処理はほぼ完成。

[ FLASH ] [ tips ] 2007年05月31日 02:24 | コメント (0) | トラックバック

FLASH tips ローグライクマップ自動生成2

【 ランダム通路作成 】

全ての部屋が繋がるように通路を繋げた後は、各部屋からランダムで通路を延ばします。
その場合の独自に設定した仕様は以下の通りです。

・ランダムで延ばす通路は直進するのみ (処理軽減のため)
・部屋の角には通路は作らない (見た目を整えるため)
・二本以上の通路が隣り合わせることはないようにする (見た目を整えるため)

ランダムで通路を延ばすようにしたマップ自動生成例は次のようになります。

□□□□□□□☆□□□□□□□□□□□□□□□□□□□□□□
□□□□□□□☆□□□□●■■■■■■■■■■■■■■■●□
□□□□□□□◆◆◆◆◆◆■■■■■■■■■■■■■■■■□
□□□□□□□◆□□□□●■■■■■■■■■■■■■■■■□
□□□□□□□◆□□□□■■■■■■■■■■■■■■■■■□
□□□□□□□◆□□□□■■■■■■■■■■■■■■■■■□
□□□□□□□◆□□□□●■■■■■■■■●◆●■■●◆●□
□□□□□□□◆□□□□□□□□□□□□□□◆□□□□◆□□
□□□□□□□◆☆☆☆☆☆☆☆☆☆☆☆☆☆◆◆☆☆☆☆◆☆☆
□□□□□□□◆□□□□□□□□□□□□□◆□□☆□□◆□□
□□□□□□□◆□□□□□□□□□□□□□◆□□☆□□◆□□
□□●■■●□◆□●■■■■■■■■■■●◆●□☆□●◆●□
□□■■■●□◆□■■■■■■■■■■■■■■□☆□■■■□
□□■■■◆◆◆□■■■■■■■■■■■■■■□☆□●■■□
□□■■■●□☆□■■■■■■■■■■■■■●□◆◆◆■■□
□□■■■■□☆□■■■■■■■■■■■■■◆◆◆□●■■□
□□■■■■□☆□●■■●◆●■■■■■■■●□☆□●◆●□
□□■■■■□☆□□□□□◆□□□□□□□□□□☆□□◆□□
□□■■■■□☆☆☆☆☆☆◆◆◆◆◆◆◆◆☆☆☆☆☆☆◆☆☆
□□■■■■□☆□□□□□□□□□□□□◆□□□☆□□◆□□
□□■■■■□☆□□□□□□□□□□□□◆□□□☆□●◆●□
□□■■■■□☆□□□□□□□□□□□□◆□□□☆□■■■□
□□■■■■□☆□□□□□□□□●■■●◆●●□☆□■■■□
□□■■■■□☆□□□□□□□□■■■■■■■□☆□■■■□
□□■■■■□☆□□□□□□□□■■■■■■●□☆□●■■□
□□■■■■□☆□□□□□□□□■■■■■■◆◆◆◆◆■■□
□□■■■■□☆□□□□□□□□■■■■■■●□☆□●■■□
□□■■■■□☆□□□□□□□□■■■■■■■□☆□■■■□
□□●■■●□☆□□□□□□□□●■■■■■●□☆□●■●□
□□□□□□□☆□□□□□□□□□□□□□□□□☆□□□□□

●は上下左右のチップに通路を作成できないチップです。部屋作成時に部屋の四隅に設定しています。また通路を作成する際、通路が開通した位置のチップの両側にあるチップに設定しています。こうすることで、部屋の角には通路は繋がらなくなり、また、通路が二本以上隣り合うことはならないように処理させています。

◆には移動しない背景オブジェクト(木や岩等)を配置できない箇所です。ランダムで背景オブジェクトを設置させたい場合、通路がふさがれて全ての部屋に移動できなくなってしまうことがないように設定しています。


【 部屋内部にも通路作成 】

ランダムで移動しない背景オブジェクトを配置する際、『プレイヤーオブジェクト』や次のフロアへ移動するための『階段』が、背景オブジェクトにふさがれてしまう可能性があることに気付きました。どちかでもふさがれてしまうと、次のフロアへ進むことができなくなってしまいます。

プレイヤーオブジェクトや階段が 背景オブジェクトにふさがれないようにするためには、一本の全ての部屋が繋がる通路を部屋内部にも作成します。通路がある箇所には背景オブジェクトは配置できないようにしているので、その通路上にプレイヤーオブジェクトや階段を配置すれば次のフロアへ進むことができないという事は起こらなくなります。

部屋内部にも通路を作成したマップ自動生成例は次のようになります。
この例ではランダム通路は作成していません。

□□□□□□□□□□□□□□□□☆□□□□□□□□□□□□□
□□□□□□□□□●■■■■●□☆□●■■■■■■■■■●□
□□□□□□□□□■■■■◆◆◆◆□■■■■■■■■■■■□
□□□□□□□□□■■■■◆●□◆□■■■■■■■■■■■□
□□□□□□□□□■■■■◆■□◆□■■■■■■■■■■■□
□□□□□□□□□■■■◆◆■□◆□■■■■■■■■■■■□
□□□□□□□□□●■●◆●●□◆□■■■■■■■■■■■□
□□□□□□□□□□□□◆□□□◆□■■■■■■■■■■■□
☆☆◆◆◆◆◆◆◆◆◆◆◆☆☆☆◆□■■■■■■■■■■■□
□□◆□□□☆□□□□□□□□□◆□■■■■■■■■■■■□
□●◆●●□☆□□□□□□□□□◆□■■■■■■■■■■■□
□■◆◆■□☆□□□□□□□□□◆□■■■■■■■■■■■□
□■■◆■□☆□□□□□□□□□◆□■■■■■■■■■■■□
□■■◆●□☆□□□□□□□□□◆□■■■■■■■■■■■□
□■◆◆◆◆◆□□□□□□□□□◆□■■■■■■■■■■■□
□●◆●●□◆□□□□□□□□□◆□■■■■■■■■■■■□
□□◆□□□◆□●■■■■■●□◆□■■■■■■■■■■■□
☆☆◆☆☆☆◆□■■■■■■■□◆□■■■■■■■■■■■□
□□◆□□□◆□■■■■■■■□◆□■■■■■■■■■■■□
□●◆●●□◆□■■■■■■■□◆□■■■■■■■■■■■□
□■◆■■□◆□■■■■■■■□◆□■■■■■■■■■■■□
□■◆■■□◆□■■■■■■■□◆□●■■■■■■■■■■□
□■◆■■□◆□●■■■■■■□◆◆◆◆◆◆◆◆◆◆◆◆◆□
□■◆■■□◆◆◆◆◆◆◆◆◆□☆□●■■■■■■■■■■□
□■◆■■□☆□●■■■■■■□☆□■■■■■■■■■■■□
□■◆■■□☆□■■■■■■■□☆□■■■■■■■■■■■□
□■◆■■□☆□■■■■■■■□☆□■■■■■■■■■■■□
□■◆■■□☆□■■■■■■■□☆□■■■■■■■■■■■□
□●◆■●□☆□●■■■■■●□☆□●■■■■■■■■■●□
□□□□□□☆□□□□□□□□□☆□□□□□□□□□□□□□

部屋内部に通路が二つ以上ある場合は、それら通路を接続し、通路が一つしかない部屋には、単純に通路がある壁と反対方向の壁まで必須通路を延ばしてします。

部屋内部にも通路開通後、ランダム通路を作成したマップ自動生成例は次のようになります。

□□□□□☆□□□□□□□□□□□□□□□□☆□□□□□□□
□□□□□☆□□□□□□□□□□□□□□□□☆□□□□□□□
□□□□□☆□□□□□□□□□□□□□□□□☆□□□□□□□
□□□□□☆□□□□□□□□□□□□□□□□☆□□□□□□□
□□□□□☆□□□□□□□□□□□□□□□□☆□□□□□□□
□●■●□☆□□□□□□□□□□□□□□□□☆□●■■■●□
□■◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆■■■■□
□■◆●□◆□□□□□□□□□□□□□□□□☆□●■■■■□
□■◆■□◆□□□□□□□□□□□□□□□□☆□●■■■■□
□■◆■□◆□□□□□□□□□□□□□□□□◆◆◆◆◆◆■□
□■◆■□◆□□□□□□□□□□□□□□□□◆□●■■◆■□
□■◆■□◆□□□□□□□□□□□□□□□□◆□■■■◆■□
□■◆■□◆□●■■■■■■■■■■■■●□◆□■■■◆■□
□■◆■□◆□●■■■■■■■■■■■■●□◆□■■■◆■□
□■◆■□◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆□●■●◆●□
□■◆■□☆□●■■■■■■■■■■■■●□☆□□□□◆□□
□●◆●□☆□●■●◆●■■■■■■■■●□☆☆☆☆◆◆☆☆
□□◆□□☆□□□□◆□□□□□□□□□□□☆□□□◆□□□
☆☆◆◆☆☆☆☆☆☆◆☆☆☆☆☆☆☆☆☆☆☆☆□□□◆□□□
□□□◆□□□☆□□◆□□□□□□□□□□□☆□□□◆□□□
□●●◆●●□☆□□◆□□□□□□□□□□□☆□□□◆□□□
□■■◆◆●□☆□□◆□□□□□□□□□□□☆□□●◆●●□
□■■■◆◆◆◆□□◆□□□□●■■■■●□☆□□■◆■■□
□■■■■●□◆◆◆◆◆◆◆◆◆◆◆◆◆◆□☆□□■◆■■□
□■■■■■□☆□□□□□□□●■■■■■□☆□□■◆■■□
□■■■■■□☆□□□□□□□■■■■■■□☆□□■◆■■□
□■■■■●□☆□□□□□□□●■■■■■□☆□□■◆■■□
□■■■■◆◆◆◆◆◆◆◆◆◆◆■■■■■□☆□□■◆■■□
□●■■■●□☆□□□□□□□●■■■■●□☆□□●◆■●□
□□□□□□□☆□□□□□□□□□□□□□□☆□□□□□□□

[ FLASH ] [ tips ] 2007年04月15日 18:28 | コメント (2) | トラックバック

FLASH tips ローグライクマップ自動生成

ネットのどこかにすでにあるかもしれませんが、↓こちらのサイトのアルゴリズムを参考にローグライク(不思議のダンジョン)系マップ自動生成プログラムをAS2で作成しました。
http://racanhack.sourceforge.jp/rhdoc/intromaze.html (Racanhack コード解説)

コードファイル一覧はこちらです。
・サンプルファイル game.zip

■使用方法

import game.automap.*;

var am:AutoMap = AutoMap._instance; //インスタンス取得
am.init(); //初期化&マップ生成
am.traceMap(); //マップ状態をtrace出力

■実行時のtrace出力内容例

□□□□□□□□□□□□□□□□□□☆□□□□□□□□□□□
□□□□□□□□□□□□□□□□□□☆□□□□□□□□□□□
□□□□□□■■■■■■■■■■■□☆□□□□□□□□□□□
□□□□□□■■■■■■■■■■■□☆□□□□□□□□□□□
□□□□□□■■■■■■■■■■■■■□□□□□□□□□□□
□□□□□□■■■■■■■■■■■□■□□□□□□□□□□□
□□□□□□■■■■■■■■■■■□■□□□□□□□□□□□
□□□□□□■■■■■■■■■■■□■□□□□□□□□□□□
□□□□□□■■■■■■■■■■■□■□□□□□□□□□□□
□□□□□□■■■■■■■■■■■□■□□□□□□□□□□□
□□□□□□■■■■■■■■■■■□■□□□□□□□□□□□
□□□□□□■■■■■■■■■■■□■□□□□□□□□□□□
□□□□□□■■■■■■■■■■■□■□□□□□□□□□□□
□□□□□□□□□□□□■□□□□□■□□□□□□□□□□□
☆☆☆☆☆☆■■■■■■■☆☆☆☆☆■□□□□□□□□□□□
□□□□□□■□□□☆□□□□□□□■□□□□□□□□□□□
□■■■■■■■■□☆□□□□□□□■□□□■■■■■■■□
□■■■■■■■■□☆□□□□□□□■■■■■■■■■■■□
□■■■■■■■■□☆□■■■■■□☆□□□■■■■■■■□
□■■■■■■■■□■■■■■■■□☆□□□■■■■■■■□
□■■■■■■■■□■□■■■■■□☆□□□□■□□□□□□
□■■■■■■■■□■□■■■■■□☆☆☆☆☆■■■■■☆☆
□■■■■■■■■□■□■■■■■□☆□□□□□□□□■□□
□■■■■■■■■■■□□■□□□□☆□□□□□□□□■□□
□■■■■■■■■□☆☆☆■■☆☆☆☆□□□□□□□□■□□
□■■■■■■■■□☆□□□■□□□☆□□□□□□■■■■□
□■■■■■■■■□☆□■■■■■□☆□□□□□□■■■■□
□■■■■■■■■□☆□■■■■■□☆□□□□□□■■■■□
□■■■■■■■■□☆□■■■■■□☆□□□□□□■■■■□
□□□□□□□□□□☆□□□□□□□☆□□□□□□□□□□□

黒い四角(■)は キャラクターが通れる場所、白い四角(□)が通れない場所、☆は暫定的に表示させているもので 上記サイトにある処理時に必要となる区切り線です(白い四角と同じ通れない場所です)。

デフォルトでマップサイズが30x30、部屋の最小サイズが3x3となっています。変更したい場合は、AutoMap.initメソッドに引数を設定します。

処理の流れとしては、AutoMap.initメソッドを実行すると、TipListクラスのlistプロパティにTipクラスのインスタンスが二次元配列(30x30)で格納されます。横から5番目、縦から10番目のTipクラスを取得したい場合、AutoMap.initメソッド呼出し後、以下のように記述します。

var tip:Tip = TipList._instance.getTip(5, 10);

Tipクラス内には、自身が通行可能な場所なのか、通行不可能な場所なのかの情報が格納されています。

今回のサンプルは、全ての部屋が必ずどこかの部屋に接続されるだけのものとなっています。ここからマップ構造に面白みを出していくためにランダムで通路をどこかに繋げたり、敵やアイテムをランダム配置するような処理を組み込んでいくことになります。

ソースコード内のSingletonの使い方は間違っているかもしれませんが、その時はごめんなさい。

[ FLASH ] [ tips ] 2007年03月21日 14:08 | コメント (0) | トラックバック

FLASH update トレジャーボインゴ5

敵AI処理はほぼ完成。斜め移動のないローグライク(不思議のダンジョン系)ゲームの敵の動きにしてみました。画面外の敵の移動処理は重たくなる&大変そうなので行っておりません。

敵は白玉軍団が襲ってきます。敵の方向へキーを押すとそちらへ攻撃を行います。携帯端末用でテンポの良さを重視したいので、プレイヤーの周囲全部の敵がいっせいに攻撃をおこなってきます。

携帯端末での操作方法は、2846キーでキャラクター移動&攻撃です。

■FlashLite2.0搭載 携帯用アドレス

・サンプル4 直アドレス
 http://m.dango-itimi.com/trebo/test/4.swf

・携帯電話用 団子一味のアドレス
 http://m.dango-itimi.com/

・QRコード

PC版はこちら

▽続きを読む

[ FLASH ] [ update ] 2007年03月04日 22:43 | コメント (0) | トラックバック

FLASH update トレジャーボインゴ4

キャラクター移動処理追加。敵キャラクターが画面内に登場すると、プレイヤー方向へ移動してきます。携帯端末でのfpsは12出ているか出ていないか程度。おおむね負荷のかかる処理は実装したので、これ以上速度が遅くなることはないと思われます。

携帯端末での操作方法は、2846キーでキャラクター移動です。敵キャラクターはまだグラフィックを作っていないのでプレイヤーと色違いのキャラクターを配置しています。ひとまず三体ほど登場するようにしています。

■FlashLite2.0搭載 携帯用アドレス

・サンプル3 直アドレス
 http://m.dango-itimi.com/trebo/test/3.swf

・携帯電話用 団子一味のアドレス
 http://m.dango-itimi.com/

・QRコード

▽続きを読む

[ FLASH ] [ update ] 2007年02月04日 19:04 | コメント (0) | トラックバック

FLASH tips Singletonパターンでのインスタンス受け渡し省略化

デザインパターンのうちの一つである Singletonパターンは「指定したクラスのインスタンスが一つしか存在しないことを保証したい」場合に用いる、と文献に書いてあります。Singletonを適用したクラスのインスタンスをnewで生成しようとするとコンパイラがエラーを出して知らせてくれる、というものです。この用途では、結構大規模なプロジェクトではないと Singletonパターンを利用することは無いかなあ、と当初は考えスルーしてしまっておりました。

しかし Singletonパターンを用いると「どのクラスからも直に Singletonパターンを用いたクラスのインスタンスを 取得する事が可能になる」という用途もあることに気づきました。


一つしかインスタンスを生成しないAというクラスがあり、クラスAの機能を利用したいBというクラスがあるとします。

クラスAに Singletonパターンを適用しない場合、クラスBは、どこかのクラスで一度生成されたクラスAのインスタンスを、引数経由で取得します。ここで、クラスBのインスタンスが Cというクラス内で生成され、クラスCはクラスAの機能をまったく利用しない場合、クラスCには クラスAのインスタンスをクラスBへ受け渡すための通路を用意する必要があり、クラスCには不必要なクラスAに関する記述を用意する必要がでてきてしまいます。

クラスAに Singletonパターンを適用する場合、クラスBは引数経由でクラスAのインスタンスを取得する必要がなくなります。ここで、クラスBのインスタンスが Cというクラス内で生成される場合、クラスC内にはクラスAに関する記述はまったく必要がなくなります。


Singletonパターンを用いた簡単な例は以下の通りです。AS3では Singletonパターンの記述がやや困難なものになるようなので AS2で記述しています。上記例で言うと、ControlクラスがA、PersonクラスががB、UserクラスがC、となります。Mainクラスが Controlクラス(A)とUserクラス(C)を生成するメインとなるクラスです。
PersonクラスがControlクラス内に設定された文字列を利用したい場合のプログラムです。


//メインクラス
class Main {

	//初めに呼び出される
	public function Main(){
		
		var ctrl:Control = Control.getInstance();
		ctrl.init( "test" );
		
		var user:User = new User();
	}
}

//A : Singleton適用
class Control {
	
	private static var instance:Control = new Control();

	private var str:String;
	public function get _str():String{ return this.str; }
	
	private function Control(){}
	
	public static function getInstance():Control{
		return instance;
	}
	
	public function init( str:String ):Void{
		this.str = str;
	}
}

//C : Bを生成するクラス
class User {
	
	public function User(){
		new Person();
	}
}

//B : クラスAの機能を利用するクラス
class Person {
	
	public function Person(){
		var ctrl:Control = Control.getInstance();
		trace(ctrl._str); //testと出力される
	}	
}

Singletonパターンを用いない場合、Controlクラスのインスタンスを Userクラスのコンストラクタに引数で受け渡し、UserクラスからPersonクラスのコンストラクタの引数へ Controlクラスのインスタンスを受け渡す、という記述になります。Userクラスでは Controlクラスの機能は利用しないのに Controlクラスに関する記述が必要になってしまいます。

■AS3でのSingletonパターン記述法
akihiro kamijo : コンストラクタ (と Singleton)

[ FLASH ] [ tips ] 2007年01月28日 16:11 | コメント (2) | トラックバック

FLASH tips AS3 パッケージ記述簡略化

testパッケージ内にFirstというクラスが存在する場合、Class(Object)クラスを用いると以下のような記述が可能です。

var cls:Class = test.First;
new cls();

また、flash.utils.getDefinitionByName を用いると 文字列からクラスを取得できるようです。

var str:String = "test.First";
var cls:Class  = getDefinitionByName(str) as Class;
new cls();


異なるパッケージに同名のクラスが存在し、そのパッケージのネストがとても深く、ソースコードが横長になってしまうのを避けたい場合等に利用できそうです。

例)

var a1:Class = tkus.player.attack.sword.normal.action.First;
var a2:Class = tkus.player.attack.sword.normal.action.Second;

var e1:Class = tkus.player.attack.sword.normal.effect.First;
var e2:Class = tkus.player.attack.sword.normal.effect.Second;

//○○○が どのactionパッケージ内のクラスかを判別し、
//○○○に対応するeffectパッケージのクラスを配列に設定する
var list:Array = new Array();
     if( ○○○ is a1 ) list.push( new e1() );
else if( ○○○ is a2 ) list.push( new e2() );


[注意点1]
上記例の tkus.player.attack.sword.normal.action.First クラスのコンストラクタに引数が必要な場合でも swf書き出しが通ってしまいます。実行時に初めて引数の数が異なる旨のエラーが検出されます。

[注意点2]
flash.utils.getDefinitionByName は存在しないクラスの文字列を引数に渡しても FlexBuilderのエディターや、swf書き出し時 コンパイラはエラーを検出してくれません。swf実行時に初めてエラーが検出されます。
仮に flash.utils.getDefinitionByNameの 引数で渡したクラスのパッケージ構造が後に変更されることを考える場合、swf実行時のエラー(ReferenceError)をキャッチし、その内容をログに書き出す作りを想定する必要があるかもしれません。

[結論]
厳密な仕様にする場合、使用は禁物


[ Adobe LiveDocs ]
Class
getDefinitionByName()

[ FLASH ] [ tips ] 2007年01月23日 12:49 | コメント (0) | トラックバック

FLASH update トレジャーボインゴ3

任意の位置に背景パーツで作成できるように設計。
今後は不思議のダンジョン系の自動マップ生成に挑戦する予定。

サンプルでは14x14のマップチップを並べ、周囲に木を生やし一つの部屋を作っています。2846キーで上下左右にマップ全体が移動します。キャラクターは背景パーツの一つとなっており現在は移動しません。

携帯端末で動作確認してみると、処理(描画?)速度は以前のサンプルより遅くなってしまっています。16~18fpsくらいで移動し、1マス移動する毎にマップチップ+背景パーツ表示切替が行われ、そこでガクッと一瞬止まります。
現在の速度は及第点といったところでしょうか。これ以上早くするのは難しいです。今後、キャラクター移動処理など組み込むので更に遅くなるかもしれません。


■FlashLite2.0搭載 携帯用アドレス

・サンプル2 直アドレス
 http://m.dango-itimi.com/trebo/test/2.swf

・携帯電話用 団子一味のアドレス
 http://m.dango-itimi.com/

・QRコード

▽続きを読む

[ FLASH ] [ update ] 2007年01月13日 01:25 | コメント (0) | トラックバック

FLASH update トレジャーボインゴ2

上下左右でマップチップが移動するだけのサンプルを作成。
FlashLite2.0を搭載してある携帯端末からも閲覧が可能です。
http://m.dango-itimi.com/trebo/test/1.swf
上下左右矢印キー または 2846番号キー のどれかで移動します。

fpsは24に設定していますが、携帯端末上では体感 fps18~20程度です。これから更に色々な処理が加わるので、処理速度はもっと遅くなると思われます。現在のところ処理速度は合格点です。

マップチップが消えたり登場するところで、綺麗に消えるようにエフェクトをかけるものも作成してみましたが、見た目がいまいちなのでひとまずボツに。

携帯電話用 団子一味のアドレスはこちら
http://m.dango-itimi.com/

QRコード

[ FLASH ] [ update ] 2007年01月08日 16:35 | コメント (0) | トラックバック

FLASH GRAPHIC update トレジャーボインゴ1

raf.png

FlashLite2.0で何かクォータービューで動作する簡単なサンプルゲームでも一本作成してみようかなとイメージ画面を作成。タイトルは「トレジャーボインゴ」。
WiiのFlashPlayerは7相当ということで、そちらも視野に入れたいところです。

今まで作成してきたクォータービューものとは異なる点は、主人公キャラクターを常に画面中心に位置させ、移動時は主人公ではなく背景マップを移動させるという点。
昔のドラクエ1のようなマップチップ単位で移動させるのではなく、フレーム毎にピクセル単位で移動させます。

携帯FlashLite2.0でまっとうな処理速度で動作すれば、携帯電話のFlashPlayerよりも性能がいいであろうWiiでも動くのではないかと考えております。まっとうな処理速度を出すために、1フレーム間での処理行数を減らす事を最優先に、深度変更処理や背景パーツ移動処理の最適化を図ります。

WiiのFlashPlayerではどれくらいのことができるのか、Wii自体を持ってないのでまだほとんど調べておりません。ニンテンドーDSLiteが現在でもまだ品薄状態ということなので、Wiiも当面買えそうもない予感がします。

Wii FlashPlayer 調査予定項目
・SharedObjectの使用の可否
・読み込み可能なswfの容量
・サウンド周り

[ FLASH ] [ GRAPHIC ] [ update ] 2007年01月07日 15:50 | コメント (0) | トラックバック

FLASH GRAPHIC update タケノコと牛殿様5 タメ攻撃

power1.gif power2.gif power3.gif power4.gif

マウスボタンを押しっぱなしでパワーをため、一定時間ためると円のエフェクトがキャラの後ろに表示され、マウスボタンを放すとタメ攻撃が発動します。

マウスクリックによる各通常攻撃中にタメを行うことで、それぞれ対応するタメ攻撃を出すことが可能です。通常攻撃四段目中にはタメてもタメ攻撃は出せません(スライディングになります)。パワーをタメている間でも移動が可能です。

WiiのOperaでFlashが再生できるとのことで、クリックのみで遊ぶ事ができるように作っている「タケノコと牛殿様」もWiiで遊べたらいいなあ と思っております。しかしおそらくWii OperaのFlashPlayerは7だったりして無理なのでしょうなあ。

▽続きを読む

[ FLASH ] [ GRAPHIC ] [ update ] 2006年12月14日 19:10 | コメント (0) | トラックバック

FLASH update タケノコと牛殿様4 基本攻撃2とエフェクト

任意のタイミングで攻撃が可能になりました。また クリックし続けるとパワーをためるエフェクトが発生します。ためて出すことのできる技はまだ出せません。その他、簡単なキャラクターの残像表示も行うようにしました。キャラクターの残像は見ていて目が回るかもしれないので後でなくすかもしれません。

今回までの内容で、中身がなんだかすっきりしない設計とソースコードになっていたので二回くらいシステムを構築し直しています。タスクシステムたるゲームシステム設計法があるとネットに情報があったので、独自似非タスクシステムで構築し直しました。

クリックし続けたときに足元から出る光のエフェクトは、前々からこういう表現はどうやるんだろうなあ、と思っておりましたが、Blendmode.ADD と GlowFilter, BlurFilter を用いれば簡単に実現が可能なのですね。もっとモリモリ研究したいです。

▽続きを読む

[ FLASH ] [ update ] 2006年11月26日 17:47 | コメント (5) | トラックバック

FLASH tips AS3 フレームに配置したサウンドの音量制御

ActionScript3ではサウンド制御方法が色々変更されているのでメモ。
オーサリングでフレームに配置したサウンドの音量制御方法です。

サウンドを配置したMovieClipシンボルがSampleクラスにリンケージ設定されている場合、スクリプトは以下の通り。

package {
	
	import flash.display.Sprite;
	import flash.media.SoundMixer;
	import flash.media.SoundTransform;
	
	public class Sample extends Sprite {
		
		//ボリューム(0~1)
		public static const VOL:Number = 0.3;
		
		public function Sample() {
			
			var transform:SoundTransform = SoundMixer.soundTransform;
			transform.volume = VOL;
			this.soundTransform = transform;
		}
	}
}

Sampleクラスが Document class ならば、Sampleクラスに属する全てのクラスのフレームサウンドの音量がいっせいに0.3に設定されます。

[ FLASH ] [ tips ] 2006年11月26日 17:34 | コメント (0) | トラックバック

FLASH GRAPHIC update タケノコと牛殿様3 基本攻撃

一旦アップ。
サウンドと基本攻撃モーションの組み込み。

attack1.gif attack2.gif attack3.gif attack4.gif

▽続きを読む

[ FLASH ] [ GRAPHIC ] [ update ] 2006年11月21日 19:25 | コメント (0) | トラックバック

FLASH GRAPHIC update タケノコと牛殿様2 キャラクター移動

基本移動グラフィックを作成し組み込み。
それと先日作成した白縁取りスクリプトを導入。

wait.gif run.gif up.gif down.gif

▽続きを読む

[ FLASH ] [ GRAPHIC ] [ update ] 2006年11月16日 19:05 | コメント (2) | トラックバック

FLASH GRAPHIC update タケノコと牛殿様

AS3とビットマップエフェクトの習作として製作予定のゲーム。まずはキャラクターとゲーム画面イメージから。
手裏剣を投げ、その軌道をペカーッと光らせたりしたいので、背景は暗めに設定。

all.png

image1.png image3.png

[ FLASH ] [ GRAPHIC ] [ update ] 2006年11月11日 15:44 | コメント (4) | トラックバック

FLASH tips リアルタイム 縁取り

指定したSpriteクラス内の描画データ周囲1ピクセルに、指定カラーをリアルタイムで付与するスクリプトを作成(AS3)。
Bitmap.drawメソッドでは、コピー対象となるオブジェクトの負の座標に位置する描画データはコピーできないものかと思っておりましたが、第二パラメータにMatrixオブジェクトを指定すれば可能だったのですね。Helpにしっかりと書いてありました。

コピー対象となるSpriteオブジェクト(spr)の負のX座標 -10ピクセルまでコピーしたい場合、以下のコードでBitmapDataにdrawが可能となります。

var n:int = 10;
var m:Matrix = new Matrix();
m.translate(n, 0);
var bmd:BitmapData = new BitmapData( spr.width + n, spr.height, true, 0x00000000 );
bmd.draw( spr, m );

▽続きを読む

[ FLASH ] [ tips ] 2006年10月29日 00:10 | コメント (0) | トラックバック

FLASH tips FlashLite2.0 W43Sでの検証2

引き続き auの W43S で性能検証。
ピンボールゲームのために作成したライブラリを用いて、直進するボールを反射させる動作のみを行うシンプルなFlashを作成し検証しました。

・Stage.scaleMode = "noScale" が使用可能

ドット絵Flashを用いる人には万歳といったところでしょうか。
今回の作成したFlashはステージサイズ200x200ピクセルで作成しましたが、Stage.scaleModeを設定することにより中心のドットのキャラクターが広がったりすることはありませんでした。

・速度

今回のFlashの速度は 24fps で書き出しましたが実機では体感 12fps 程度の速度となりました。
衝突と反射を行うライブラリはそこそこ処理が複雑になっているので、さらにシンプルなゲームならばもっと早い速度が出ると思われます。試しに反射処理は行わせず、X軸のボール移動のみ行わせたら 24fps 程度になりました。

速度はある程度がまんすれば、いままでより面白いFlashLiteゲームがどんどん作成できそうです。パズルゲーム等、今までは泣きながら作成してきましたが、FlashLite2.0が主流となれば容易く量産できそうです。
Docomo903iではFlashLite2.0は採用されなかった模様なので、無念で仕方がありません。

imode Flash対応端末の情報
http://www.nttdocomo.co.jp/service/imode/make/content/spec/flash/
一番下の欄に発売された(?) SH903i の項目があります。

今回の検証用に作成したFlashはこちら↓

▽続きを読む

[ FLASH ] [ tips ] 2006年10月22日 00:27 | コメント (0) | トラックバック

FLASH tips FlashLite2.0 W43Sでの検証

今までFlashLite2.0用に作成してきたピンボールゲームを au の W43S で動作検証。
PC上で動作するイメージで そのまま動いたらすごいだろうなあとワクワクしていましたが、案の定エラーが発生しゲーム起動すら行われませんでした。

少しずつソースをコメントアウトしつつ ようやく動作するようにまでこぎつけましたが、処理速度はヘロヘロで体感10fpsも出ていません。処理軽減を考えて制作してきましたが、これではちょっとピンボールゲームと呼ぶには厳しいですなあ。まともな速度を出すにはもっともっとシンプルな内容にしなくてはならなそうです。現在製作中のピンボールゲームは当面PC専用となりそうです。

今回わかったことは以下の通り。

・1フレーム内での処理つめこみすぎでエラー発生

PCのFlashLiteエミュレータでは問題ない 1フレーム内での処理行数でも、携帯端末のFlashLiteプレイヤーではエラーが発生する場合があるようです。どれくらいの処理行数でエラーが発生するかは端末によって異なると思います。エラー発生を防ぐにはフレームをまたいで処理を分割する必要がでてきそうです。MovieClip.onEnterFrameを織り交ぜたりせねばならなく面倒なことになりそうです。

・ビットマップ画像多様による画像赤色化現象は今までのFlashLiteと同じく起こる

W43S上で確認してみたところ、背景画像が真っ赤になってしまっていました。ビットマップ画像の多用は禁物。ベクターデータを使いましょう といったところでしょうか。おいどんはドット絵のビットマップ画像を多用したいんだ!


今後はもう少しシンプルなスクリプトで、どれほどの速度がでるのか検証したいところです。今回の結果は少しがっくりでしたが、全てActionScript2.0で書いたFlashが携帯端末上で動作したという点に関してはうれしいものです。

以下は最新版のピンボールゲーム。PC上でしか動作しません。

▽続きを読む

[ FLASH ] [ tips ] 2006年10月10日 19:47 | コメント (0) | トラックバック

FLASH info SoftBank FlashLite2.0 独自仕様pdf

某所の方の日記より

モバイル&デバイスデベロッパーセンター
http://www.adobe.com/jp/devnet/devices/development_kits.html

「ソフトバンク携帯電話用 Flash Lite 2.0 CDK」という項目の所で、SoftBank携帯FlashLite2.0の独自仕様について書かれているpdfファイルがダウンロードできます。
SharedObjectが使用できない等、もろもろについて書かれています。

同ページにKDDI用の項目もありますが、ソフトバンクのような独自仕様について書かれているファイルは今の所ないようですね。

ドット絵Flashを作成している身として使用できるのかどうか気になっているスクリプトは「Stage.scaleModeメソッド」。swfステージサイズが変更されてもコンテンツ表示サイズは固定されるようにするためのものなのですが、使えたらよいですなあ。

[ FLASH ] [ info ] 2006年10月04日 01:11 | コメント (0) | トラックバック

FLASH info ソフトバンク新機種はFlashLite2.0

先日発表されたソフトバンク新機種はどうやらFlashlite2.0対応の模様。
910SH、810SH、811SH、910T、810T、811Tが対応しているようです。
ファイルサイズ150KBまでだそうで、auにあわせるならば100KBを上限と見たほうがよいでしょうか。

以前までのauのFlashLiteのように「外部swf読み込み→破棄」を繰り返して1MBまで読み込み可能かどうかは不明な所。

[ ソフトバンクモバイル資料 ]
コンテンツを便利に、楽しく利用できる新機能を導入(pdf)

10月1日が過ぎVodafoneからSoftBankのサイトに変更されています。
http://mb.softbank.jp/mb/

[ FLASH ] [ info ] 2006年10月01日 02:27 | コメント (0) | トラックバック

FLASH info au FlashLite2.0対応端末

某所より
au機種別情報一覧


冬あたりにようやくFlashLite2.0対応機種が出るとの事で。
ドコモやソフトバンクも同時期にFlashLite2.0対応機種を発売してくれれば、大変喜ばしゅうございます。

[ FLASH ] [ info ] 2006年09月04日 01:25 | コメント (0) | トラックバック

FLASH tips update 軸測投影4 軸回転

FLASH tips Spriteクラスのインスタンス名はどうしよう

ソースコードをガリガリ書いていて引っかかりました。

AS3では MovieClipよりも多く使用するかもしれない Spriteクラス。
今まで MovieClipのインスタンス名はよく「mc」とすることが多かったのですが、Spriteクラスのインスタンス名はどうしたらよいものか。「sprite」では「mc」に比べちょっと長い気もします。いい名前はないものでしょうか。ただの「s」ではわかりにくいですよね。「st」かなあ…

また、MovieClip名には gameMC といった具合に MC を大文字でつけていました。マクロメディア推奨は game_mcといった具合にするのでしたっけ。SpriteシンボルがFlashオーサリング上で作成できるようになった時、どのような名前がメジャーになるのですかなあ。

[ FLASH ] [ tips ] 2006年08月29日 22:01 | コメント (0) | トラックバック

FLASH tips ActionScript3 as演算子

ActionScript3から使用可能な as 演算子。
括弧でくくる記述で利用してみました。

var list:Array = [ new Sample(1), new Sample(2), new Sample(3) ];
trace( (list[0] as Sample).x );

//Sampleクラスの内容
package{
	class Sample{
		public var x:Number;
		public function Sample( x:int ){ this.x = x; }
	}
}

通常list内の0番目の要素のプロパティxの値を取り出したい場合、次のような二行になります。

var s:Sample = list[0];
trace( s.x );

本当は以下のように一行にすっきりとまとめたいところですが、

trace( list[0].x );

これでは仮にSampleクラスのプロパティ x の変数名が、nx という変数名に変更されたとしても、コンパイラやソースエディタ(FlexBuilder2)はエラーを検出してくれないため、バグの元になる可能性があります。

ここで、一行で記述ができ、コンパイラがエラー検出もしてくれる as 演算子が役に立ちました。

trace( (list[0] as Sample).x );


ただしfor文で配列内の要素全てを回して利用する、といった場合、同じくActionScript3から使用可能な for each文を用いたほうが見栄えがよしなので、使いどころは限られてきそうです。

//for文
for( var i:int=0 ; i < list.length ; i++ ) trace( (list[i] as Sample).x );

//for each文
for each( var s:Sample in list ) trace( s.x );

・as 演算子についてはこちら

akihiro kamijo
http://weblogs.macromedia.com/akamijo/archives/2006/01/_as.cfm

[ FLASH ] [ tips ] 2006年08月28日 19:32 | コメント (2) | トラックバック

FLASH tips update 軸測投影3 ボックス

ボックス状に面を作り、そこにテクスチャをぺったんこ。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年08月28日 01:07 | コメント (0) | トラックバック

FLASH tips update 軸測投影2 テクスチャ

適当な面を作成し、そこにビットマップを貼り付け。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年08月27日 18:23 | コメント (0) | トラックバック

FLASH tips update 軸測投影

まずは、スクリプトで線を引くだけの軸測投影のサンプルを作成。
3D表現は計算量が多いからActionScript3ならば早く表示できるのではないかと考え、勉強がてらFlash9にて製作。
軸測投影は透視投影とは違い奥行きがありません。
クォータービューということもあり、今後団子一味のゲームに生かせそうです。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年08月27日 11:48 | コメント (0) | トラックバック

FLASH info iframeタグで自サイトのコンテンツが埋め込まれてしまう問題

海外のサイト(中国?)で 団子一味のゲーム「OH! DANGO! JAM」をiframeタグを用いてそのまま自分のサイトに貼り付けているサイトがあるのですよね。これって防ぎようがないものなのでしょうか。

そのサイトはスレッド式掲示板のサイトで、どのスレッドのページからも iframeタグで「OH! DANGO! JAM」を表示させているのです。各スレッドページを開くたびに「OH! DANGO! JAM」が強制的に読み込まれてしまっています。なにさらすんじゃアホー! な状態です。
しかもそのサイトはアクセス数が非常に多いようで、iframe埋め込みをされた当初は転送量があっという間に制限を超え、あわや大惨事でありました。

問題のサイト
http://sdsdd78.hp.infoseek.co.jp/cgi-bin/patio.cgi

画面真ん中やや上の「按我打開線上寵物」という所をクリックすると表示されます。

[ FLASH ] [ info ] 2006年08月26日 13:49 | コメント (2) | トラックバック

FLASH tips update 透視変換2 高さ

透視変換処理に高さの概念を追加。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年07月29日 18:51 | コメント (2) | トラックバック

FLASH tips update 透視変換 再勉強

1年くらい前に練習として制作した透視変換処理を再度見直しライブラリ化。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年07月27日 10:20 | コメント (2) | トラックバック

FLASH update ピンボール作成8 スロット動作

スロットが動作するようになりました。
キノコ台にぶつけるとスロットが開始します。その他、画面各パーツが動作するようになっております。

▽続きを読む

[ FLASH ] [ update ] 2006年07月17日 15:07 | コメント (1) | トラックバック

FLASH tips ActionScript3 PngEncoderクラス,JPEGEncoderクラス を用いてステージデータ画像化

せっかくActionScript3を勉強するならば、ActionScript3でのみできることを行うべきだ、というわけで、ActionScript2まででは結構大変だった swf画面の画像化を実装。
海外で公開されている、PngEncoderクラス または JPEGEncoderクラス を用いて実現します。

▽続きを読む

[ FLASH ] [ tips ] 2006年07月11日 00:11 | コメント (1) | トラックバック

FLASH tips ActionScript3勉強 事始め 手動で配置したステージ上のMC制御

Flash 9 Public Alpha と Flex Builder 2 を利用してAS3を勉強開始。

ネット上のAS3のサンプルを見てみるも、Flash 9のライブラリ内にあるMovieClipを動的に配置(addChildメソッドを利用)するサンプルはあるものの、手動でステージ上に配置したMovieClipの制御方法がわからず少々てこずりました。

解決までの悩んだ経路

1.お約束の Hello World! のみを表示する Sample.as ファイルを作成
2.Flash 9 上で「Document class」として「Sample」クラスを設定
3.パブリッシュしてみて Hello World! が表示されることを確認
4.Flash 9 上で適当な MovieClip を作成しステージ上に配置
5.配置した MovieClip のインスタンス名を mc と設定
6.パブリッシュしてみると以下のエラーが表示

ReferenceError: Error #1056: Sample のプロパティ mc を作成できません。
	at flash.display::Sprite/flash.display:Sprite::constructChildren()
	at flash.display::Sprite$iinit()
	at Sample$iinit()

7.小一時間悩む
8.Sample.as内のプロパティフィールドに次の一行を記述

public var mc:MovieClip;

9.パブリッシュが通る
10.Sample.as内から ステージ上に配置した mc を制御可能に

ううむ、なるほど。今までAS2では、MovieClipを継承したクラスを作成したことがなかったため、この発想はありませんでした。この仕様のおかげで、よりいっそう厳密にプロパティ管理が行え、安全なコーディングが可能になりそうです。

どうしてもソースコード内のプロパティに一々ステージ上のMovieClipのインスタンスを宣言するのが面倒という場合は、Sampleクラスをダイナミッククラスにすればよいようです。プロパティとして mc を宣言していなくても、Sampleクラス内では mc インスタンスを制御できるようになります。但しコンパイル時のチェックが甘くなるので注意。

参考 akihiro kamijo
dynamic クラス

[ FLASH ] [ tips ] 2006年07月10日 15:29 | コメント (0) | トラックバック

FLASH update ピンボール作成7 ドット背景組み込み

ドットで補正した背景画像を組み込み。
バーとボールはまだベクターデータのままです。
この箇所に衝突した際、この動作を行う、といった処理を可能にしました。現在はキノコ台にぶつけるとキノコがひょっこり表示するようになっています。

▽続きを読む

[ FLASH ] [ update ] 2006年07月08日 23:30 | コメント (0) | トラックバック

ETC FLASH MOVABLE info サーバ移行完了

ドメインそのままにサーバを移行しました。
移行先サーバは「さくら」です。プレミアムプランに申し込みました。
スタンダードプラン(月1000円)は1日10GBくらいの転送量、プレミアムプラン(月1500円)は1日30GBくらいの転送量を目安としているそうなので、値段のわりにかなりのものだと思います。転送量に困っているFlashサイトにはなかなかよさげなサーバではないでしょうか。

参考 : http://q.hatena.ne.jp/1143379181

ドメインそのままのサーバ移行作業は初めてなのでどうなるのか不安でしたが、なかなかすんなりと移行できてよかったです。
ただ、ブログの移行に関してはデータベース(DB)の設定の箇所で手間取りました。以前使用していたDBのバージョンと違うのかどうか、どうもさくらのサーバでは設定が認識してくれず、仕方がないのでDBを初期化し一からテンプレート等の設定をし直す事に。各エントリーも読み込みなおしを行いました。各エントリーを一から読み込みなおしてしまったため、エントリーのURLが以前のものと大分変わってしまったかもしれません…。すみませんすみません。
今後サーバ移行はしたくないものです。

「OH! DANGO! JAM」に関しましてはそろそろ公開を再開します。アクセスも落ち着いてきました。CGIを修正し、負荷はだいぶ軽減できたと思います。ドメインはそのままなので、皆さんのセーブデータは保持できました。

[ ETC ] [ FLASH ] [ MOVABLE ] [ info ] 2006年06月29日 22:09 | コメント (9) | トラックバック

ETC FLASH info サーバ問題困った 転送量とCGI

komatta.gif
Flashゲーム「OH! DANGO! JAM」にアクセスが殺到し公開停止することになってしまいましたが、再び公開するにはどうしたらよいか色々考えてみました。
しかし考えれば考えるほど、再び公開する事が困難ではないかと感じてきました。

現在 一日の転送量目安が200MBのサーバをレンタルしています。「OH! DANGO! JAM」のファイル容量は約3.5MBほどあります。つまり、60~70人ほどの方が一日に「OH! DANGO! JAM」にアクセスしただけで200MBの転送量を超えてしまっていることになっておりました。今までもかなり超えてしまっていたようなのですが、大目にみてもらっていたようです。

ここで、おとといから昨日にかけて「OH! DANGO! JAM」が各所のサイトでとりあげられ、昨日の午前中には1000人以上のアクセスがありました。その結果、転送量が5GBを超えてしまうという事態が起こりまして、サーバ管理の方から連絡を受け「OH! DANGO! JAM」の公開を即停止することになりました。

以前、古くに作成したゲームが同じように各所で取り上げられ、一日に一万人以上の人がアクセスしたことがありました。そのゲームは容量が小さく大事にはいたりませんでしたが、「OH! DANGO! JAM」で一万人となると単純に50GBほどの転送量が必要となります。一日で50GBもの転送量を許容する安いレンタルサーバなどありません。5GBくらいが限度でしょうか。
転送量無制限のサーバをレンタルしようと考えましたが、無制限とはうたっているものの 転送量目安というものを設定しているようで、実際にその転送量を超えると結局制限をかけられたりですとか、課金が発生するといったところがあるようです。

参考 : 「転送量無制限」というのは本当に無制限なの?


今回のような大量の転送量を叩き出してしまうと、他の同じサーバを借りている人へも迷惑がかかり、これを繰り返すと、サーバ管理の方からアカウント停止処分やアカウントを削除されてしまいます。
つまり、今後容量の大きなゲームを作成したとしても、どこかアクセスの多いサイトに紹介された時点でアカウント停止処分になる恐れがあるため、そのゲームを公開することができなくなってしまうという事態におちいってしまっております。


更にもう一つ、転送量の問題の他に cgiへのアクセス過多も問題となっています。「OH! DANGO! JAM」にはネットワーク処理を用い、データの登録やランキング機能、他のプレイヤーのキャラクターと戦うことが可能な機能を盛り込んでおります。
cgiへのネットワーク処理で確かに作り的にややおざなりでまずい箇所があるので、そのところは修正する予定です。しかし、cgiはアクセスがあるたびに処理プロセスが発生するため、極力cgiへのアクセスを減らすような作りにしても、遊ぶ人が多ければ多いほどサーバに大きな負荷をかけることになってしまいます。
転送量は許容範囲内であってもcgiでサーバに高い負荷を与えると同じくアカウント停止/削除処分になってしまいます。


これら転送量問題とcgiの問題が解決しない限り「OH! DANGO! JAM」の再公開は見送りです。
アクセス過多対処として、ゲームファイルにアクセスする数に制限をかける、といったことがよさそうな気がしますが、そのようなことは可能なのですかなあ。多くの人に遊んでもらいたいが制限をかけねばならないというのはジレンマでありますが。

他に、ゲームデータの問題としまして、サーバを移行することになった際は まこと申し訳ないことに皆さんの今まで遊んでもらったデータをリセットすることになってしまうかもしれません。「OH! DANGO! JAM」はFlashのSharedObjectという機能を用いてデータ保存機能を実現させているのですが、ファイルを設置しているドメインが変更されると、異なるドメインのファイルデータを呼び出すことができなくなってしまうのです…


ああ、どないしましょう。

[ ETC ] [ FLASH ] [ info ] 2006年06月23日 19:46 | コメント (9) | トラックバック

ETC FLASH update OH! DANGO! JAM アクセス過多により一時公開停止

じっくり作成したゲーム「OH! DANGO! JAM」ですが、アクセス過多により転送量を遥かにオーバしてしまい、一時公開停止することとなりました。
ゲームのファイルサイズが大きいため、少しでも遊んでくださる人が増えると、転送量制限を越えてしまう状況です。再び公開するには、転送量の制限のかからないサーバに移行するしか方法がなさそうです。

只今、鯖移行の為に調査中。

[ ETC ] [ FLASH ] [ update ] 2006年06月22日 20:11 | コメント (8) | トラックバック

FLASH GRAPHIC update ピンボール作成6 背景ドット化途中

ping.png

Illustratorで作成した背景画像をドットで補正+α。
もう少し描き込んでいきます。

[ FLASH ] [ GRAPHIC ] [ update ] 2006年06月18日 21:46 | コメント (0) | トラックバック

FLASH update ピンボール作成5 仮背景組み込み

Illustratorで作成した背景画像をビットマップ化してFlashに組み込み。
きちんとピンボールゲームっぽい動作になるかどうかの確認です。簡単な音も鳴るようになっています。

▽続きを読む

[ FLASH ] [ update ] 2006年06月11日 15:04 | コメント (0) | トラックバック

FLASH GRAPHIC update ピンボール作成4 背景作成途中

ping_rafu.png

ここ二週間ほどじっくりと背景画像を作成しているのですが、なかなか納得いくものができず一旦アップ。どうもまとまりがでないので、闇雲に作ったパーツを配置していくのではなく、もう少し既存の物(家具等)を元にパーツをデザインしたほうがいいのかもしれないと考え中。
画像はIllustratorで作成しているので線がややゆるめな感じですが、最終的にはビットマップ化してドットで描き直しメリハリをつける予定です。

[ FLASH ] [ GRAPHIC ] [ update ] 2006年06月06日 20:02 | コメント (2) | トラックバック

FLASH tips update ピンボール作成3 複雑な地形の仮背景組み込み

暫定的に複雑な地形の背景を組み込んでみました。
ピンボールゲームらしく動作するかどうかの検証用です。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年05月23日 23:24 | コメント (0) | トラックバック

FLASH update ピンボール作成2 ステージスクロール

ボール位置により、背景全体をスクロールするようにしました。
心配していた24fpsによるカクカク感もさほどないようです。

▽続きを読む

[ FLASH ] [ update ] 2006年05月21日 01:44 | コメント (0) | トラックバック

FLASH update ピンボール作成1 プロトタイプ

ラインオブジェクトの他に円オブジェクトを配置し、ピンボールっぽいものを作成。

▽続きを読む

[ FLASH ] [ update ] 2006年05月20日 16:43 | コメント (0) | トラックバック

FLASH tips ピンボールバーの処理 ボールがバーの裏表どちら側に衝突したか外積を用いて調査

以前作成したピンボールバーのサンプルにまだもろもろバグがあるようで、そのバグの原因を解決するために、ボールがバーの裏表どちら側に衝突したかを調べる必要がでてきました。
ボールがバーの裏表どちら側に衝突したかを調べるには、ベクトルの外積の性質を利用します。

▽続きを読む

[ FLASH ] [ tips ] 2006年05月19日 00:30 | コメント (0) | トラックバック

FLASH tips update レーザー状に反射 鋭角~鈍角頂点での反射

レーザー状に反射を行う処理で 複数の衝突対象オブジェクトが一点で交わっており、その一点にボール軌道が重なった場合、いらぬ方向に跳ね返ってしまっていたバグを修正。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年05月14日 19:29 | コメント (0) | トラックバック

FLASH tips vodafone FlashLite デバイスフォントに白縁取りの罠

FlashLite1 vodafoneのFlashPlayerにて問題発生。
どうやらデバイスフォントにデフォルトで白縁取りがついてしまう模様。
以下の図はデジカメで撮影した画像です。

※追記 2006/7/11
聞いた話で確認は取っておりませんが、V904SH以降のシリーズは白縁取りがつかなくなる仕様に変更された模様。これまた注意。

▽続きを読む

[ FLASH ] [ tips ] 2006年05月13日 16:13 | コメント (0) | トラックバック

FLASH tips update ピンボールバーの処理 途中3

両バーを実装&背景ラインオブジェクトを暫定的に配置。
背景ラインオブジェクトを配置してみてボールの自由落下との衝突処理を行ってみたところ、以前作成していたレーザ反射を行うためのライブラリにバグが見つかりました。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年05月08日 03:12 | コメント (0) | トラックバック

FLASH tips update ピンボールバーの処理 途中2

途中経過2。バグ修正と各反射に必要なパラメータ調整、並びに衝突反射処理の処理内容変更。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年05月06日 17:07 | コメント (0) | トラックバック

FLASH tips update ピンボールのバーの処理 途中1

途中経過1。ようやくなんとか形になりました。

▽続きを読む

[ FLASH ] [ tips ] [ update ] 2006年05月04日 14:38 | コメント (0) | トラックバック

ETC FLASH GRAPHIC info 行列のお勉強 雑記

gyouretu.png

ピンボールのバーの動作は、点と点とを結ぶ線を回転させて実現させる予定です。MovieClip._rotationで回転させるという方法が考えられますが、他に以前ちらっと見たMatrixクラス(行列を扱うクラス)を思い出し、これを用いることにより回転動作処理を行うことができるのでは、と行列についてお勉強開始。行列は3D表現を行いたい時にも役に立つに違いないであります。

行列に関しては、以前購入した「ゲーム開発のための数学・物理学入門」の本にばっつし書いてありました。いやあ本当に初心者にわかりやすい いい本です。以前は何のことかさっぱりわからなかったMatrixクラスに関するヘルプの説明も、この本のおかげでようやく理解できました。ただしこの本には行列の応用に関しては触れられていないので、複雑な処理を行うには別の参考書が必要になりそうです。

MatrixクラスはFlash8からの使用可能なので、Flash7でも利用できるよう独自にMatrixクラスを作成。
作成に関しては、以下のサイトが参考になりました。

Flashゲーム講座 & ASサンプル集
 3行3列のマトリックスの関数を作ろう
 2Dのアフィン変換を使ってみよう

[ ETC ] [ FLASH ] [ GRAPHIC ] [ info ] 2006年04月23日 01:26 | コメント (0) | トラックバック

FLASH tips ピンボールのバーの処理 バー動作時のボールへの衝突処理

バー動作時ボールへの衝突処理を行うサンプルswfを作成。作ってみて、以前のメモでは足りなかった考えがありましたので、それを追加しました。

▽続きを読む

[ FLASH ] [ tips ] 2006年04月16日 16:55 | コメント (0) | トラックバック

FLASH tips ピンボールのバーの処理 接線速度取得

ピンボールのバーの処理における前準備。バーの回転運動における接線速度取得処理を実装しそれを表示するサンプルを作成しました。

▽続きを読む

[ FLASH ] [ tips ] 2006年04月10日 00:37 | コメント (0) | トラックバック

FLASH TOOL info tips FDTでRefactorコマンドが欲しい

↓こちらのサイトのクラス名に関する記事を見まして、

GameManagerに代わる良い名前を
クラス命名のアンチパターン

私も何とかしないとなあとクラス名やメソッド名に てこ入れ作業を行っております。しかし、変更する度に発生する全ソースを書き換え作業をなんとか簡単にできないものかと考えました。

Eclipseにて、ソースコードのメソッド名等を変更したい場合、そのメソッドを参照している全てのソースコードを一括で書き換えてくれるRefactorコマンドというものがあるようなのですが、FDTで探してみた所そのコマンドは見つからず。

Flash Explorerから右クリックのRenameコマンドでクラス名を変更すると、そのクラスファイル内のクラス名は自動で変更してくれるようですが、それ以上の機能はないようです。ううむ、なんとかしたい。もどかしい。
ASDT もインストールしなおして見てみましたがRefactorコマンドはありませんでした。勢いあまって今まで手をつけていなかった FlexBuilder2 もインストールして調べてみましたがない模様。


しかしてクラス名をよくよく考え直すと難しいものがありますね。手本となるパターンがわからないので、何が正解かが判断つきにくいです。現在、パッケージがからんだ場合どのようなクラス名を設定してよいかという所に迷っています。

blockパッケージのBlockCollectionクラスというものを作成していたのですが、 block.BlockCollection ではなく block.Collection とするべきなのかどうなのか等。現在は block.Collection の方向で進めておりますが、そもそもCollectionというクラス名でもいいのかどうかなども考えてしまいます。

他参考サイト
Eclipseの自動リファクタリング・フィーチャーをなぜ、どのように使うか

[ FLASH ] [ TOOL ] [ info ] [ tips ] 2006年04月08日 18:27 | コメント (0) | トラックバック

FLASH tips 衝突判定高速化 ステージ区画分け

現在習作として作成しているピンボールゲームでは、ステージを一定のサイズに区画分けし、オブジェクト同士の衝突判定の高速化を図ることを考えております。
以前書きました「ブロック崩し衝突判定の高速化のために」のエントリーの応用のような感じを採ります。

▽続きを読む

[ FLASH ] [ tips ] 2006年04月07日 10:02 | コメント (0) | トラックバック

FLASH info 週末はFlash表示タグをJavaScript書き出しへ

Flash-japanより
そろそろweb上のフラッシュが見れなくなるようですが…
Internet Explorerの仕様変更でFlashサイトを開くとメッセージが

ITMediaより
MS、IE変更に60日の猶予――混乱懸念の声も
「ユーザー体験を悪化させるIE修正は恥」とEolasのCEO

60日間の猶予ってなんでしょう。ダイアログを表示?するかどうかをユーザが任意に切り替える事が可能ということなのですよね。デフォルトではどちらの状態なのだろうか。多分ダイアログが表示されるほうがデフォルトのような気も。

以前この話題で騒がれたときに当面先延ばしと聞いていたので、その先延ばしの間になんとかなるだろうと淡い考えを抱いておりましたが、なんともならなかったのですね。

X-LABOに表示しているFlashはJavaScriptで表示させているのでよかったです。記事一個一個全て修正するなんて頭痛くなってしまいます。
週末は団子一味のFlash表示部分の修正作業を行わなくてはと思います。

[ FLASH ] [ info ] 2006年04月06日 12:27 | コメント (0) | トラックバック

FLASH GRAPHIC tips ピンボールのバーの処理 メモ

ピンボールのバーの処理において、まとまった考えをメモ。
まだ実装部分にほとんど手を触れていないので、間違っていたり考えが足りない部分がある恐れがあります。

▽続きを読む

[ FLASH ] [ GRAPHIC ] [ tips ] 2006年04月03日 19:49 | コメント (6) | トラックバック

ETC FLASH GRAPHIC info ピンボールのバーの処理 雑記

hozon.png

ピンボールのバー(フリッパー)とボールの衝突と反射処理におきまして、ここ何週間か「ゲーム開発のための数学・物理学入門」を読んだり本屋に行って理解できないながらも物理本をパラパラ見つつ頭を沸騰させ右往左往しておりました。
頭に知識を詰めて、寝てふとんの中で何かを閃き、次の日ノートに図を書き記し、ああやっぱりダメだ…を繰り返す中、昨日ようやくこれでいけるだろうというロジックが多分繋がりましたので実装を開始することに。繋がったものを見てみると 結構簡単な事だったんだな、と思いましたが、その答えに至るまでがなんとも苦行の道のりでした。

本に書いてある例題は理解できるものの、応用となるとやはりむずかしいです。教科書には色々な公式が書かれていますが、いざこのゲームの動作処理を行いたいという時どの公式を用いればよいのかわからず時間を消費してしまいます。

今回、衝突と反射処理の練習として考えておりますピンボールゲーム製作におけるリファレンス本やサイトがあれば、そこに記されている必要な知識のみを学習すればよいので時間の浪費も抑えられそうです。しかしピンポイントな参考となるものがない場合、どの公式を利用すればよいのかがわからず手広くあれもこれもと頭に詰め込み、答えが繋がるまで頭の中で数式を走らせ、中途いびきをかきつつも気が付けば結構時間を要してしまっているなんて事も度々。

手広く調べることで予備的な知識は身に付いていいのかもしれませんが、昔学校で勉強した事と同じように 得た知識は年中利用しないと忘れてしまうので、現在必要以上のものを覚える事はなんだか時間がもったいない感があります。
個人製作物ならば、時間がかかってもかまわないかもしれませんが、業務でのことだったりすると相当あせってしまいそうです。無理なものは無理、無理っぽいものも無理とはっきり言わねばなりませんね。

[ ETC ] [ FLASH ] [ GRAPHIC ] [ info ] 2006年03月21日 05:38 | コメント (0) | トラックバック

FLASH tips レーザー状に反射2

前回に続き衝突判定と反射処理の習作。
今回は衝突対象オブジェクトの各点もドラッグ&ドロップ可能にしました。

▽続きを読む

[ FLASH ] [ tips ] 2006年03月14日 02:54 | コメント (0) | トラックバック

FLASH tips レーザー状に反射

二点を結ぶ線分をレーザー状に反射させる為の処理を作成。
レーザー反射処理が作成できたことにより、1フレーム間での1対多数のオブジェクトの衝突判定と反射処理が可能になります。

▽続きを読む

[ FLASH ] [ tips ] 2006年03月11日 15:57 | コメント (0) | トラックバック

FLASH tips まるめ虫

円と線との衝突判定処理等で、どうも期待する結果が得られない場合があり、traceを書きまくって検証しおりました。traceウインドウでは変数Aの値と変数Bの値とが同値にもかかわらず、比較を行うとfalseを返す場合があるのです。なんだこりゃあっ と何時間も頭を沸騰させておりました。

そういえば OH! DANGO! JAM でもデータの妥当性チェックの時に、小数点以下の数値を含む変数が同値にもかかわらず比較を行うとfalseを返す場合がありました。

ここで以前どこかで見た「まるめ虫」について思い出し、検索。

F-site
まるめ虫
二星まるめ虫

恐らく上記まるめ虫に近い現象が起こっているのだろうと思い、Math.roundで変数を囲うことにより数値の比較がようやく期待する結果を返すようになりました。
traceウインドウ上では整数として表示されていても、小数点以下の数値を含んでいる場合があるということなのですかなあ。そうならば、やっかいです。

物理計算においての数値の比較には注意が必要ですね。

以下雑記。

現在は今まで作成していた交差判定メソッドなど全て作り直しております。(バグも結構ありました…)
今までObjectクラスにダイナミックにプロパティを追加し、それを点や線や円やベクトルを示すものとして処理してきましたが、それぞれ独立したクラスにしたほうが便利だと感じ、PointクラスやVectorクラスといった各専用のクラスを作成中です。独自の簡易geomパッケージを作成する方針で進めています。

追記)
ああ、でも実際に小数点を含むデータの比較の場合、Math.roundで丸めてしまうとまた問題がでますなあ… どうしよう。表示の誤差がでない範囲で、小数点以下3桁以降は切り捨てといった処理を行えばいいのだろうか。

[ FLASH ] [ tips ] 2006年03月08日 00:29 | コメント (2) | トラックバック

FLASH GRAPHIC update OH! DANGO! JAM アップデート 2006/3/5

ie-wait.gif ie-run.gif ie-attack.gif ie-magic.gif ie-defense.gif ie-down.gif ie-ko.gif ie-sp.gif

キャラクターのイエティを追加しました。ドーモ君っぽい。
昔のアクションRPGのゲームで背景に登場していたキャラクターです。スライム型団子スランゴをぷりんぷりん投げてきます。キャラが弱かったのでサンタの帽子をかぶせて取り繕いました。


そして!

nk-wait.gif
遊画堂 りょうへいさんのキャラクター「猫剣士」が遂におだんごジャムに参戦!
団子達はその剣で竹串のごとく貫かれてしまうのか…!?
猫剣士の勇姿は是非ゲーム内でご確認ください。

どちらのキャラクターも準レアキャラなのでアイテムも比較的取りやすいキャラクターとなっております。

OH! DANGO! JAM
http://www.dango-itimi.com/jam/

[ FLASH ] [ GRAPHIC ] [ update ] 2006年03月05日 13:28 | トラックバック

FLASH tips 円に対する線分の反射

前回のベクトル反射と今まで作ってきたもろもろの円関連の処理を行うメソッドを利用し、円に対する線分の反射処理を行い、反射に必要な各データを得られるメソッドを作成しました

▽続きを読む

[ FLASH ] [ tips ] 2006年03月02日 01:14 | コメント (0) | トラックバック

FLASH tips ベクトル反射

以前 斜面へのボールの反射方法を考えるために、ない頭を沸騰させて「斜面への衝突判定と反射」という記事を書きました。
今回その方法よりもスマートな方法で解を導き、反射に必要な各データを得られるメソッドを作成しました。

▽続きを読む

[ FLASH ] [ tips ] 2006年03月01日 19:12 | コメント (0) | トラックバック

FLASH GRAPHIC update OH! DANGO! JAM アップデート 2006/2/26

ob_wait.gif ob_run.gif ob_attack.gif ob_defense.gif ob_down.gif ob_ko.gif

レアキャラクター オバケボーイを追加しました。
男の子の帽子がとれたバージョンです。技はどれもかっこいいものにしました。その他のグラフィックはゲーム内でご確認ください。必殺技は団子ロボを召喚します。
おならプーたんと同じくらいの強さに設定しましたので、比較的倒しやすいのではないかと思います。

OH! DANGO! JAM
http://www.dango-itimi.com/jam/

[ FLASH ] [ GRAPHIC ] [ update ] 2006年02月26日 19:28 | コメント (7) | トラックバック

FLASH tips 円と線分の交差判定

こちらのサイトによると円と線分の交差判定方法は、

線分の始点から終点へのベクトルを v、 線分の始点から球の中心へのベクトルを c とします。 
v・c<0 の時、球の中心が線分の始点よりも線分から遠くにあるので、
c の長さが球の半径よりも小さければ交差と判定します。 
v・c≧0 の時、v・c と v2 の長さを比べます (v 方向での c の長さと v の比較)。 
v・c の方が大きければ、球の中心が線分の終点よりも線分から遠くにあるので、 
線分の終点と球の中心の距離の 2 乗を求めて、 球の半径の 2 乗よりも小さければ交差と判定します。 
v2 の方が大きければ、球の中心から線分に降ろした足が線分上に 存在するはずです。
c2-(v・c/v2)*v・c でその長さの 2 乗が分かり、 球の半径の 2 乗よりも小さければ交差と判定します。 

とのことで、詳しくは理解していませんがActionScriptに移植しました。

▽続きを読む

[ FLASH ] [ tips ] 2006年02月23日 03:14 | コメント (0) | トラックバック

FLASH GRAPHIC update OH! DANGO! JAM アップデート

kt-wait.gif kt-defense.gif kt-attack.gif

レアキャラのカバ天使を追加しました。他の画像はゲーム内にてご確認ください。
カバが多くてごめんなさい。描くのが楽なのです!

OH! DANGO! JAM
http://www.dango-itimi.com/jam/

[ FLASH ] [ GRAPHIC ] [ update ] 2006年02月18日 22:12 | コメント (2) | トラックバック

FLASH GRAPHIC update ついに完成! OH! DANGO! JAM

長らく作っていたJamGameがついに完成。
「OH! DANGO! JAM」というタイトルになります。

URLはこちらです。Flashギャラリーにそのうちリンクを貼ります。
http://www.dango-itimi.com/jam/

まだ大規模なテストは行っていないため、不具合が発生する場合があります。当面ベータ版ということでお願いします。致命的なバグが発生した場合、プレイデータを消去させていただく場合があります故、ご了承ください。
それと、完成とはしましたが引き続きキャラクターを何体か追加していく予定です。

未公開だったゲーム画面のスクリーンショット。モザイクは自主規制。
キャラクターの中には派手な必殺技を使用するレアキャラクターがおります。そのレアキャラクターの変身アイテム取得に是非挑戦してみてください。
jam1.png jam2.png

jam3.png jam4.png

jam5.png jam6.png

jam7.png jam8.png

製作・テストプレーにご協力いただいた方々へ、今まで長い間お付き合いいただきありがとうございました。

Special Thanks
拓さん
HACCANさん
りょうへいさん
竹さん

▽続きを読む

[ FLASH ] [ GRAPHIC ] [ update ] 2006年02月12日 15:56 | コメント (37) | トラックバック

FLASH tips 円と直線の交点を求める

ちまちまと勉強中。
↓こちらのサイトにあったC言語用のものをActionScriptにベタ移植。ひとまず自分の使うと思われるものだけを移植させてもらいました。
幾何計算 % C言語ライブラリー
中の処理で何を行っているか理解できていない部分があります故、移植内容にバグがありましたらごめんなさい。

▽続きを読む

[ FLASH ] [ tips ] 2006年02月09日 13:32 | コメント (0) | トラックバック

FLASH GRAPHIC update JamGame(仮題)作成中14

km_wait.gif km_run.gif km_attack.gif km_defense.gif km_ko.gif

ゲームで使用するカバとしらた丸の画像。
レアキャラ故、他のグラフィックはゲーム内でご確認ください。
必殺技はベラボーなものにしました。

[ FLASH ] [ GRAPHIC ] [ update ] 2006年02月05日 22:58 | コメント (0) | トラックバック

FLASH TOOL tips mtasc1.12ではクラス内のローカルメソッドからprivateプロパティにアクセス可能に

mtasc

最新バージョンのmtasc1.12内にあるCHANGES.txtによると、

allowed access to private variables inside local defined functions

と1.12の変更点について記されています。これは個人的にかなりうれしい変更点です。
これは何かといいますと、例えば次のような処理を行うクラスがあるとします。

class Test{

	public var data:Number = 1;

	public function Test( root:MovieClip ){

		var scope:Test = this;
		root.onEnterFrame = function(){ trace( scope.data ); };
	}
}

ここで変数dataが、Testクラス内でしか用いられず、他のクラスからは参照されない場合、修飾子はpublicではなくprivateにすべきです。しかし今までのmtascでは、この変数dataの修飾子をprivateにすると、文法が間違っているというエラーメッセージが表示されswfをコンパイルすることができませんでした。( 変数rootはMovieClipクラスでTestクラスとは違うため、MovieClipクラスのメソッドからTestクラスへのprivateなフィールドにはアクセスできません、という解釈だったのではないかと思われます。 )

なので今まで私は dataの修飾子をprivateにする場合、

var scope:Test = this;

という記述を

var scope = this;

という型宣言をはずした表記にし、コンパイル時のエラーチェックを回避する手段を用いていました。しかしこれですと scopeの型が指定されていないため、コンパイル時 変数のタイプミスのチェックなどは行ってくれず、バグが眠ってしまう可能性がありました。

class Test{

	private var data:Number = 1;

	public function Test( root:MovieClip ){

		var scope = this;
		//dataをdetaとタイポ。コンパイラーはエラーに気付かず。
		root.onEnterFrame = function(){ trace( scope.deta ); };
	}
}

この問題のみが一点ものすごくネックに感じていたのですが、mtasc1.12からはより堅固で安全なコーディングが可能になりそうです。コーディングスタイルもようやく定まりそうです。

[ FLASH ] [ TOOL ] [ tips ] 2006年02月03日 21:07 | コメント (0) | トラックバック

FLASH GRAPHIC update JamGame(仮題)作成中13

kn_wait.gif kn_run.gif kn_attack.gif kn_magic.gif kn_defense.gif kn_sp.gif kn_down.gif kn_ko.gif

ゲームで使用するキノッパの画像。必殺技はBダッシュ。仲間の犬の名前はトリュフといいます。
某所で書いたキノッパの簡単なキャラ設定を引用。

>・頭のお皿にキノコが生えてしまったが手が短くて取ることが出来ず
>・お皿に水をかけるとキノコが生長してしまうというジレンマが発生する
>・上記理由によりいつも不機嫌そうにゲーゲー鳴いている

目標にしていた通常キャラグラフィックがそろいましたので、この後は某所でJamGameのクローズドベータテストを行います。テスト中にレアキャラを二体ほど作成し完成です。

[ FLASH ] [ GRAPHIC ] [ update ] 2006年02月02日 19:30 | コメント (0) | トラックバック

FLASH GRAPHIC tips ムービークリップ 縁取り フィルタテスト

イラストレータでキャラクターを描いてそれをFlashに読み込み利用する、といったことをよく行うのですが、キャラクターの線に少し貧弱な印象がある場合、Flash8から利用可能なフィルタを使うと結構効果的になるのではないかなあとテスト。

▽続きを読む

[ FLASH ] [ GRAPHIC ] [ tips ] 2006年01月24日 19:00 | コメント (0) | トラックバック

FLASH info Amazon ECS担当者不在中

Amazonのウェブサービス(AWS3.0)にて、FlashのWebServiceConnectorからカスタマーレビューが取得できない状態が続いてから早三ヶ月。おかげでリスのコメントが一向に表示することができていません。
不具合等を報告するAmazonWebService専用のDiscussion Boadに質問を投げてみたもののずっと反応が無い状態。AmazonWebサービスブログも更新が2005年の8月から停止中。
日本の担当者の人が辞められたのではというメッセージが投げられていましたが、どうなってしまっているのですかなあ。
ECS4.0に切り替えてみるのも手ですが、今回のように突然データが取得不能になる可能性もあるので、その時自分の作りが悪いのかウェブサービス側のシステムが異常なのかが判断つかず時間を多く消費してしまいそうです。

AmazonWebサービスブログ
Web Services Discussion Board(日本用)

[ FLASH ] [ info ] 2006年01月24日 00:00 | コメント (0) | トラックバック

FLASH tips 円と直線の交点を求めるには…

円と直線の交点の座標を求めるためにウロウロ検索しておりましたところ、ちょうど求めたいサンプルプログラム(C言語)を載せているサイトがありました。
幾何計算 % C言語ライブラリー

しめしめこいつはいただきだぜ!と思ったのですが、その中で一点だけ困った点が。

円と直線の交点を求めるlncl関数にて

if(fgsq < accy){
	return (3);
}else{
	…

という記述があります。説明によるとlncl関数の戻り値は、『成功すると交点の数、交点が存在しないと-1を返します。』とあります。
交点が3つというのはなんだろう?
円と直線の交点は最大で二つまでになるはずですが、ソースを見て変数fgsqが何を意味しているか私の知識では理解できないので、これはどうしたらいいものか。返す交点の座標を設定する前に関数を終了させているので-1(エラー)の間違いですかなあ。

このページには二直線の交点の計算プログラムもあり、オーバーフローを防ぐための仕組みもあるようなので、以前私が作ったものよりこちらを使ったほうがよさそうですね。でも精度パラメータのaccyの値はどれくらいに設定したらいいのだろうか。

C言語によるサンプルなので、はてさて上手くASに移植できるかどうか。

[ FLASH ] [ tips ] 2006年01月23日 13:39 | コメント (0) | トラックバック

FLASH GRAPHIC update JamGame(仮題)作成中12

p_wait.gif p_run.gif p_attack.gif m_sp.gif

ゲームで使用するバッテンズの画像。やや大きめで登場。
大きめなキャラクターとして団子ロボを登場させようかと考えましたが、動かすのが大変そうなのでやめました。
他、一番右はしらた丸の必殺技画像。

[ FLASH ] [ GRAPHIC ] [ update ] 2006年01月20日 22:13 | コメント (0) | トラックバック

FLASH info tips FlashLiteはメールを受信したり電話がかかるとアウト

FlashLite1.xでは、どうやらswf再生中にメールを受信したり電話がかかってきたりすると、再生が途絶えアプリ選択画面に戻ってしまう あるいはswf再生ヘッドがフレーム1に戻ってしまうようです。
業務にて結構長く遊べるゲームを作っていたのですが、この仕様がややネックに。

iアプリは起動中に他のアプリケーションが立ち上がっても、その他のアプリケーションの起動終了後、元の状態へ復帰することが可能です。FlashLite2ではiアプリと同じような仕様になってほしいところ。せっかく高機能なゲームが作成できるようになるのですから!

後、本日発表された4GBハードディスク搭載の「W41T」のケータイWatchの記事で、FlashLite1.2対応と書かれているのですが、これはFlashLite1.1の強化バージョンなのですかなあ。それとも間違いなのかなんなのか。

http://k-tai.impress.co.jp/cda/article/news_toppage/27393.html

[ FLASH ] [ info ] [ tips ] 2006年01月19日 16:54 | コメント (2) | トラックバック

FLASH GRAPHIC update JamGame(仮題)作成中11

g-wait.gif g-run.gif g-attack.gif g-defense.gif g-magic.gif g-down.gif g-ko.gif g-sp.gif

ゲームに使用する女の子の画像。くるくる傘をまわしてたもれ。

[ FLASH ] [ GRAPHIC ] [ update ] 2006年01月15日 14:21 | コメント (0) | トラックバック

FLASH info FlashLite2 雑記

FlashLite2の話題もちらほら出始め、何か一品ほど作っておけたらいいなと考えております。
ドコモやAUでFlashLite2が採用されたら団子一味モバイルページをオープンしますよ!団子一味の小ささは、小さい携帯端末向けに作られていたと言っても過言ではありません…!

以下携帯ゲーム開発に関する雑記をつらつらと。

▽続きを読む

[ FLASH ] [ info ] 2006年01月14日 00:01 | コメント (2) | トラックバック

FLASH GRAPHIC tips BitmapData習作 残像拳

スト2等でよくみるスーパーコンボ時のキャラクターの青い残像エフェクト。現在作っているゲームで あのようなイメージの残像を表現したいなあと、専用のエフェクトクラスを作成。
簡単な残像表示を行うものだけのたいしたものでもありませんが、サンプルとクラスを置いておきます

▽続きを読む

[ FLASH ] [ GRAPHIC ] [ tips ] 2006年01月13日 02:37 | コメント (0) | トラックバック

FLASH GRAPHIC update JamGame(仮題)作成中10

ヘルプ画面作成。インターフェース画面作成はこれでほぼ終了… 終了にしたいところ。
残りはゲーム中の背景グラフィックとキャラクターグラフィックの作成作業にございます。

ヘルプ画面だけを見る感じなんとなく面白そうに見えますね。実際はどうだかわかりませんが!
私の格ゲー好きな性格がもろシステムに現れております。

e1.png e2.png

e3.png e4.png

e5.png e6.png

e7.png e8.png

e9.png e10.png

[ FLASH ] [ GRAPHIC ] [ update ] 2005年12月20日 19:00 | コメント (1) | トラックバック

<