【PerspectiveProjection】

Actionscript 3, 筒状に並べた画像を回転させる

Actionscript3 Flash CS4

前回同様 Advanced Actionscript 3.0 Animation を参考に画像を筒状に並べて3D回転させてみた。

サンプルでは Rotate Carousel(回転木馬)と名前がついていた。
サンプルは Shape を並べていて表裏が関係ない、Bitmap に置換えるときに注意が必要。

Rotate Carousel - 1

Flash Player 10 で追加された3D関連のクラスを把握するのに時間がかかりそうな予感。
Matrix3d, Vector3D, PerspectiveProjection が重要な働きをしている。

Demo : Rotate Carousel v.1 - Flash Player 10 が必要です。

ポップアップされたウインドウをリサイズすると面白い。

もう一つ。
PerspectiveProjection.fieldOfView を小さくしたものを作った。

Rotate Carousel 2

Demo : Rotate Carousel v.2 - Flash Player 10 が必要です。

全ての画像が見えるようになると、手前の画像が表を向いている必要があるので、v.2 では rotationY を +180 している。
PerspectiveProjection.fieldOfView は魚眼効果を出す働きがある。
値が大きいと効果も大きくなる、0 から 180 の間で設定できる。

この投稿の続きを読む »

Bookmark and Share

Actionscript 3, 立方体を3D回転

Actionscript3 Flash CS4

Rotate CubeAdvanced Actionscript 3.0 Animation を参考に立方体を3D回転させてみた。

Bitmap を各面にはり、Mouse との距離で回転スピードを調整した。
200px X 200px の正立方体。

リフレッシュごとに各面のZ深度を調整しないと立方体が壊れてしまう。
Flash Player 10 から使える Marix3D を使うのは Actionscript リファレンスを見ただけでは思いつかないな。
Vector3D も登場して難易度はますます上がってしまう。

各面を配列に保持しリフレッシュ時にdeltaTransformVector値を比較しソートさせる。
書けば簡単だけど、イマイチ理論が理解できない。

perspectiveProjection を使うことで stage をリサイズした時の立方体のゆがみを抑制することができるんだね。
以前に比べて簡単なようなそうでもないような・・・


Demo : Rotate Cube - Flash Player 10 が必要です。

この投稿の続きを読む »

Bookmark and Share
WP Theme & Icons by N.Design Studio
RSS