[ CATEGORY ] RECENT…メインページ・最近の記事一覧

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


FLASH FLASH tips 特定のフォルダ構成をした時にシンボルが壊れる致命的な不具合: Adobe Animate CC

長らく悩まされていた Flash CC もとい Adobe Animate CC での致命的な不具合の再現方法が判明しました。業務にて再現方法を教えていただいた形となります。Adobe フォーラムのほうへは報告済み。

この不具合は、ライブラリ内で特定のフォルダ構成をした場合、100% 発生します。シンボルが壊れるため、致命的なエラーです。

再現手順は以下の通りです。

1)画像のようなライブラリ構成の fla ファイルを作成

2)symbol1 に bitmap1 を配置
3)ファイルを保存
4)ライブラリの folder1 を削除
5)ファイルを保存して閉じた後、再度 fla を開く
6)symbol1 が壊れる

同名のフォルダが親に存在する場合、発生します。今回の場合は aaa というフォルダが影響しています。

symbol1 には bitmap1 が配置した事にはなっておらず、symbol1 を開こうとしても開けなくなります。私のようなドット絵ビットマップを大量に用いる製作者にとっては脅威の不具合です。

致命的なエラーのため Adobe さんには、早急にこの不具合を修正してくれることを望みます。

[ FLASH ] [ FLASH ] [ tips ] 2017年09月29日 18:47 | コメント (0) | トラックバック (0)

ETC Geforce Experience 3.x での強制アップデートを行わないようにする

(1) 以下の setup.exe ファイルを setup.exe.end といった具合に適当な名前にリネーム
C:\ProgramData\NVIDIA Corporation\Downloader\latest\setup.exe

(2) host ファイルに次の行を追加する
127.0.0.1 services.gfe.nvidia.com

(3) 完了

---
参考) Geforce Experience Forum
https://forums.geforce.com/default/topic/862779/geforce-experience/how-do-i-disable-geforce-experience-auto-update-/post/5073543/#5073543
---

私の PC 環境では GeForce_Experience_v3.1.2.31 は正常に動作するのですが、それ以降のバージョン(現在は GeForce_Experience_v3.3.0.95)が起動してくれないという不具合に遭遇しています。

[ ETC ] 2017年02月03日 20:16 | コメント (0) | トラックバック (0)

FLASH tips Adobe Animate CC WebGL(Preview) Document の調査と Haxe からの利用サンプル

Adobe Animate CC から利用可能な WebGL Document Preview版の調査と、Haxe からの利用サンプルを作成しました。

サンプル

今回作成した WebGL で表示する簡易ムービーです。5秒ほどのムービーをループさせています。

Adobe Animate CC WebGL Document とは

情報がほとんど無く 自分で使用してみての調査報告となるため、誤っている箇所があるかもしれませんが、その場合はつっこみください。

---

Adobe Animate CC には HTML5 コンテンツを制作するための「HTML5 Canvas Document」と「WebGL Document」の二種類のドキュメント形式があります。

「HTML5 Canvas Document」は CreateJS ライブラリを利用してコンテンツ制作を行います。Adobe Animate CC で作成したムービーの再生も可能です。しかしムービーを WebGL で再生したい場合、MovieClip をスプライトシートで出力する・専用の処理を記述する等 手間が増え、更に複雑な構造のムービーを WebGL で再生するのは難しい状況です。

「WebGL Document」は独自の API により、Adobe Animate CC で作成したムービーをそのまま WebGL 上で再生する事が可能です。複雑な構造のムービーであってもです。ムービー内部で使用されている ビットマップデータは一つの画像に自動的に収められ、ベクターデータは数値として別途出力され描画されます。描画に関しては 「HTML5 Canvas Document」よりも高い機能を持ち合わせています。

以上から WebGL Document は HTML5 版 GAFMedia 的 立ち位置となりそうです。GAFMedia 詳細に関しましては以下の過去記事をご参考ください。
Haxe(Adobe AIR or Flash) から GAFMedia を利用する

Preview 版による問題

現在 WebGL Document は Preview 版となっており、不具合のような動作や問題点が結構あります。これら問題点が解決するまで実用するにはまだ難しいかもしれません。

ビットマップデータを利用すると描画がちらつく

ビットマップデータを利用すると Internet Explorer や Microsoft Edge では描画がちらついてしまいます。Google Chrome ではちらつくことはありません。現状の一番致命的な問題です。

ビットマップデータを拡大すると画像がぼやける

スムージングがデフォルトでかかってしまっています。解除方法がわかりません。解決作としては、初めから拡大したビットマップ画像を利用する等がありますが、データ量に無駄がでてしまいます。

短いサウンドファイルは正常に出力されず

ムービー内に埋め込んだサウンドを再生する事も可能です。しかしサウンドファイルの再生長が短い場合、正常にファイルが出力されず 0KB の mp3 ファイルが出力されてしまいました。

総画像サイズは 2048 x 2048 px まで

コンテンツ内で使用している全てのビットマップを結合した画像サイズが 2048 x 2048 px を超えると、正常に素材出力が行われません。

jQuery との併用の注意

WebGL Document API が記述してある flwebgl-0.2.min.js を定義する前に jQuery 用 js ファイルを読み込んでしまうと、jQuery の $ 記述が認識されなくなってしまいます。併用したい場合は flwebgl-0.2.min.js 定義後に jQuery 利用の記述を行う必要があります。

今回のサンプルで行った問題回避策

サンプルムービーではドット絵(ビットマップデータ)を利用していますが、IE や Edge でも正常に表示するために、一つ一つのビットマップデータをベクターデータ化する、という手間を費やしています。
比較的シンプルなドット絵なのでベクターデータ化しても問題なく、力技とも言えましょう。

Haxe からの利用

WebGL Document をパブリッシュすると、素材用データやライブラリファイルの他、素材を読み込む処理(JavaScript)が記述された html が出力されます。この読み込み処理部分を Haxe で別途記述し github にアップロードしました。JavaScript 処理では イベントハンドラの数珠つなぎ状になっているため、処理を整理しタイマーで順次読み込みを行うような形式に変更しています。

https://github.com/siratama/WebGLDocument

今後 Haxe で WebGL Document コンテンツ制作を行う場合のテンプレート的ファイルとしてご参考ください。

終わりに

WebGL Document が登場してから Preview 版状態が結構長く続いています。今後どうなるのかわかりませんが、今一番に期待できる機能なので、問題点を全て解決し正式版になってほしいものです。

WebGL Document 用 API はそこそこ整っており、ゲームコンテンツにも使用できます。サウンド制御用の API が用意されていない等ありますが、不足分は CreateJS ライブラリを利用する等すれば良しとなりそうです。

Adobe Animate CC WebGL Document API
https://helpx.adobe.com/jp/flash/webgl-runtime-api-help/index.html

[ FLASH ] [ tips ] 2016年09月25日 12:10 | コメント (0) | トラックバック (0)

FLASH update Adobe Animate CC 拡張機能 Linkage 1.0.4: WebGL Document 対応

Adobe Animate CC ライブラリ内の、選択したアイテムのリンケージ設定を一括で行う 拡張機能、Linkage 1.0.4 を公開しました。
WebGL(Preview) Document に対応しています。

https://github.com/siratama/Linkage

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

FLASH tips ShowCase UI サンプル作成と Haxe 利用のポイント

今後の制作物において必要になりそうな UI パーツ Showcase を作成しました。加えて Haxe を利用するポイントを記述します。

■ Showcase 動作サンプル

ボタン押しっぱなしで自動スクロールします。ボタン当たり判定は両側から画面中央近くまであります。

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

使用言語・環境

以下の環境で作成しています。

・Haxe/JavaScript
・JQuery
・SCSS

ソースコード一式は以下に公開しています。
https://github.com/siratama/ShowCaseDom

ポイント

DOM構造を処理側から判別可能になるファイル出力ツールがあると良さそう

今回のサンプルの html DOM 構造は以下となっています。
https://github.com/siratama/ShowCaseDom/blob/master/deploy/index.html

上記に対しクラスファイル Root.hx を用意しました。
https://github.com/siratama/ShowCaseDom/blob/master/src/showcase/dom/Root.hx
これにより、以下のようにプログラムから DOM 構造へアクセスできます。

var root = new Root();
var itemsElement:JQuery = root.showcase.screen.items;

難点は、Root.hx を作成するのは面倒であり、開発中 DOM 構造が変化するたびに Root.hx を書き換える必要があります。よって html の DOM 構造を解析して Root.hx を自動的に出力するようなツールがあると便利となりそうです。これは Flash コンテンツ開発でいうところの、swc ファイルに近いです。

※ファイル出力は行わずとも Haxe のマクロ機能で もしかしたらなんとかなるのかなあ、などとも考えています。
http://qiita.com/shohei909/items/c71f9a8774245319d182

近年では様々なフレームワークが出ており、JavaScript 側から DOM 構造を知ることができる仕組みが用意されているものもある、ようです。

描画処理の分離と enum の利用

今回の Showcase UI では、描画とそれ以外の処理は分離して作成しています。肝となるクラスファイルは以下の三点(MVC)です。
Display.hx : View
Operator.hx : Model
Transmitter.hx: Controller

描画が分離していない処理とは 例えば以下となります。DOM の p エレメントを右に30px移動する処理です。(Haxe JQueryExtern を利用)

class View
{
	public function move(){
		var element = new JQuery("p");
		var positionLeft = element.position().left;
		element.css({left: positionLeft + 30});
	}
}

描画処理を分離すると以下のようになります。実データ(描画位置を示す positionLeft)は Model で持ち、データの加工も Model で行います。

class Model
{
	var positionLeft:Float;
	public function move(){
		positionLeft += 30;
	}
}

View は更新された内容を画面に反映するだけとなります。

class View
{
	public function setPosition(positionLeft:Float){
		new JQuery("p").css({left: positionLeft});
	}
}

Model から View へのデータ受け渡しは Controller を介して行います。Contoroller にて、Model 内どのデータに変更があったのか、あるいは View の どの表示更新を行えばよいか の判定を行うには enum を利用すると便利です。

例えば Model を以下のようにします。「どの変更があったのか」「変更されたデータは何であるか」を enum に設定します。

enum Event
{
	NONE;
	MOVE(positionLeft:Float);
}
class Model
{
	private var event:Event;
	public function getEvent():Event
	{
		var n = event;
		event = Event.NONE;
		return n;
	}

	var positionLeft:Float;
	public function new(){
		event = Event.NONE;
	}
	public function move()
	{
		positionLeft += 30;
		event = Event.MOVE(positionLeft);
	}
}

Controller は以下のようにします。Controller の update メソッドは随時呼び出されます。

class Controller
{
	private var model:Model;
	private var view:View;

	...初期化処理 略...

	public function update(){
		switch(model.getEvent())
		{
			case Event.NONE: return;
			case Event.MOVE(positionLeft): view.setPosition(positionLeft);
		}
	}
}

今回 Showcase 用に作成した、Display.hx, Operator.hx, Transmitter.hx は上記 Model, View, Controller の形式で作成されています。

描画分離と Haxe

今回は HTML/JQuery で UI を作成しましたが、Flash Player ターゲットでも、HTML5 Canvas ターゲットでも、その他 Haxe が対応している言語であるならば何にでも Model をソースコードそのままで利用できます。出力ターゲットを変更するには、View の内容を変更すれば良しとなります。これがクロスプラットフォーム言語の面白いところでしょうか。

私は、ブラウザミニゲームは何の出力ターゲットで作ったらよいかなあ、と悩む事がありますが、先に Model だけ先行して作成してしまう、という開発手法も採る事ができ 少々悩みの種がとれたりします。

出力ターゲットを切り替えてのテスト

Haxe 用 UnitTest ライブラリの MassiveUnit では、JavaScript ターゲットや Flash Player ターゲット出力の場合 テストはブラウザを介す事で実行され、テスト結果はブラウザに表示されます。
ブラウザ表示により、テスト結果が html で色分けされて表示されるのはとても見やすい一方、テストの度にアプリケーションがブラウザに切り替わるのはやや面倒な場合もあります。

ここで、Model はどの環境でも利用できるという性質から、ブラウザを介す必要のないターゲット(neko等)でテストを行ってしまう方法が採れます。

コマンドラインツールの同梱している IDE(IntelliJ IDEA の Terminal 機能等)を用いる事で、JavaScript ターゲットのソースコード開発を行いながら テストは Terminal の neko ターゲットで行う、といった具合に、ロジック部分はブラウザ無しでの開発手法が可能です。(出力ターゲットによっては処理結果が異なる場合があるので、その点は注意が必要です。)


[ FLASH ] [ tips ] 2016年05月09日 19:30 | コメント (0) | トラックバック (0)

FLASH FLASH tips Haxe: Photoshop 自動画像アセット生成機能の拡張子記述の手間を省く拡張パネル GenerativeLayerRenaming を公開

Photoshop CC 用拡張パネル GenerativeLayerRenaming を公開しました。Haxe で作成しています。

https://github.com/siratama/GenerativeLayerRenaming

Photoshop から画像出力を行う方法の一つとして、自動画像アセット生成機能があります。

https://helpx.adobe.com/jp/photoshop/using/generate-assets-layers.html

レイヤー名に画像拡張子を設定する事で、自動的にそのレイヤーが画像出力される、といった内容です。

しかしレイヤー名設定ルールはやや使い勝手が悪く、フォルダ分けして画像出力したい場合、絶対パスでレイヤー名を記述する必要があります。フォルダ構造が深いと記述するのは大変で、レイヤー名が長くなる事で見通しが悪くなり、フォルダ構造を変更したい場合 逐一手動でパスを記述しなおす必要が出てきます。

このわずらわしさを解決するために当拡張パネルを作成公開しました。

[ FLASH ] [ FLASH ] [ tips ] 2015年12月13日 21:35 | コメント (0) | トラックバック (0)

FLASH update Haxe: Photoshop タイムラインフレームアニメーション情報を出力する FrameAnimationExport と、その出力データを Flash Pro CC に読み込み MovieClip 化する FrameAnimationImport を公開

Photoshop CC 用拡張パネル FrameAnimationExport と、Flash Pro CC 用拡張パネル FrameAnimationImport 二点を公開しました。Haxe で作成しています。

https://github.com/siratama/FrameAnimationExport

https://github.com/siratama/FrameAnimationImport

紹介動画

詳細

FrameAnimationExport を利用する事で、今まで不可能だったタイムラインフレームアニメーションの各フレーム内画像データの位置情報・不透明度を出力する事が可能です。原点座標オフセット機能等を用意しており、Photoshop で作ったデータをそのまま他のアプリケーションで利用しやすい形に再現できます。

FrameAnimationExport から出力したデータを別アプリケーションで利用する一例が、FrameAnimationImport for Flash Pro CC となります。

今までは、Photoshop で作成したフレームアニメーションを Flash Pro CC 上で再現するために、データ読み込み後、毎回どのフレームでどの画像が表示されるか、あるいは配置位置はどこなのかを手動で調整しなくてはなりませんでした。しかし当拡張機能を利用する事で、その手間は無くなります。

[ FLASH ] [ update ] 2015年09月21日 13:43 | コメント (0) | トラックバック (0)

FLASH FLASH update Haxe: 全選択レイヤー内 各キーフレームのフレームを増減させる Flash Pro CC 拡張パネル FrameInsertEveryEachKeyFrame を公開

選択したレイヤー内 各キーフレームのフレームを増減させる Flash Pro CC 拡張パネル FrameInsertEveryEachKeyFrame を公開しました。Haxe で作成しています。

https://github.com/siratama/FrameInsertEveryEachKeyFrame

[ FLASH ] [ FLASH ] [ update ] 2015年09月12日 09:12 | コメント (0) | トラックバック (0)

FLASH FLASH update Haxe: 選択したライブラリ内アイテムを一括で複製する Flash Pro CC 拡張パネル LibraryItemDuplication 公開

選択したライブラリ内アイテムを一括で複製する Flash Pro CC 拡張パネル LibraryItemDuplication を公開しました。Haxe で作成しています。

https://github.com/siratama/LibraryItemDuplication

なるべく利用しやすい形で複製するようにしています。例えば左図の選択状態で LibraryItemDuplication を実行すると 右図のような状態で複製されます。





[ FLASH ] [ FLASH ] [ update ] 2015年08月22日 22:11 | コメント (0) | トラックバック (0)

FLASH tips Haxe(Adobe AIR or Flash) から GAFMedia を利用する

先日 GAFMedia のフリーライセンス版にて、待望の「Conversion sourceLibrary」機能が利用可能になりました。

これに伴い無料の環境にて、ようやく元来の Flash 制作そのままの流れで、複雑なタイムラインアニメーションを軽快にモバイル端末などで動作させることができます。(Flash Pro CC の料金は別)

当記事では GAF についての簡単な紹介と、Haxe(Adobe AIR or Flash) から利用するための設定方法を記述します。

GAF 説明

Stage3D と Starling

Flash(or Adobe AIR) には Stage3D という 3D 処理を行う機構が用意されています。Stage3D を利用する事で複雑な図形を軽快にモバイル端末で動作させることができます。しかし Stage3D をそのまま扱う事はたいへん難しく何らかのライブラリを通じて利用するのが一般的です。

Stage3D を扱うライブラリの一つに Starling というものがあります。Starling を利用する事で Stage3D 上に 2D の画像を容易に描画する事ができます。しかし Starling は単体の MovieClip を扱うだけならば十分でしたが、複数の MovieClip を組み合わせたアニメーションを表示するのが難しい状況でした。

GAF

http://gafmedia.com

Starling 単体では厳しい状況を解決すべく登場したのが GAF と呼ばれるライブラリとなります。GAF を利用する事で Flash タイムラインアニメーションほぼ全てをそのままに Starling 上で再生できるようになります。

当初は GAF の有効な機能を利用するには有料ライセンス契約が必要で、ここで多くの Flash コンテンツ開発者が足踏みしてしまう状況にありましたが、先日のアップデートでフリーライセンスでも GAF の多くの有効な機能を利用できるようになりました。まだ制限はありますが十二分な機能が用意されています。

当記事記述時に利用制限のある主だった内容は以下となります。
・読み込み画面で GAF のロゴを表示する必要がある
・タイムラインアニメーション上のサウンド再生はサポートされない
・コマンドラインツールが使えない
・儲けは 100K USD まで

Haxe から GAF を利用するための前準備

Haxe から GAF を利用するためには少々前準備を必要とします。

最新の GAF は Starling の他 Feathers という Starling 用 UI ライブラリを利用します。しかし Feathers 用 swc ファイルを Haxe から利用しようとしても動作してくれません。対処として、以下の URL 内情報を元に必要な swc を生成する必要があります。

 https://gist.github.com/tmskst/094d0808a817831181f9

上記 URL 内情報の補足説明を Windows の場合を例に以下に記述します。

compc コマンド実行設定: flex SDK 4.6 のダウンロード

build.bat 内 compc コマンドは flex SDK 内命令を利用するため flex SDK 4.6 をダウンロードします。

 flex SDK 4.6
 http://www.adobe.com/devnet/flex/flex-sdk-download.html

解凍した flex SDK フォルダを適当なディレクトリ(C:\Program Files\Adobe 内等)に配置し、Windows 環境変数設定の Path に flex SDK bin ディレクトリのパスを設定します。

git コマンドをプロンプトで実行可能に設定

Windows git インストール時の設定で、git コマンドをプロンプトで利用できるような設定にしておく必要があります。コマンドプロンプトで「git」を実行しても認識されない場合、再度 Windows git をインストールし中途の設定でコマンドプロンプトからの利用を有効化します。

 Windows git
 https://msysgit.github.io/

playerglobal14_0.swc をダウンロード

playerglobal14_0.swc は過去の FlashPlayer アーカイブページ内にあります。

 Playerglobal.swc アーカイブ(開発者向けライブラリ)
 https://helpx.adobe.com/jp/flash-player/kb/228683.html#id_4219

playerglobal14_0.swc よりも新しい swc ファイルを利用しても、当記事内サンプルは動作しましたが何か問題が発生するかもしれません。また playerglobal14_0.swc を利用しない場合 build.bat 内一部記述の書き換えを行う必要があります。

playerglobal14_0.swc を利用しない場合のバッチファイル(build.bat)内記述変更

playerglobal14_0.swc を利用する場合、この項は無視してください。

・playerglobalXX_X のバージョンに合わせて -swf-version の数値を変更
「swf-version」で Web上を検索すると FlashPlayer 各バージョンに対する swf-version 数値が見つかります。例えば playerglobal17_0.swc(FlashPlayer17)の場合 -swf-version は 28 に設定します。

・playerglobal14_0.swc の記述を playerglobalXX_X.swc に変更

build.bat 実行はコマンドプロンプトから

build.bat をダブルクリックしても動作しない場合、コマンドプロンプトから build.bat を実行します。

Flash Pro CC 拡張パネル FlashToHaxeConverter

インストールしておくと便利な拡張パネル FlashToHaxeConverter の説明です。

Action Script 3.0 での Flash コンテンツ開発時、swc というファイルを利用する事で、Action Script 用 エディタの多くは 読み込み対象 swf 内の以下の情報を知ることができます。

・リンケージ設定した MovieClip
・リンケージ設定した MovieClip 内に定義されている MovieClip プロパティ名

しかし Haxe 用エディタは swc ファイルを利用しても、swf 内クラス構造を知ることができません。この問題を解決するために FlashToHaxeConverter という Flash Pro CC 用拡張パネルを利用します。

 https://github.com/siratama/Flash-To-Haxe-Converter

インストール方法は URL 先の情報をご確認ください。独自配布の拡張パネルをインストールするには専用のコマンドラインツールが必要となっています。

GAFConverter

fla ファイルから出力した swf を GAF 用データに変換するためには GAFConverter を利用します。

 GAFMedia download page
 http://gafmedia.com/downloads

GAFConverter を Free ライセンスで利用するには GAFMedia Web サイトでユーザ登録を行います。ユーザ登録を行わないと Free ライセンスよりも機能が制限された状態になってしまいます。

設定

リンケージ設定した全ての MovieClip をスクリプトから操作するために、GAFConverter には以下の設定をしておく必要があります。

Conversion mode: nesting
Conversion source: Library にチェック

「Conversion mode: nesting」は、入れ子状態の MovieClip を Script から取得可能にするための設定です。
「Conversion source: Library」は、リンケージ設定を行った MovieClip を GAF 用に変換するための設定となります。

Haxe から GAF を利用したサンプルプロジェクト

Haxe から GAF を利用したサンプルプロジェクトファイル一式は以下に配置しています。

 https://github.com/siratama/HaxeSampleUsingGAF

ファイルディレクトリ構成
├ deploy/
│ ├ main.swf
│ ├ view.swf --- 素材 swf ファイル
│ └ view.zip --- view.swf を GAFConverter で変換したファイル
│
├ fla/
│ ├ view.fla --- 素材 fla ファイル
│ └ powered_by_GAF.fla --- GAF ロゴファイル
│
├ lib/ --- build.bat 実行後に生成された各 swc, patch ファイルを配置
│
├ src/
│ ├ app/ --- メイン処理
│ ├ extern/
│ │  ├ com/ --- GAF 用 extern ファイル配置
│ │  ├ feathers/ --- build.bat から出力された Feathers 用 extern ファイル
│ │  └ starling/ --- build.bat から出力された Starling 用 extern ファイル
│ └ extern_fla/ --- FlashToHaxeConverter から出力した view.fla 内クラス構造
│
├ compile.hxml --- コンパイル用ファイル
作業の流れ

当サンプルプロジェクトでの実際に行った作業の流れは だいたい以下のようになります。

・前準備(build.bat 実行)で生成した各ファイルを lib, src/extern ディレクトリに配置
・fla/view.fla ファイルを編集
 ・アニメーションやレイアウト用 MovieClip を作成
 ・スクリプトで操作する対象の MovieClip にリンケージ設定
 ・FlashToHaxeConverter で hx ファイルを src/extern_fla に出力
 ・パブリッシュで deploy/view.swf を出力

・GAFConverter で deploy/view.swf を deploy/view.zip に変換
・src/app/ 内にメイン処理作成
 ・src/extern/com/ 内に必要な GAF 用 extern ファイルを随時作成

・compile.hxml でコンパイル
・出力された deploy/main.swf を実行

GAF-Starling API 用 extern ファイルはサンプル内で使用する最小必要源のものしか用意していません。利用したいプロパティ・メソッド・クラスがない場合、随時 自ら追加します。あるいは有志の方が GAF 用 extern ファイルを全て作成してくれるのを待ちます。

 GAF-Starling API
 http://gafmedia.com/docs/starling/trunk/index.html

ソースコード解説

メイン処理となる src/app/haxegame/Main.hx 内の処理の流れの大まかな解説です。

https://github.com/siratama/HaxeSampleUsingGAF/blob/master/src/app/haxegame/Main.hx

■Starling 用 初期設定

https://github.com/siratama/HaxeSampleUsingGAF/blob/master/src/app/haxegame/Main.hx#L46-L58

■GAFConverter で出力したデータ(view.zip)読み込みと変換

https://github.com/siratama/HaxeSampleUsingGAF/blob/master/src/app/haxegame/Main.hx#L59-L84

読み込み変換したデータは、GAFTimelinesManager クラスへ addGAFBundle メソッドを用いて追加しています。

GAFTimelinesManager.addGAFBundle(gafBundle);

FlashToHaxeConverter で生成したクラスファイルを利用する場合 必須の処理となります。詳細は後述します。

■レイヤー生成と fla 内 MovieClip を GAFMovieClip として生成し配置

https://github.com/siratama/HaxeSampleUsingGAF/blob/master/src/app/haxegame/Main.hx#L87-L116

FlashToHaxeConverter で出力したクラスファイルを new する事で、fla ファイル内で作成した MovieClip を GAFMovieClip として生成できます。プレイヤー用 MovieClip と レイアウト用 MovieClip を生成しています。
たくさん trace 文を記述していますが、これはレイアウト用 MovieClip 内に配置した入れ子状態の MovieClip が GAF にて正常に認識されているか検証しているだけなので無視してください。

■再生

https://github.com/siratama/HaxeSampleUsingGAF/blob/master/src/app/haxegame/Main.hx#L119-L128

FlashToHaxeConverter 用 Haxe スクリプト設定

FlashToHaxeConverter から出力された GAF 用 クラスファイルには、例えば以下の様な記述が行われます。

例)
https://github.com/siratama/HaxeSampleUsingGAF/blob/master/src/extern_fla/gaf/haxegame/player/WalkViewMovieClip.hx

package haxegame.player;
import com.catalystapps.gaf.display.GAFMovieClip;
import com.catalystapps.gaf.core.GAFTimelinesManager;
abstract WalkViewMovieClip(GAFMovieClip){
    public function new()
        this = GAFTimelinesManager.getGAFMovieClip('view', 'haxegame.player.WalkViewMovieClip');
    @:to public function getInstance():GAFMovieClip
        return this;
}

new メソッド内で、GAFTimelinesManager.getGAFMovieClip メソッドを用い GAFMovieClip を生成しています。

よって事前に、読み込み変換した view.zip を GAFTimelineManager.addGAFBundle メソッドにて追加しておく必要があります。

おわりに

今回のフリーライセンスでの機能解放により、私のような無料ゲームを作成している個人開発者でも、気軽に GAF の利用が可能になりました。Action Script 3.0 にて Adobe AIR アプリの効率のよい開発手法を模索されている方は、一度 Haxe からの GAF 利用を試してみてはいかがでしょうか。

[ FLASH ] [ tips ] 2015年08月14日 23:01 | コメント (0) | トラックバック (0)