少しアップデート

前回 (Flash Professional CS5.5 から Android 向け AIR アプリを発行、インストール) のソースコードを更新。　大きな変更としては、サイコロは終了時に状態を保存し、再度起動したときにはこれを読み込むようにしたということです。

ソースコード：ソースコード

以下AIR 固有の機能を外して Webでも見れるようにしてみました。

サンプルコンテンツを別ウィンドウで開く

Flash Professional CS5.5 から Android 向け AIR アプリを発行、インストール

Flash Professional CS 5.5 で Android 向け AIR アプリケーションを作成、端末へのインストールを試みた。
すごく簡単にできてしまいました。
CS5.5 はトライアル版を Adobeのサイトからダウンロードできます。わたしも今はトライアル版を使っています。
わたしが使ったアプリケーションを添付したので、是非試してみてください。

方法：
１．Android端末は「USBデバッグ設定」を有効にしておきます。「USBデバッグ設定」は「設定」の「アプリケーション」->「開発」の中にあります。

２． 端末と PC を USB ケーブルで接続します。これで端末とPCはデバッグモードでつながれたことになります。端末のステータスバーには虫のマークが表示されています。

（デバイスによっては専用のデバイスドライバなどインストールしなければならないかもしれません。わたしが使っている Galaxy S の場合、特に必要ではありませんでした。 Galaxy S のユーティリティーソフトである「Samsung Kies」をインストールしていたからではないかと思っています）

１．「サイコロツールのソースコード」をダウンロード、適当な場所に展開します。
（最新：６月２２日更新版ソースコード）

２．展開したファイルの中にある sakura_tool.fla ファイルを Flash CS5.5 で開きます。

３． Flash CS5.5 のメニューから [ファイル] -> [パブリッシュ(B)] を選びます

４．「AIR for Android の設定」ダイアログが開かれると思います。必要最低限の設定はすでにしてあるのですが、「証明書」と「パスワード」については各自個別に設定しなければなりません。これはアプリを発行した人の情報を証明書という形でアプリに添付する作業です。まず自分専用の証明書を作成します。「証明書」入力フィールドの右側にある [作成…] ボタンを押します。

５．「自己署名の証明書を作成」ダイアログボックスが開かれると思います。必要な情報を入力して、[参照]ボタンで保存場所を指定、証明書を保存、[OK]ボタンを押して、証明書の作成を終了します。

６．「AIR for Android 設定」に戻ってくるので、「証明書」に先ほど指定したファイル、「パスワード」に証明書に設定したパスワードを入力します。

７．「パブリッシュ」ボタンを押します。生成されたアプリがUSB経由で端末に転送されます。

８．端末を確認してください。アプリ一覧の最後に「サイコロツール」が追加されていると思います。アイコンはパブリッシュ時の設定でまだ設定していないのでデフォルトアイコンになっています。「AIR for Android 設定」の「アイコン」タブに必要な設定をすることで、ここのアイコンも変更することができると思います。

９．サイコロツールを起動してみてください。 先ほどパブリッシュしたアプリが起動されます。

ちなみにこれはマーケットにアップしようと１か月半ぐらい前に制作を開始したアプリの途中経過です。マーケットにアップするにはもう少しチューニングが必要かなという感じですが、だいぶ形になってきました。
端末独自の機能として、重力センサーに対応しています。端末を上下または左右に振ってみてください。サイコロをふることができると思います。

Away3D Lite と jiglibFlash で Android 向けアプリ（途中経過３）

とりあえずいろんなものをくっつけてみた。Editボタンでサイコロの編集ができる。
全体の見た感じとかまとまりをもたせるのが難しい、、、デザインセンスないなぁ。
誰でも使い方がわかるようもう少し操作をシンプルにし、ゲーム/ツールとして一応使い物になるな状態にして５月中には Android アプリ化できることを期待、、、

ソースコードは結構ぐちゃぐちゃになってきた。そのうちちゃんと整理したい気はする。

ソースコード：ソースコード

サンプルコンテンツを別ウィンドウで開く

Away3D Lite 立方体の６面に文字を書き込む UI (Cube Surface Editor UI)

立方体の６面に文字をテクスチャーとして書き込める UI を作ってみた。
特に計画せず作り始めたので、コードはかなりきたない。
Away3D Lite の 3Dオブジェクト、Cube6 は６面を一つのテクスチャで構成しなければなりませんが、６つのテクスチャー画像から、この Cube6 用のテクスチャを作成するところは、次のサイトで詳細されていた Cube6Material クラスをそのまま使わせていただいた。
Away3DLite Cube6 Material creator

ソースコード：ソースコード

サンプルコンテンツを別ウィンドウで開く

Away3D Lite FastRenderer で Skybox

Away3DLite には Skybox6 という3D背景を設定するための 3Dオブジェクトが用意されているようだが、FastRenderer を使った場合、どうにもこれが正しく動作してくれない。　かわりに Flash のネイティブ 3D機能を使って、6つのビットマップを描画する方法を試行してみた。

期待に反してパフォーマンスという点での利点はないようである。おそらく Away3DLite は画面からはみ出して見えない部分のレンダリングをスキップする方法などより効率的に行われているのであろう。

スカイボックス画像の制作は Bryce というソフトを使った。このサイトを参考にして
Build a skybox in Bryce

ソースコード：ソースコード

サンプルコンテンツを別ウィンドウで開く

Away3D Lite と Flash の native 3d シーンの共存

Flash のネイティブの 3Dシーンと Away3DLite のシーンを共存させる方法を調べてみた。
試行錯誤の結果こんな感じで

Sprite (Flashネイティブ) のレンダリングレイヤーを作成
----------------------------------------------------
//Flash native 3D シーンの作成
native3dlayer = new Sprite();
native3dlayer.transform.perspectiveProjection = new PerspectiveProjection();
native3dlayer.transform.perspectiveProjection.projectionCenter = new Point(0,0);
native3dlayer_base = new Sprite();
native3dlayer_base.addChild(native3dlayer);
addChild(native3dlayer_base);
----------------------------------------------------

Sprite (Flashネイティブ) のレンダリングレイヤーの描画位置を Away3DLite の描画位置と一致させる
----------------------------------------------------
native3dlayer_base.x = view.x;
native3dlayer_base.y = view.y;
----------------------------------------------------

視野角を一致させるためには　Away3DLiteの Camera3D.focus と Spriteレンダリングレイヤーの focalLength を一致させる。
----------------------------------------------------
native3dlayer.transform.perspectiveProjection.focalLength = camera.focus;
----------------------------------------------------

描画倍率を一致させるために Away3DLite の Camera3D.zoom の値でSpriteレンダリングレイヤーの描画倍率を一致させる
----------------------------------------------------
native3dlayer_base.scaleX = camera.zoom;
native3dlayer_base.scaleY = camera.zoom;
----------------------------------------------------

カメラの視点をSpriteレンダリングレイヤーにも適用するためにカメラの変換行列を invert して Sprite に適用
----------------------------------------------------
var mat:Matrix3D = camera.transform.matrix3D.clone();
mat.invert();
native3dlayer.transform.matrix3D = mat;
----------------------------------------------------

ソースコード：ソースコード

サンプルコンテンツを別ウィンドウで開く

Away3D Lite の z オーダーの問題

Away3D Lite はどうにも3Dオブジェクトが重なった時の処理に難がある。本来後ろに見えなければならないオブジェクトが前に来たりする。
解決方法の一つはオブジェクトをレンダリングするレイヤーを複数持たせ、明示的に前後関係をコントロールすることみたいだ。
この手法を行うには FastRenderer というレンダリングクラスを使う。
FastRenderer にはわたしが使っているバージョン 1.0.0 の時点ではバグがあるようである。

FastRenderer クラス (away3dlite/core/render) の collectFaces(object:Object3D) メソッドの以下の処理

for each (child in children) {
if(child.layer)
child.layer.graphics.clear();
collectFaces(child);
}

これは、本来こうならなければならないはずだ。

for each (child in children) {

if(child.layer)

child.layer.graphics.clear();

}

for each (child in children) {

collectFaces(child);

}

ライブラリにこの修正を加え、作ってみたテストコンテンツが以下の通り。
ソースコードも添付した：ソースコード

サンプルコンテンツを別ウィンドウで開く

Away3D Lite と jiglibFlash で Android 向けアプリ（途中経過２）

とりあえず基本的なところで予定していた機能が完成。
ソースコード：ダウンロード

サンプルコンテンツを別ウィンドウで開く

Away3D Lite と jiglibFlash で Android 向けアプリ（未完成）

Android であれば携帯電話でも Flash/AIR が動くということで、携帯向けのアプリを作ってみようと思案。
Away3DLite と jiglibFlash を使って。
陰影処理や、ミラーのような3D効果はCPUストレスが高いようなので、これら3D効果は全て行わないことに。

こんな感じのを発展させていこうと思う。

Lightwave で最初のアニメーション

簡単なアニメーションだけど結構時間がかかった。
結構大変な作業なんだなと実感。

Lightwave で スタンドライトを作ってみた

Lightwave3D 購入

Lightwave 3D v9.6 を購入。英語版 v10 無償アップグレード権付で。
Lightwave Beginners という本を購入してしばらくトライアル版で使ってみたところ、ある程度使いこなせそうだったので。
以前、無償の Blender という 3Dソフトを試してみたことがあったが、なかなか使いこなせなかった。機能的には Blender と Lightwave、そんなに変わらない気がするけど、実際使ってみるとどうにも Lightwave のほうが使いやすく感じる。
プロの世界では 3ds max と maya というソフトが多く使われているようですが、高すぎて手が出せない。
Lightwave の１ユーザーとして Lightwave を盛り上げていきたい。

Away3D と jiglibflash

Flash ベースの 3D エンジン Away3D と、Away3D と連携して動作する剛体物理エンジン jiglibflash を使ってみた。
Away3D は機能が盛りだくさんなようですが、jiglibflash との組み合わせで意図したように動かないこともあり、いろいろ苦労。

Alternativa3D を使ってみた

Altanativa3D を使ってみました。