快速連結

2011年3月16日

讓作好的動態元件成為3D物件的貼圖


↑不用懷疑,他是3D,利用away3D+flash製作的簡單3D動畫,只要在畫面上按著拖曳,就會旋轉...



主要使用的是away3D的AnimatedBitmapMaterial類別去運行,可以動畫也可以讓顏色半透明。
基本核心語法如下:

var mc:MovieClip = new _AnimationClass();
var amat:AnimatedBitmapMaterial = new AnimatedBitmapMaterial(mc); 
amat.play(); 
var _p:Plane = new Plane({material:amat,width:100,height:100}); 
_p.yUp = false;
_p.bothsides = true;
view.scene.addChild(_p);

大概解釋一下──
1.首先要先NEW一個MovieClip物件出來。
2.並且宣告AnimatedBitmapMaterial是指定使用該MovieClip物件。
3.讓此AnimatedBitmapMaterial可以動畫。
4.設定一個plane貼上AnimatedBitmapMaterial。


那麼DEMO的FLASH的語法如下:

import away3d.primitives.Plane;
import away3d.containers.View3D;
import away3d.containers.Scene3D;
import away3d.materials.AnimatedBitmapMaterial;
import away3d.cameras.HoverCamera3D;

var camera:HoverCamera3D;
var scene:Scene3D;
var view:View3D;
var plane:Plane;
var amat:AnimatedBitmapMaterial;
var downX:Number=0;
var downY:Number=0;
var down:int=0;

//設定camera
camera = new HoverCamera3D();
camera.panAngle=180;
camera.tiltAngle=0;
camera.z=0;
camera.zoom=1;
camera.hover(true);

scene = new Scene3D();

//設定觀看的3D物件
view = new View3D();
view.scene=scene;
view.camera=camera;
view.x=400/2;
view.y=300/2;
addChild(view);

//AnimatedBitmapMaterial要得到的是一個movieClip哦!
var mc:MovieClip = new _TestClass();
amat=new AnimatedBitmapMaterial(mc);
amat.play();
plane=new Plane({material:amat,width:200,height:220});
plane.yUp=false;
plane.bothsides=true;
plane.z=camera.z+100;
view.scene.addChild(plane);

準備工作做好了,接下來就是實際功能運轉──

this.addEventListener(Event.ENTER_FRAME,onRedraw);
this.addEventListener(MouseEvent.MOUSE_DOWN,onDown);
this.addEventListener(MouseEvent.MOUSE_UP,onUp);

function onDown(e:MouseEvent):void {
  down=1;
  downX=stage.mouseX;
  downY=stage.mouseY;
}

function onUp(e:MouseEvent):void {
  down=0;
}


function onRedraw(e:Event):void {
  // 旋轉camera
  var rotX:Number=0;
  var rotY:Number=0;
  if (down==1) {
    var xm:Number=stage.mouseX;
    var ym:Number=stage.mouseY;
    if (Math.abs(ym-downY)/Math.abs(xm-downX)<Math.sqrt(3)/3) {
      rotX=(xm-downX)/40;
    } else if (Math.abs(ym-downY)/Math.abs(xm-downX)>=Math.sqrt(3)/3&&Math.abs(ym-downY)/Math.abs(xm-downX)<1) {
      rotX=(xm-downX)/40;
      rotY=(ym-downY)/40;
    } else {
      rotY=(ym-downY)/40;
    ]
    camera.tiltAngle+=rotY;
    camera.panAngle+=rotX;
  }
  camera.hover();
  view.render();  //讓view可以繪製在畫布上
}

沒有留言:

張貼留言

歡迎大家留言提問,我會答的都會盡力回答!
如果太久沒出現回應就是我又忘記回來看留言了TAT