Home > 3D Tips | Flash (ActionScript) > [Flash Player 10 #2] 3D のプリミティブにテクスチャを適用する。

[Flash Player 10 #2] 3D のプリミティブにテクスチャを適用する。

今回は先日のデモにテクスチャを適用します。コード自体に大まかな変更は無いので、前回のコードで説明が足りない所や今回の肝になる部分の解説だけしていきます。

※ 要 Flash Player 10

平面のテクスチャ適用デモはこちら
立方体のテクスチャ適用デモはこちら

まずは以下のコード。

早速新しい Matrix3D クラスですが、そもそも行列(Matrix)はある座標系のものを別の座標系に変換するときに使用します。今回はシーンの座標系を透視投影を用いて僕たちが見ているスクリーン上の座標に変換する必要があるので、シーンの座標系を表す行列に透視投影の行列を乗算することで変換用の行列が出来上がります。このとき使用するのが append メソッド、もしくは prepend メソッドで、A.append(B) は A × B、A. prepend(B) は B × A を表します(多分)。詳しくは行列について調べてみてください。

次はこのコード。

ここでは変換用の行列でプリミティブの頂点を変換しています。その後にベクトルの w 要素に上の計算で求まる数値を代入してあげて、project メソッドを実行してあげることでスクリーン上の座標へと変換出来ます。晴れて二次元上の座標となった頂点を描画用の頂点ベクターに格納しています。

最後はこのコード。

この drawTriangles が新しく Graphics クラスに実装されたメソッドなんですが、ポリゴンを描画するために生まれたようなもので、とても便利。二次元上に変換した頂点ベクターとプリミティブの各情報、最後にカリングの指定をしてあげることでプリミティブのポリゴンが描画出来ます。ちなみに TriangleCulling.POSITIVE は描画する三角形の頂点が反時計周りの時には描画しません。逆に TriangleCulling.NEGATIVE は時計回りの時には三角形を描画しません。詳しい解説はこちら(Flash Player 10 Drawing API)や、「法線」とかでググってみるといいかも。今回も FlashDevelop のプロジェクトファイル一式を上げておきますので、参考にどうぞ。

'08 5/21 追記:
Flash Player 10 Drawing API を元ソースではなく、なぜか中国?の Flash サイトへのリンクにしてたので修正しました。すいません。

プロジェクトファイルはこちら

パースペクティブコレクトまでしてくれる(してくれてますよね?)、とても素敵な drawTriangles メソッドですが、線の設定(lineStyle)が出来ないのでワイヤーフレームなプリミティブが描画出来ないんですよね。これは仕様なのかバグなのか。

'08 5/21 追記:
パースペクティブコレクト(透視補正)はしてくれないみたいです、すいません。デモを上げておきますので、ご確認ください。

透視補正のデモはこちら

'08 5/25 追記:
やっぱり補正にも対応しているみたいですね。 Mtok-blog さんで紹介されていますので、参考にどうぞ。

Comments:0

Comment Form

コメントを表示する前にこのブログのオーナーの承認が必要になることがあります。

Trackbacks:0

TrackBack URL for this entry
http://www.unbland.net/mt/mt-tb.cgi/19
Listed below are links to weblogs that reference
[Flash Player 10 #2] 3D のプリミティブにテクスチャを適用する。 from unbland.net blog

Home > 3D Tips | Flash (ActionScript) > [Flash Player 10 #2] 3D のプリミティブにテクスチャを適用する。

Search
Feeds

Return to page top