papervision3D 2.X EX.06 Planeをクリックしたら「クルクル」まわる - [k]id東京都世田谷区 ホームページ制作 [k]id

papervision3D 2.X EX.06 Planeをクリックしたら「クルクル」まわる

Category Flash Tips,Papervision3Dを試す Update 2009.05.08

twitterfacebookgoogle+はてなブックマークPocketであとで読むfeedlyで購読

前回の「クリックしたら移動」の応用で「クリックしたら」Tweenerで「クルクル」まわるに変更してみました。

Tweenerで回す動作は

 
Tweener.addTween(対象, {rotateX:X軸に回す角度,rotateY:Y軸に回す角度,rotateZ:Z軸に回す角度, time:時間で動かすか});
 

です。Tweenerの導入方法はクリックしたら移動を参照してください。

赤いPlaneをクリックするとクルクル回ります↓
[embedSWF]http://kidokorock.com/wp-content/uploads/2009/05/plane_rotate.swf[/embedSWF]
サンプル

ソースは↓です。


package {
	import flash.display.Sprite;
	import flash.events.Event;



	//------------------------------------------------------------
	//                                             クラス読み込み
	import org.papervision3d.core.geom.Lines3D;
	import org.papervision3d.core.geom.renderables.Line3D;
	import org.papervision3d.core.geom.renderables.Vertex3D;
	import org.papervision3d.materials.special.LineMaterial;

	import org.papervision3d.cameras.Camera3D;
	import org.papervision3d.objects.DisplayObject3D;
	import org.papervision3d.render.BasicRenderEngine;
	import org.papervision3d.scenes.Scene3D;
	import org.papervision3d.view.Viewport3D;

	//Plane オブジェクトのクラスを追加
	import org.papervision3d.objects.primitives.Plane;
	import org.papervision3d.materials.special.CompositeMaterial;
	import org.papervision3d.materials.WireframeMaterial;
	import org.papervision3d.materials.ColorMaterial;

	//クリックイベントを有効
	import org.papervision3d.events.InteractiveScene3DEvent;
	import caurina.transitions.Tweener;

	[SWF(backgroundColor="#ffffff")];

	public class Main extends Sprite {
		//------------------------------------------------------------
		//                                                    変数定義
		private var lines3D:Lines3D;
		private var viewport:Viewport3D;
		private var scene:Scene3D;
		private var camera:Camera3D;
		private var renderer:BasicRenderEngine;
		private var rootNode:DisplayObject3D;

		public function Main() {
			//------------------------------------------------------------
			//                                         カメラ視点等の定義
			viewport=new Viewport3D(0,0,true,true);
			scene=new Scene3D  ;
			camera=new Camera3D  ;
			renderer=new BasicRenderEngine  ;
			rootNode=scene.addChild(new DisplayObject3D("rootNode"));
			//
			addChild(viewport);
			camera.zoom=1;
			camera.focus=1000;
			camera.x=200;
			camera.y=200;
			camera.target=DisplayObject3D.ZERO;
			//------------------------------------------------------------
			//                              ラインを投影するための変数定義
			//[X座標の線]
			var X_line:Line3D;
			var X_strV:Vertex3D;
			var X_endV:Vertex3D;
			var X_lineM:LineMaterial=new LineMaterial(0xFF0000,0.2);
			//[Y座標の線]
			var Y_line:Line3D;
			var Y_strV:Vertex3D;
			var Y_endV:Vertex3D;
			var Y_lineM:LineMaterial=new LineMaterial(0x00FF00,0.2);
			//[Z座標の線]
			var Z_line:Line3D;
			var Z_strV:Vertex3D;
			var Z_endV:Vertex3D;
			var Z_lineM:LineMaterial=new LineMaterial(0x0000FF,0.2);
			//
			lines3D=new Lines3D  ;
			scene.addChild(lines3D);
			//
			//------------------------------------------------------------
			//                                                   X座標の線
			X_strV=new Vertex3D(-1000,0,0);
			X_endV=new Vertex3D(1000,0,0);
			X_line=new Line3D(lines3D,X_lineM,2,X_strV,X_endV);
			lines3D.addLine(X_line);
			//------------------------------------------------------------
			//                                                   Y座標の線
			Y_strV=new Vertex3D(0,-1000,0);
			Y_endV=new Vertex3D(0,1000,0);
			Y_line=new Line3D(lines3D,Y_lineM,2,Y_strV,Y_endV);
			lines3D.addLine(Y_line);
			//------------------------------------------------------------
			//                                                   Z座標の線
			Z_strV=new Vertex3D(0,0,-1000);
			Z_endV=new Vertex3D(0,0,1000);
			Z_line=new Line3D(lines3D,Z_lineM,2,Z_strV,Z_endV);
			lines3D.addLine(Z_line);

			//------------------------------------------------------------
			//                                    Plane オブジェクトを追加

			//↓pMatというマテリアルを定義(マテリアルはテクスチャみたいなもんかな)
			var pMat:CompositeMaterial = new CompositeMaterial();
			//↓pMatにワイヤーフレームの要素を追加
			pMat.addMaterial(new WireframeMaterial(0x000000));
			//↓pMatに色の要素を追加
			pMat.addMaterial(new ColorMaterial(0xff0000));
			//↓pMatに裏面に色をつける
			pMat.doubleSided = true;

			//マテリアルに対してクリックイベントを有効にするためにinteractiveをtrueに
			pMat.interactive=true;


			//↓新たにplaneBという名前でplaneを定義して
			new Plane(pMat, 100, 100, 6, 6);
			//new Plane(マテリアルを設定 , 縦 , 横 , 横の分解数, 縦の分解数)
			//という感じでPlaneを設定
			var planeA:Plane = new Plane(pMat, 100, 100, 6, 6);
			//ここでlines3Dに追加する
			lines3D.addChild(planeA);


			//クリックイベントを追加
			planeA.addEventListener(InteractiveScene3DEvent.OBJECT_CLICK, onClickHandler);

			addEventListener(Event.ENTER_FRAME,onFrame);

		}

		public function onFrame(e:Event):void {
			//------------------------------------------------------------
			//                               マウスの座標でZ軸を基点に回転
			lines3D.yaw((mouseX - (stage.stageWidth / 2)) / (stage.width / 2) * 5);
			renderer.renderScene(scene,camera,viewport);
		}
		private function onClickHandler(e:Event) {
			var planeA:Plane=Plane(e.target);
			
			
			Tweener.addTween(planeA, {x:planeA.x, y:planeA.y, z:planeA.z, rotationX:Math.random() * 360,rotationY:Math.random() * 360,rotationZ:Math.random() * 360 ,time:2});
//			
			}
	}
}
ページトップへ