- 2007-07-24 1:16
- papervision3d
Papervision3Dのインストールが完了したら、次は実際にプログラミングに入ります。
まず、Papervision3Dがどういう構成になっているのかを知るため、シンプルなオプジェクトを回転させるプログラムを紹介します。
Flashの基本はツリー構造です。
あらかじめ準備されているstageというルートノードにaddChildでノードをぶら下げていく事で、Flashの画面にオブジェクトを表示する事ができます。Papervision3Dにおいても例外ではありません。
すなわち、一番始めにやることは、stageの設定です。
stage.frameRate = 60; stage.quality = "MEDIUM"; stage.scaleMode = "noScale"; stage.align = StageAlign.TOP_LEFT;
stageの様々なプロパティを設定しています。余裕があれば、これらのプロパティの意味や、別のプロパティを調べてみると面白いかもしれません。
全てのオブジェクトの受け皿となるコンテナを生成します。
container = new Sprite(); container.x = 200; container.y = 200;
ついでにコンテナの位置も決めています。
このコンテナをstageにaddChildでぶら下げます。
stage.addChild( container );
Papervision3Dの3Dオブジェクトの基礎となるシーンを生成します。
scene = new Scene3D( container );
コンストラクタの引数にはコンテナを指定します。
このコンテナに、全てのオブジェクトがレンダリングされます。
Papervision3Dの受け皿となるrootノードを作成します。
rootNode = new DisplayObject3D();
これを、シーンに追加しておきます。
scene.addChild( rootNode );
今回は、厚みの無い板を作成します。
//マテリアル設定 material = new ColorMaterial( 0xffffff, 1 ); material.oneSide = false; //Planeオブジェクト生成 planeObj = new Plane( material, planeSize, planeSize, segment, segment );
作成したオブジェクトをrootノードにぶら下げます。
rootNode.addChild( planeObj );
今回は、カメラは固定とします。
最終的にディスプレイに表示されるのは、このカメラからの視点になります。
つまり、カメラから見た映像がレンダリングされることになります。
camera = new Camera3D(); camera.z = -planeSize; camera.focus = 50; camera.zoom = 1;
ここまでで、初期設定が終わりました。
今回は、オブジェクトをグルグル回転させたいので、イベントとしてENTER_FRAMEを利用する。
stage.addEventListener(Event.ENTER_FRAME, loop);
第二引数のloopは、このイベントが発生した時に呼び出される関数である。
上記のENTER_FRAMEイベントにより、指定されたフレームレート毎に呼び出される関数を定義します。
今回は、Y軸を中心に回転するようにします。
private function loop( event:Event ):void { // Y軸回転 planeObj.rotationY += 5; }
回転させた結果を再レンダリングする必要があります。
レンダリングの視点はカメラであることを思い出して、以下のようにします。
private function loop( event:Event ):void { // Y軸回転 planeObj.rotationY += 5; // 再レンダリング scene.renderCamera( camera ); }
うまく行けば以下の様なぺらぺらのオブジェクトがマッタリと回転してくれます。
このソースコードの全容を公開します。最もシンプルな形だと思いますので、入門として参考にしてください。
package { import flash.display.*; import flash.events.*; import org.papervision3d.scenes.*; import org.papervision3d.objects.*; import org.papervision3d.cameras.*; import org.papervision3d.materials.*; [SWF(backgroundColor=0x000000)] public class MyPlane extends Sprite { private var container : Sprite; private var scene : Scene3D; private var camera : Camera3D; private var rootNode : DisplayObject3D; private var planeObj : DisplayObject3D; private var planeSize : int = 300;//Planeオブジェクト1辺の長さ private var segment : int = 1; //面の分割数 private var material : ColorMaterial; private var valx : Number = 0; private var valy : Number = 0; //---------------------------------------------Constructor public function MyPlane():void { stage.frameRate = 60; stage.quality = "MEDIUM"; stage.scaleMode = "noScale"; stage.align = StageAlign.TOP_LEFT; //コンテナ生成 container = new Sprite(); container.x = 200; container.y = 200; stage.addChild( container ); //シーン生成 scene = new Scene3D( container ); //rootNode生成 rootNode = new DisplayObject3D(); scene.addChild( rootNode ); //マテリアル設定 material = new ColorMaterial( 0xffffff, 1 ); material.oneSide = false; //Planeオブジェクト生成 planeObj = new Plane( material, planeSize, planeSize, segment, segment ); rootNode.addChild( planeObj ); //camera設定 camera = new Camera3D(); camera.z = -planeSize; camera.focus = 50; camera.zoom = 1; stage.addEventListener(Event.ENTER_FRAME, loop); } //---------------------------------------------loop private function loop( event:Event ):void { // Y軸回転 planeObj.rotationY += 5; //再レンダリング scene.renderCamera( camera ); } } }
- Newer: Papervision3Dのオブジェクトをマウスの位置に応じて回転させる
- Older: Papervision3d入門
Comments:0
Trackbacks:0
- Trackback URL for this entry
- http://www.adamrocker.com/blog/125/papervision3d_simple_plane.html/trackback/
- Listed below are links to weblogs that reference
- Papervision3Dでシンプルなオブジェクトを回転させる from throw Life