Blender で作ったものを Flash で表示する
まだまだ分からないことは多いですが、ひとまず Flash で表示するところまで来たので記録しておきます。 目指す所は、 Blender で 3D のモデリング、 Away3D で Flash 表示です。
対象環境
1. メッシュデータ作成
Blender で表示したいメッシュデータを作成します。 僕は 3D のモデリングツールとか一切使ったことが無かったので本一冊買って勉強しました。
今回は↓みたいな穴あき矩形を作りました。
作ったファイルを置いておきます。
blockParts.blend
2. メッシュデータのエクスポート
Blender から Away3D で利用可能な形式でエクスポートします。 「Away3D 4.0 Alpha」で利用可能なフォーマットは現状これでしょうか。→ココ ※コメントに「Collada (.dae)」って書いてありますが、パーサーが見つからないので使えないっぽい。前バージョンでは使えてるような？→ココ
今回は「Wavefront OBJ (.obj)」でエクスポートします。
保存ダイアログに出てくるエクスポート設定はよく分からないのでそのまんまです。
この結果、「blockParts.obj」「blockParts.mtl」が出力されます。
※ Away3D 用の形式として「AWD」があるのですが、以下のアドオンを追加することで Blender からエクスポート可能になるようです。 FLATV - Away3Dで使えるフォーマット「AWD」をBlenderから書き出すテスト 僕は残念ながら Windows 環境でのコンパイルに躓いて、諦めました・・・。Visual Studio 2005 ～ 2010まで入れて試しましたがダメでした。僕が悪い。
3. Stage3D 環境構築
「FlashDevelop」「Flex SDK」「Away3D」の環境を作ります。 flabaka - FlashDevelop 4とAway3D 4でStage3Dを試してみる
「FlashDevelop」でプロジェクトも作っておきます。
4. メッシュデータの表示
まずは「blockParts.obj」「blockParts.mtl」を、swf の出力先に置いておきます。
コードは、以下が参考になります。 Creating 3D games and apps with Away3D 4 and Stage 3D: Part 1 | Adobe Developer Connection
上記を参考に↓を書きます。
package
{
import away3d.containers.View3D;
import away3d.events.LoaderEvent;
import away3d.loaders.Loader3D;
import away3d.loaders.parsers.Parsers;
import flash.display.Sprite;
import flash.errors.IOError;
import flash.events.Event;
import flash.net.URLRequest;
/**
* Away3D テスト
*
* @author asahiufo@AM902
*/
public class Away3DTest extends Sprite
{
private var _view:View3D;
private var _loader:Loader3D;
/**
* コンストラクタ
*/
public function Away3DTest()
{
super();
addEventListener(Event.ADDED_TO_STAGE, _onAddedToStage);
}
/**
* ステージ追加時イベントハンドラ
*
* @param event イベント
*/
private function _onAddedToStage(event:Event):void
{
_view = new View3D();
_view.antiAlias = 4;
addChild(_view);
// モデルロード
Parsers.enableAllBundled();
_loader = new Loader3D(false);
_loader.addEventListener(LoaderEvent.RESOURCE_COMPLETE, _onResourceComplete);
_loader.addEventListener(LoaderEvent.LOAD_ERROR, _onLoadError);
_loader.load(new URLRequest("blockParts.obj"));
}
/**
* ロード完了イベントハンドラ
*
* @param event イベント
*/
private function _onResourceComplete(event:LoaderEvent):void
{
_loader.removeEventListener(LoaderEvent.RESOURCE_COMPLETE, _onResourceComplete);
_loader.removeEventListener(LoaderEvent.LOAD_ERROR, _onLoadError);
_loader.scaleX *= 200;
_loader.scaleY *= 200;
_loader.scaleZ *= 200;
_view.scene.addChild(_loader);
addEventListener(Event.ENTER_FRAME, _onEnterFrame);
}
/**
* ロードエラーイベントハンドラ
*
* @param event イベント
*/
private function _onLoadError(event:LoaderEvent):void
{
_loader.removeEventListener(LoaderEvent.RESOURCE_COMPLETE, _onResourceComplete);
_loader.removeEventListener(LoaderEvent.LOAD_ERROR, _onLoadError);
_loader = null;
throw new IOError("ロードエラー[url=" + event.url + "]");
}
/**
* エンターフレーム
*
* @param event イベント
*/
private function _onEnterFrame(event:Event):void
{
_loader.rotationX = stage.mouseY - stage.stageHeight / 2;
_loader.rotationY = stage.mouseX - stage.stageWidth / 2;
_view.camera.y = 3 * (stage.mouseY - stage.stageHeight / 2) * 0.1;
_view.camera.lookAt(_loader.position);
_view.render();
}
}
}
実行結果です。とりあえず表示はされた様子。マウスでグリグリすると角度が変わります。
終わりに
とりあえず表示は出来ましたが、いろいろ疑問は残ります。最終的にゲームで使えるぐらいになりたい所。まずはここを起点にいじっていこうと思います。
雑感
