Max の 3D Studio

【測試】Flash3D API(Molehill)Jiglib物理引擎範例

2011-03-11T10:49:00.001-08:00

此範例是參考Jiglib物理引擎改寫，
方向鍵可以控制車輛移動，
空白鍵停止。
車輛的材質還有反光效果。

demo

【測試】Flash3D API(Molehill) MD2模型範例

2011-03-10T03:50:00.000-08:00

寫了一個簡單範例demo，
現在Flash 3D API(Molehill)提供硬體支援，
跑起來順暢多了，
點擊滑鼠可以改變角色狀態。

demo

【教學】Flash 3D API(Molehill) Texture

2011-03-09T04:05:00.000-08:00

Flash 3D API(Molehill)目前一些知名的3D引擎已有支援，
像Alternativa3D、Away3D、Flare 3D 等，
透過這些現有引擎建立3D專案非常方便。
不過為了瞭解Flash 3D API的基本運作模式，
還是研究了一下，此範例就是延續DrawMesh範例，
Mesh由頂點著色改為貼上貼圖，
原本頂點緩衝內的顏色rgb值改為UV貼圖座標。

程式碼如下：


package
{
    import com.adobe.utils.AGALMiniAssembler;
    import com.adobe.utils.PerspectiveMatrix3D;

    import flash.display.Sprite;
    import flash.display.Stage3D;
    import flash.display.StageAlign;
    import flash.display.StageScaleMode;
    import flash.display3D.Context3D;
    import flash.display3D.Context3DRenderMode;
    import flash.events.Event;
    import flash.geom.Rectangle;
    import flash.display3D.VertexBuffer3D;
    import flash.display3D.Context3DVertexBufferFormat;
    import flash.display3D.IndexBuffer3D;
    import flash.display3D.Program3D;
    import flash.geom.Matrix3D;
    import flash.geom.Vector3D;
    import flash.display3D.Context3DProgramType;
    import flash.display3D.Context3DTextureFormat;
    import flash.display3D.textures.Texture;
    import flash.display.Bitmap;
    import flash.display.BitmapData;
    import flash.net.URLRequest;
    import flash.display.Loader;

    import MonitorKit;

    /**
     * ...Flash 3D API(Molehill) 貼圖範例
     * @author Max
     */
    public class Flash3D_Texture extends Sprite
    {
        private var sta3D:Stage3D;
        private var con3D:Context3D;
        private var vertexBuffer:VertexBuffer3D;
        private var indexBuffer:IndexBuffer3D;

        private var perspection:PerspectiveMatrix3D;
        private var modelProjection:Matrix3D;
        private var modelView:Matrix3D;

        private var texture:Texture;
        private var loaderObj:Loader;
        private var shaderpg3d:Program3D;

        public function Flash3D_Texture()
        {
            addEventListener(Event.ADDED_TO_STAGE, onAddtoStage);
        }

        private function onAddtoStage(event:Event):void
        {
            stage.align = StageAlign.TOP_LEFT;
            stage.scaleMode = StageScaleMode.NO_SCALE;
 
            sta3D = stage.stage3Ds[0];
            sta3D.addEventListener(Event.CONTEXT3D_CREATE, onCreateContext3D);
            sta3D.requestContext3D(Context3DRenderMode.AUTO);
 
            var FPS:MonitorKit = new MonitorKit(MonitorKit.MKMODE_TL);
            addChild(FPS);
        }

        private function onCreateContext3D(event:Event):void
        {
            con3D = sta3D.context3D;
            con3D.enableErrorChecking = true;
            initTexture();  
        }

        private function initTexture():void
        {
            loaderObj = new Loader();
            loaderObj.contentLoaderInfo.addEventListener(Event.COMPLETE,
                                                         onLoaderBmpComple);
            loaderObj.load(new URLRequest("pic.jpg"));
        }

        private function onLoaderBmpComple(event:Event):void
        {
            var tmploaderBmp:Bitmap = event.target.content as Bitmap;
            texture = con3D.createTexture( 256, 256,
                                           Context3DTextureFormat.BGRA, false);
            texture.uploadFromBitmapData(tmploaderBmp.bitmapData,0);
            initMesh();
        }

        private function initMesh():void
        {
            var vertexShader:Array =["dp4 op.x, va0, vc0",
                                     "dp4 op.y, va0, vc1",
                                     "dp4 op.z, va0, vc2",
                                     "dp4 op.w, va0, vc3",
                                     "mov v0, va1.xyzw"];
            var vertexAssembler:AGALMiniAssembler = new AGALMiniAssembler();
            vertexAssembler.assemble(flash.display3D.Context3DProgramType.VERTEX,
                                     vertexShader.join("\n"));
 
            var fragmentShader:Array =["mov ft0, v0\n",
                                       "tex ft1, ft0, fs1 <2d,clamp,linear>\n",
                                       "mov oc, ft1\n"];
            var fragmentAssembler:AGALMiniAssembler = new AGALMiniAssembler();
            fragmentAssembler.assemble(flash.display3D.Context3DProgramType.FRAGMENT,
                                       fragmentShader.join("\n"));
 
            shaderpg3d = con3D.createProgram();
            shaderpg3d.upload(vertexAssembler.agalcode, fragmentAssembler.agalcode);
 
            indexBuffer = con3D.createIndexBuffer(6);
            indexBuffer.uploadFromVector(Vector.([0, 1, 2, 0, 2, 3]), 0, 6);
  
            vertexBuffer = con3D.createVertexBuffer(4, 4);
            vertexBuffer.uploadFromVector(Vector.([-1.0, 1.0,0.0,1.0,
                                                           -1.0,-1.0,0.0,0.0,
                                                            1.0,-1.0,1.0,0.0,
                                                            1.0, 1.0,1.0,1.0]),0,4);
 
            con3D.setVertexBufferAt( 0, vertexBuffer, 0,
                                     Context3DVertexBufferFormat.FLOAT_2);
            con3D.setVertexBufferAt( 1, vertexBuffer, 2,
                                     Context3DVertexBufferFormat.FLOAT_2);
            con3D.setTextureAt(1, texture);
 
            addEventListener(Event.ENTER_FRAME, on3DRender);
            stage.addEventListener(Event.RESIZE, onResizeStage);
            onResizeStage();
        }

        private function drawMesh():void
        {
            con3D.setProgram(shaderpg3d);
 
            modelView = new Matrix3D();
            modelView.identity();
            modelView.position = new Vector3D(0, 0, 2, 1);
            modelView.appendScale(1, -1, 1);
 
            perspection = new PerspectiveMatrix3D();
            perspection.identity();
            perspection.perspectiveLH(5.5, 4, 1, 100);
 
            modelProjection = new Matrix3D();
            modelProjection.identity();
            modelProjection.position = new Vector3D(0, 0, 0, 1);
            modelProjection.appendRotation(stage.mouseX/4,
                                           new Vector3D(0, 1, 0, 1),null);
            modelProjection.append(modelView);
            modelProjection.append(perspection);
 
            con3D.setCulling("none");
            con3D.setProgramConstantsFromMatrix(Context3DProgramType.VERTEX,
                                                0,modelProjection,true);
            con3D.drawTriangles(indexBuffer, 0, 2);
        }

        private function onResizeStage(event:Event=null):void
        {
            con3D.configureBackBuffer(stage.stageWidth, stage.stageHeight,2,true);
            sta3D.viewPort = new Rectangle(0,0,stage.stageWidth,stage.stageHeight);
            on3DRender();
        }

        private function on3DRender(event:Event=null):void
        {
            con3D.clear(0.0, 0.0, 0.5, 1.0);
            drawMesh();
            con3D.present();
        }
    }
}

執行結果：

demo

【教學】Flash 3D API(Molehill) DrawSquareMesh

2011-03-08T05:19:00.000-08:00

這是DrawTriangleMesh範例的延伸，
也就是再增加一個頂點，
四個頂點組成兩個三角面，
其繪製的方式一樣。

程式碼如下：


package 
{
    import com.adobe.utils.AGALMiniAssembler;
    import com.adobe.utils.PerspectiveMatrix3D; 

    import flash.display.Sprite;
    import flash.display.Stage3D;
    import flash.display.StageAlign;
    import flash.display.StageScaleMode;
    import flash.display3D.Context3D;
    import flash.display3D.Context3DProgramType;
    import flash.display3D.Context3DRenderMode;
    import flash.display3D.Context3DTextureFormat;
    import flash.display3D.Context3DVertexBufferFormat;
    import flash.display3D.IndexBuffer3D;
    import flash.display3D.Program3D;
    import flash.display3D.VertexBuffer3D;
    import flash.events.Event;
    import flash.geom.Matrix3D;
    import flash.geom.PerspectiveProjection;
    import flash.geom.Rectangle;
    import flash.geom.Vector3D;

    public class Flash3D_DrawMesh extends Sprite
    {
        private var sta3D:Stage3D;
        private var con3D:Context3D;
 
        private var indexBuffer:IndexBuffer3D; 
        private var perspection:PerspectiveMatrix3D;
        private var modelProjection:Matrix3D;
        private var modelView:Matrix3D;
  
        private var ro:Number = 5;
  
        public function Flash3D_DrawMesh()
        {
            addEventListener(Event.ADDED_TO_STAGE, onAddtoStage);
        }
  
        public function onAddtoStage(event:Event):void
        {
            stage.align = StageAlign.TOP_LEFT;
            stage.scaleMode = StageScaleMode.NO_SCALE;
            stage.frameRate = 30;
    
            sta3D = stage.stage3Ds[0];
            sta3D.addEventListener(Event.CONTEXT3D_CREATE,onCreateContext3D);
            sta3D.requestContext3D(Context3DRenderMode.AUTO); 
   
            var FPS:MonitorKit = new MonitorKit(MonitorKit.MKMODE_TL);
            addChild(FPS);
        }
  
        public function onCreateContext3D(event:Event):void
        {
            con3D = sta3D.context3D;
            con3D.enableErrorChecking = true;
     
            initMesh();
   
            addEventListener(Event.ENTER_FRAME,on3DRender);
            stage.addEventListener(Event.RESIZE,onResizeStage);
            onResizeStage();  
        }
  
        public function onResizeStage(event:Event = null):void
        { 
            con3D.configureBackBuffer(stage.stageWidth,stage.stageHeight,2,true);
            sta3D.viewPort = new Rectangle(0,0,stage.stageWidth,stage.stageHeight); 
            on3DRender();
        }
  
        public function initMesh():void
        {  
            var vertexAssembler:AGALMiniAssembler = new AGALMiniAssembler();
            vertexAssembler.assemble(Context3DProgramType.VERTEX,"m44 op,va0,vc \n"+
                                                                 "mov v0,va1");
   
            var fragmentAssembler:AGALMiniAssembler = new AGALMiniAssembler();
            fragmentAssembler.assemble(Context3DProgramType.FRAGMENT,"mov oc,v0");
                
            var vertexBuffer:VertexBuffer3D = con3D.createVertexBuffer(4,6);
            vertexBuffer.uploadFromVector(Vector.([-1, 1,0,1,0,0,
                                                           -1,-1,0,1,1,0,
                                                            1,-1,0,1,0,1,
                                                            1, 1,0,1,0,0]),0,4);

            con3D.setVertexBufferAt(0,vertexBuffer,0,
                                    Context3DVertexBufferFormat.FLOAT_3);
            con3D.setVertexBufferAt(1,vertexBuffer,3,
                                    Context3DVertexBufferFormat.FLOAT_3);
   
            indexBuffer= con3D.createIndexBuffer(6);
            indexBuffer.uploadFromVector(Vector.([0,1,2,0,2,3]),0,6);
   
            var program:Program3D = con3D.createProgram();
            program.upload(vertexAssembler.agalcode,fragmentAssembler.agalcode);
            con3D.setProgram(program);
   
            modelView = new Matrix3D();
            modelView.identity();
     
            perspection = new PerspectiveMatrix3D();
            perspection.identity();
            perspection.perspectiveLH(5.5, 4, 1, 10000); 
   
            modelProjection = new Matrix3D(); 
        }
        
        private function drawMesh():void
        {
            modelView.position = new Vector3D(0,0,1.5,1); 
            modelView.appendRotation(ro,Vector3D.Z_AXIS, null); 
   
            modelProjection.identity();
            modelProjection.append(modelView);
            modelProjection.append(perspection); 
     
            con3D.setCulling("front");
            con3D.setProgramConstantsFromMatrix( Context3DProgramType.VERTEX,
                                                 0,modelProjection,true);
            con3D.drawTriangles(indexBuffer,0,2);
        }
  
        private function on3DRender(event:Event=null):void
        {
            con3D.clear(0.0, 0.0, 0.5, 1.0); 
            drawMesh();
            con3D.present();
        } 
    }
}

demo

【教學】Flash 3D API(Molehill) DrawTriangleMesh

2011-03-07T05:31:00.001-08:00

利用先前範例所建立的基本框架，
新增initMesh()函式，運用頂點緩衝與索引緩衝建立三角面，
再透過AGALMiniAssembler來填上顏色，
最後DrawMesh()把結果畫上。

程式碼如下：


package
{
    import com.adobe.utils.AGALMiniAssembler;
    import com.adobe.utils.PerspectiveMatrix3D;
 
    import flash.display.Sprite;
    import flash.display.Stage3D;
    import flash.display.StageAlign;
    import flash.display.StageScaleMode;
    import flash.display3D.Context3D;
    import flash.display3D.Context3DProgramType;
    import flash.display3D.Context3DRenderMode;
    import flash.display3D.Context3DTextureFormat;
    import flash.display3D.Context3DVertexBufferFormat;
    import flash.display3D.IndexBuffer3D;
    import flash.display3D.Program3D;
    import flash.display3D.VertexBuffer3D;
    import flash.events.Event;
    import flash.geom.Matrix3D;
    import flash.geom.PerspectiveProjection;
    import flash.geom.Rectangle;
    import flash.geom.Vector3D;
 
    public class Flash3D_DrawTriangle extends Sprite
    {
        private var sta3D:Stage3D;
        private var con3D:Context3D;
  
        private var vertexBuffer:VertexBuffer3D;
        private var indexBuffer:IndexBuffer3D; 
  
        private var modelView:Matrix3D;
        private var modelProjection:Matrix3D;
        private var perspection:PerspectiveMatrix3D;
  
        private var ro:Number = 5;
        private var pos:Vector3D;
  
        public function Flash3D_DrawTriangle()
        {
            addEventListener(Event.ADDED_TO_STAGE, onAddtoStage);
        }
  
        public function onAddtoStage(event:Event):void
        {
            stage.align = StageAlign.TOP_LEFT;
            stage.scaleMode = StageScaleMode.NO_SCALE;
            stage.frameRate = 30;
   
            sta3D = stage.stage3Ds[0];
            sta3D.addEventListener(Event.CONTEXT3D_CREATE, onCreateContext3D);
            sta3D.requestContext3D(Context3DRenderMode.AUTO);
   
            var FPS:MonitorKit = new MonitorKit(MonitorKit.MKMODE_TL);
            addChild(FPS);
        }
  
        public function onCreateContext3D(event:Event):void
        {
            con3D = sta3D.context3D;
            con3D.enableErrorChecking = true;
      
            initMesh();
   
            addEventListener(Event.ENTER_FRAME, on3DRender);
            stage.addEventListener(Event.RESIZE, onResizeStage);
            onResizeStage();  
        }
  
        public function onResizeStage(event:Event = null):void
        { 
            con3D.configureBackBuffer(stage.stageWidth, stage.stageHeight, 2, true);
            sta3D.viewPort = new Rectangle(0,0,stage.stageWidth, stage.stageHeight);
            on3DRender();
        }
  
        public function initMesh():void
        {
            var vertexAssembler:AGALMiniAssembler = new AGALMiniAssembler();
            vertexAssembler.assemble(Context3DProgramType.VERTEX,"m44 op,va0,vc0 \n"+
                                                                 "mov v0,va1");
   
            var fragmentAssembler:AGALMiniAssembler = new AGALMiniAssembler();
            fragmentAssembler.assemble(Context3DProgramType.FRAGMENT,"mov oc,v0");
    
            vertexBuffer = con3D.createVertexBuffer(3,6);
            vertexBuffer.uploadFromVector(Vector.([ 0, 1,0,1,0,0,
                                                           -1,-1,0,0,1,0,
                                                            1,-1,0,0,0,1,]),0, 3);
                
           con3D.setVertexBufferAt(0,vertexBuffer,0,
                                   Context3DVertexBufferFormat.FLOAT_3);
           con3D.setVertexBufferAt(1,vertexBuffer,3,
                                   Context3DVertexBufferFormat.FLOAT_3);
   
           indexBuffer = con3D.createIndexBuffer(3);
           indexBuffer.uploadFromVector(Vector.([0,1,2]),0,3);
   
           var program:Program3D = con3D.createProgram();
           program.upload(vertexAssembler.agalcode,fragmentAssembler.agalcode);
           con3D.setProgram(program);
   
           modelView = new Matrix3D();
           modelView.identity();
           pos = new Vector3D(0,0,2,1);
   
           perspection = new PerspectiveMatrix3D();
           perspection.identity();
           perspection.perspectiveLH(2.8,2,1,10000);  
        }

        public function DrawMesh():void
        {
            modelView.position = pos;
            modelView.appendRotation(ro,Vector3D.Y_AXIS, null);
   
            modelProjection = new Matrix3D();
            modelProjection.identity();
            modelProjection.append(modelView);
            modelProjection.append(perspection);
   
            con3D.setCulling("none");
            con3D.setProgramConstantsFromMatrix(Context3DProgramType.VERTEX,
                                                0,modelProjection,true);
            con3D.drawTriangles(indexBuffer,0,-1);
        }
  
        public function on3DRender(event:Event):void
        {
            con3D.clear(0.0, 0.0, 0.5, 1.0);
            DrawMesh(); 
            con3D.present();
        } 
    }
}

執行結果：

demo

【教學】Flash 3D API(Molehill) 基本框架建立

2011-03-06T06:27:00.000-08:00

Molehill 3D前陣子很多人在討論，
最近也研究了一下，發現3D環境都是大同小異，
所以寫了一個3D的基本框架測試範例，
使用到 Flex SDK Hero(版本19784)，
Flash Player 11.0.0.58 Incubator，
本範例開發工具使用FlashDevelop，
也可以使用Adobe Flash Builder 4或Flash CS5。

程式碼如下：


package
{
    import flash.display.Sprite;
    import flash.display.Stage3D;
    import flash.display.StageAlign;
    import flash.display.StageScaleMode;
    import flash.display3D.Context3D;
    import flash.display3D.Context3DRenderMode;
    import flash.events.Event;
    import flash.geom.Matrix3D;
    import flash.geom.Rectangle;
 
    import MonitorKit;
 
    /**
    * ...Flash 3D Framework
    * @author Max
    */
    public class Flash3D_Framework extends Sprite
    {
        private var sta3D:Stage3D;
        private var con3D:Context3D;
  
    public function Flash3D_Framework():void
    {
       addEventListener(Event.ADDED_TO_STAGE, onAddtoStage); 
    }
  
    public function onAddtoStage(event:Event):void
    {
       stage.align = StageAlign.TOP_LEFT;
       stage.scaleMode = StageScaleMode.NO_SCALE;
  
       sta3D = stage.stage3Ds[0];
       sta3D.addEventListener(Event.CONTEXT3D_CREATE, onCreateContext3D);
       sta3D.requestContext3D(Context3DRenderMode.AUTO);
       // 設定FPS
       var FPS:MonitorKit = new MonitorKit(MonitorKit.MKMODE_TL);
       addChild(FPS);
    }
  
    public function onCreateContext3D(event:Event):void
    {
       con3D = sta3D.context3D;
       con3D.enableErrorChecking = true;
   
       addEventListener(Event.ENTER_FRAME, on3DRender);
       stage.addEventListener(Event.RESIZE, onResizeStage);
       onResizeStage();  
    }
  
    public function onResizeStage(event:Event = null):void
    {
       // 設定背景緩衝
        con3D.configureBackBuffer(stage.stageWidth, stage.stageHeight, 2, true);
       // 讓成像大小等於stage的大小
        sta3D.viewPort = new Rectangle(0, 0, stage.stageWidth, stage.stageHeight);
       on3DRender();
    }
    // 3D渲染 
    public function on3DRender(event:Event = null):void
    {
       // 設定3D背景色(rgba)
       con3D.clear(0.0, 0.0, 0.5, 1.0);
       // ...
       // 要繪製3D的處理可以加在這...
       // ...   
       con3D.present();
    }
  }
}

執行結果：

【教學】Director 3D與PhysX 物理引擎

2010-11-17T10:17:00.001-08:00

CasetMember視窗:

Lingo程式代碼:
----------Movie Script:"main"


global pDirPhyz  -- 物理引擎
global pTimeStep -- 影響時間
global pSubSteps -- 計算動力係數
global resSphere -- 球的模型資源
global modSphere -- 球的模型
global resBox    -- 方塊的模型資源
global modBox    -- 方塊模型
global resFloor  -- 地板模型資源
global modFloor  -- 地板模型

on startmovie
 
  --W3D
  member("Scene3D").resetworld()
 
  -------------------------------------
  --建立球體模型
  resSphere = member("Scene3D").newModelResource("SphereRes",#sphere,#front)
  resSphere.radius = 10
  resSphere.resolution = 6
 
  modSphere = member("Scene3D").newModel("SphereRes")
  modSphere.resource = resSphere
  modSphere.transform.position = vector(50,100,-20)
  modSphere.addmodifier(#meshdeform)
 
 
  -------------------------------------
  --建立方塊模型
  resBox = member("Scene3D").newModelResource("BoxRes",#Box,#front)
  resBox.height = 5
  resBox.width = 100
  resBox.length = 100
  resBox.lengthVertices = 5
  resBox.widthVertices = 5
  resBox.heightVertices = 2
 
  modBox = member("Scene3D").newModel("BoxRes")
  modBox.resource = resBox
  modBox.transform.position = vector(20,0,-20)
  modBox.transform.rotation = vector(10,10,20)
  modBox.addmodifier(#meshdeform)
 
  -----------------------------------------
  --建立地板模型
  resFloor = member("Scene3D").newModelResource("FloorRes",#Box,#front)
  resFloor.height = 5
  resFloor.width = 200
  resFloor.length = 200
  resFloor.lengthVertices = 5
  resFloor.widthVertices = 5
  resFloor.heightVertices = 2
 
  modFloor = member("Scene3D").newModel("FloorRes")
  modFloor.resource = resFloor
  modFloor.transform.position = vector(0,-70,0)
  modFloor.transform.rotation = vector(0,0,0)
  modFloor.addmodifier(#meshdeform)
 
  ------------------------------------------
  --物理引擎
  pDirPhyz = member("physX")
  pTimeStep = 0.2
  pSubSteps = 10
 
  --初始引擎
  pDirPhyz.Init(member("Scene3D"), vector(1,1,1),#equal, pTimeStep, pSubSteps )
  pDirPhyz.gravity = vector(0,-9.8,0)
  pDirPhyz.contacttolerance = 0.2
  pDirPhyz.friction = 0.2
  pDirPhyz.lineardamping = 0.4
  pDirPhyz.angulardamping = 0.4
  pDirPhyz.restitution = 0.9
 
  --引擎套用到球模型
  rb_ball=pDirPhyz.createRigidBody(modSphere.name,modSphere.name,#sphere,#dynamic)
  rb_ball.mass = 100
 
  --引擎套用到方塊模型
  rb_box=pDirPhyz.createRigidBody(modBox.name,modBox.name,#Box,#static )
  rb_box.mass = 100
 
  --引擎套用到地板模型
  rb_floor=pDirPhyz.createRigidBody(modFloor.name,modFloor.name,#Box,#static )
  rb_floor.mass = 100
 
end

on endSprite me
  if (pDirPhyz.isInitialized = 1) then
    pDirPhyz.destroy()
  end if
end

----------Frame Script:"loop"


global pDirPhyz  -- 物理引擎
global pTimeStep -- 影響時間
global pSubSteps -- 計算動力係數

on exitFrame
  pDirPhyz.simulate()
 
  go to the frame
end

Score視窗:

執行結果:

demo

【教學】Android OpenGL ES LoadTexture

2010-11-15T05:55:00.000-08:00

本範例是利用先前建立好的3D的基本框架，
於A3DRender類別內增加一個建立平面的方法，
並於該平面上貼上一張512*512的pic.png貼圖，
貼圖置於專案res/drawable/內，
專案為A3DLoadTexture，其A3DMain內容不變，
如下圖：

A3DView類別內部分修正，
於A3DRender()內增加context參數:


package com.max;

import android.content.Context;
import android.opengl.GLSurfaceView;
import com.max.A3DRender;

public class A3DView extends GLSurfaceView{
  private A3DRender mA3DRender;
  public A3DView(Context cont){
    super(cont);
    mA3DRender = new A3DRender(cont);
    setRenderer(mA3DRender);
  }
}

A3DRender類別程式碼:


package com.max;

import android.opengl.GLSurfaceView;
import javax.microedition.khronos.egl.EGLConfig;
import javax.microedition.khronos.opengles.GL10;
import android.opengl.GLU;
import android.opengl.GLUtils;
import java.nio.ByteBuffer;
import java.nio.ByteOrder;
import java.nio.FloatBuffer;
import java.nio.ShortBuffer;
import java.io.InputStream;
import java.io.IOException;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;

public class A3DRender implements GLSurfaceView.Renderer{

  private Context context;
  private final static int VERTS = 4;
  //頂點座標
  float squVtx[] = { -1.0f,  1.0f,  0.0f,  //v0
                     -1.0f, -1.0f,  0.0f,  //v1
                      1.0f, -1.0f,  0.0f,  //v2
                      1.0f,  1.0f,  0.0f };//v3
  //頂點索引
  short squInx[] = { 0, 1, 2,   //Face1
                     0, 2, 3 }; //Face2
  //UV貼圖座標
  float squTex[] ={ 0.0f, 0.0f,  //v0
                    0.0f, 1.0f,  //v1
                    1.0f, 1.0f,  //v2
                    1.0f, 0.0f };//v3

  private int[] textureID = new int[1];
 
  public A3DRender(Context context){
    this.context = context;
  }
 
  @Override
  public void onSurfaceCreated(GL10 gl, EGLConfig config){
    gl.glClearColor(0.2f, 0.2f, 0.2f, 1.0f);
    gl.glClearDepthf(1.0f);
    gl.glEnable(GL10.GL_DEPTH_TEST);
    gl.glDepthFunc(GL10.GL_LEQUAL);
    gl.glHint(GL10.GL_PERSPECTIVE_CORRECTION_HINT, GL10.GL_NICEST);
    gl.glShadeModel(GL10.GL_SMOOTH);
    gl.glDisable(GL10.GL_DITHER);
    //載入貼圖  
    LoadTexture(gl,context);
    gl.glEnable(GL10.GL_TEXTURE_2D);
  }
 
  @Override
  public void onSurfaceChanged(GL10 gl, int w, int h){
    if(h==0)h=1;
    float aspect = (float)w/h; 
    gl.glViewport(0, 0, w, h);
    gl.glMatrixMode(GL10.GL_PROJECTION);
    gl.glLoadIdentity(); 
    GLU.gluPerspective(gl, 45, aspect, 0.1f, 100.0f);
  }
 
  @Override
  public void onDrawFrame(GL10 gl){
    gl.glClear(GL10.GL_COLOR_BUFFER_BIT | GL10.GL_DEPTH_BUFFER_BIT);  
    gl.glMatrixMode(GL10.GL_MODELVIEW);
    gl.glLoadIdentity();
    GLU.gluLookAt(gl, 0, 0, 4, 0, 0, 0, 0, 1, 0);
    gl.glFrontFace(GL10.GL_CCW);
    gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
    gl.glEnableClientState(GL10.GL_TEXTURE_COORD_ARRAY);
    //建立平面 
    initPlane(gl, squVtx , squInx, squTex);
  }
 
  private void initPlane(GL10 gl,float[] vtx, short[] inx , float[] tx){ 
    gl.glVertexPointer( 3, GL10.GL_FLOAT, 0, getFloatBuffer(vtx));
    gl.glTexCoordPointer( 2, GL10.GL_FLOAT, 0, getFloatBuffer(tx));
    gl.glDrawElements(GL10.GL_TRIANGLES,
                      inx.length, 
                      GL10.GL_UNSIGNED_SHORT, 
                      getShortBuffer(inx));
  }
 
  private void LoadTexture(GL10 gl, Context cont){
    gl.glGenTextures(1, textureID, 0); 
    gl.glBindTexture(GL10.GL_TEXTURE_2D, textureID[0]);
    gl.glTexParameterf(GL10.GL_TEXTURE_2D, 
                       GL10.GL_TEXTURE_MAG_FILTER, 
                       GL10.GL_LINEAR);
    gl.glTexParameterf(GL10.GL_TEXTURE_2D,
                       GL10.GL_TEXTURE_MIN_FILTER,
                       GL10.GL_LINEAR);
  
    InputStream istream = cont.getResources().openRawResource(R.drawable.pic);
    Bitmap bitmap;
    try{
      bitmap = BitmapFactory.decodeStream(istream);
    }finally{
      try{
        istream.close();
      }catch(IOException e){
      }
    } 
    GLUtils.texImage2D( GL10.GL_TEXTURE_2D, 0, bitmap, 0 ); 
    bitmap.recycle();
  }
 
  private FloatBuffer getFloatBuffer(float[] table ){
    ByteBuffer bb = ByteBuffer.allocateDirect(table.length * 4);
    bb.order(ByteOrder.nativeOrder());
    FloatBuffer fb = bb.asFloatBuffer();
    fb.put(table);
    fb.position(0);
    return fb;
  }
 
  private ShortBuffer getShortBuffer(short[] array ){
    ByteBuffer ib = ByteBuffer.allocateDirect(array.length * 2);
    ib.order(ByteOrder.nativeOrder());
    ShortBuffer sb = ib.asShortBuffer();
    sb.put(array);
    sb.position(0);
    return sb;
  }
}

執行結果：

【教學】Android OpenGL ES Primitive_Cube

2010-11-11T20:27:00.000-08:00

本範例是利用先前建立好的3D的基本框架，
於A3DRender類別內增加畫方體的方法，
先前畫Mesh範例用到頂點緩衝，
此次增加索引緩衝，
先定義出八個頂點的位置資訊，
再用索引依序定義出各個三角面，
專案為A3DCube，其A3DMain與A3DView內容不變，
如下圖：

A3DRender內新增drawCube方法，
此方法只用簡單的頂點緩衝VertexBuffer與索引緩衝IndexBuffer，
透過OpenGL函式glDrawElements來畫出方體。
程式碼如下：


package com.max;

import android.opengl.GLSurfaceView;
import android.opengl.GLU;
import android.os.SystemClock;
import javax.microedition.khronos.egl.EGLConfig;
import javax.microedition.khronos.opengles.GL10;
import java.nio.ByteBuffer;
import java.nio.ByteOrder;
import java.nio.FloatBuffer;
import java.nio.ShortBuffer;

public class A3DRender implements GLSurfaceView.Renderer{

  private final static int VERTS = 8;
  //頂點座標
  float cubeVtx[] = { -1.0f,  1.0f, -1.0f,   //v0
                      -1.0f,  1.0f,  1.0f,   //v1
                       1.0f,  1.0f,  1.0f,   //v2
                       1.0f,  1.0f, -1.0f,   //v3
                      -1.0f, -1.0f, -1.0f,   //v4
                      -1.0f, -1.0f,  1.0f,   //v5
                       1.0f, -1.0f,  1.0f,   //v6
                       1.0f, -1.0f, -1.0f }; //v7
  //頂點索引
  short cubeInx[] = { 0, 1, 2,   //Top_Face1
                      0, 2, 3,   //Top_Face2
                      4, 6, 5,   //Bottom_Face1
                      4, 7, 6,   //Bottom_Face2
                      2, 6, 7,   //Left_face1
                      2, 7, 3,   //Left_Face2
                      0, 4, 1,   //Right_Face1
                      1, 4, 5,   //Right_Face2
                      1, 5, 6,   //Front_Face1
                      1, 6, 2,   //Front_Face2
                      0, 3, 4,   //Back_Face1
                      3, 7, 4 }; //Back_Face2
 
  @Override
  public void onSurfaceCreated(GL10 gl,EGLConfig config){
    gl.glClearColor(0.2f, 0.2f, 0.2f, 1.0f); 
    gl.glShadeModel(GL10.GL_SMOOTH);
    gl.glHint(GL10.GL_POINT_SMOOTH_HINT, GL10.GL_FASTEST); 
    gl.glClearDepthf(1.0f);
    gl.glDepthFunc(GL10.GL_LEQUAL);
    gl.glEnable(GL10.GL_DEPTH_TEST);  
  }
 
  @Override
  public void onSurfaceChanged(GL10 gl,int w,int h){
    gl.glViewport(0, 0, w, h);
    float ratio;
    ratio = (float)w/h;
    gl.glMatrixMode(GL10.GL_PROJECTION);
    gl.glLoadIdentity(); 
    gl.glFrustumf(-ratio, ratio, -1, 1, 1, 10);  
  }
 
  @Override
  public void onDrawFrame(GL10 gl){ 
    gl.glClear(GL10.GL_COLOR_BUFFER_BIT | GL10.GL_DEPTH_BUFFER_BIT); 
    gl.glMatrixMode(GL10.GL_MODELVIEW);
    gl.glLoadIdentity(); 
    GLU.gluLookAt(gl, 0, 0, 4, 0, 0, 0, 0, 1, 0);
    gl.glFrontFace(GL10.GL_CCW);  
    gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
    //設置光源 
    gl.glEnable(GL10.GL_LIGHT1);
    FloatBuffer lightAmbient = FloatBuffer.wrap(new float[]{0.2f,0.0f,0.0f,1.0f});
    FloatBuffer lightDiffuse = FloatBuffer.wrap(new float[]{0.8f,0.0f,0.0f,1.0f});
    FloatBuffer lightSpecular =  FloatBuffer.wrap(new float[]{1.0f,0.0f,0.0f,1.0f});
    FloatBuffer lightPosition = FloatBuffer.wrap(new float[]{3.0f,4.0f,10.0f,1.0f});
    gl.glLightfv(GL10.GL_LIGHT1, GL10.GL_AMBIENT, lightAmbient);
    gl.glLightfv(GL10.GL_LIGHT1, GL10.GL_DIFFUSE, lightDiffuse);
    gl.glLightfv(GL10.GL_LIGHT1, GL10.GL_SPECULAR, lightSpecular);
    gl.glLightfv(GL10.GL_LIGHT1, GL10.GL_POSITION, lightPosition);
    gl.glEnable(GL10.GL_LIGHTING);
    //動態旋轉  
    long time = SystemClock.uptimeMillis()% 4000L;
    float angle = 0.090f * ((int)time);
    gl.glRotatef(angle, 1.0f, 0.0f, 0.0f);
    gl.glRotatef(angle, 0.0f, 1.0f, 0.0f);
    gl.glRotatef(angle, 0.0f, 0.0f, 1.0f);
    //畫出方體  
    drawCube( gl, cubeVtx , cubeInx );   
  }
 
  private void drawCube(GL10 gl,float[] vtx, short[] inx){ 
    gl.glVertexPointer( 3, GL10.GL_FLOAT, 0, getFloatBuffer(vtx));
    //透過索引緩衝來畫三角面
    gl.glDrawElements(GL10.GL_TRIANGLES,
                      inx.length,
                      GL10.GL_UNSIGNED_SHORT,
                      getShortBuffer(inx));
  }

  //頂點緩衝  
  private FloatBuffer getFloatBuffer(float[] array ){
    ByteBuffer bb = ByteBuffer.allocateDirect(array.length * 4);
    bb.order(ByteOrder.nativeOrder());
    FloatBuffer fb = bb.asFloatBuffer();
    fb.put(array);
    fb.position(0);
    return fb;
  }

  //索引緩衝
  private ShortBuffer getShortBuffer(short[] array ){
    ByteBuffer ib = ByteBuffer.allocateDirect(array.length * 2);
    ib.order(ByteOrder.nativeOrder());
    ShortBuffer sb = ib.asShortBuffer();
    sb.put(array);
    sb.position(0);
    return sb;
  }
}

執行結果：

【教學】Android OpenGL ES Primitive_Sphere

2010-11-05T06:57:00.000-07:00

本範例是利用先前建立好的3D的基本框架，
於A3DRender類別內增加畫球體的方法，
於場景中增加一個光源，
專案為A3DSphere，其A3DMain與A3DView內容不變，
如下圖：

程式碼如下:


package com.max;

import android.opengl.GLSurfaceView;
import android.opengl.GLU;
import javax.microedition.khronos.egl.EGLConfig;
import javax.microedition.khronos.opengles.GL10;
import java.nio.ByteBuffer;
import java.nio.ByteOrder;
import java.nio.FloatBuffer;

public class A3DRender implements GLSurfaceView.Renderer{
 
  @Override
  public void onSurfaceCreated(GL10 gl,EGLConfig config){
    gl.glClearColor(0.0f, 0.0f, 0.0f, 1.0f); 
    gl.glShadeModel(GL10.GL_SMOOTH);
    gl.glHint(GL10.GL_POINT_SMOOTH_HINT, GL10.GL_FASTEST); 
    gl.glClearDepthf(1.0f);
    gl.glDepthFunc(GL10.GL_LEQUAL);
    gl.glEnable(GL10.GL_DEPTH_TEST);
  }
 
  @Override
  public void onSurfaceChanged(GL10 gl,int w,int h){
    gl.glViewport(0, 0, w, h);
    float ratio;
    ratio = (float)w/h;
    gl.glMatrixMode(GL10.GL_PROJECTION);
    gl.glLoadIdentity(); 
    gl.glFrustumf(-ratio, ratio, -1, 1, 1, 10);  
  }
 
  @Override
  public void onDrawFrame(GL10 gl){ 
    gl.glClear(GL10.GL_COLOR_BUFFER_BIT | GL10.GL_DEPTH_BUFFER_BIT); 
    gl.glMatrixMode(GL10.GL_MODELVIEW);
    gl.glLoadIdentity(); 
    GLU.gluLookAt(gl, 0, 0, 6, 0, 0, 0, 0, 1, 0);
    gl.glFrontFace(GL10.GL_CCW);
    gl.glEnable(GL10.GL_LIGHT1);
    //設置光源
    FloatBuffer lightAmbient = FloatBuffer.wrap(new float[]{0.2f,0.0f,0.0f,1.0f});
    FloatBuffer lightDiffuse = FloatBuffer.wrap(new float[]{0.8f,0.0f,0.0f,1.0f});
    FloatBuffer lightSpecular = FloatBuffer.wrap(new float[]{1.0f,0.0f,0.0f,1.0f});
    FloatBuffer lightPosition = FloatBuffer.wrap(new float[]{3.0f,4.0f,10.0f,1.0f});
    gl.glLightfv(GL10.GL_LIGHT1, GL10.GL_AMBIENT, lightAmbient);
    gl.glLightfv(GL10.GL_LIGHT1, GL10.GL_DIFFUSE, lightDiffuse);
    gl.glLightfv(GL10.GL_LIGHT1, GL10.GL_SPECULAR, lightSpecular);
    gl.glLightfv(GL10.GL_LIGHT1, GL10.GL_POSITION, lightPosition);
    gl.glEnable(GL10.GL_LIGHTING);
    //畫球體
    drawSphere( gl, 2.0f, 32, 24 );
  }
 
  private void drawSphere(GL10 gl, float radius, int stacks, int slices){
    FloatBuffer vertex = allocateFloatBuffer(4*6*stacks*(slices+1));
    FloatBuffer normal = allocateFloatBuffer(4*6*stacks*(slices+1));
    int triangles;
    float stackstemp;
    float slicestemp;
    stackstemp = (float)Math.PI / stacks;
    slicestemp = 2.0f*(float)Math.PI/ slices;
    int i;
    for(i=0; i < stacks; ++i ){
      float a = i*stackstemp;
      float b = a+stackstemp;
      float s0 = (float)Math.sin(a);
      float s1 = (float)Math.sin(b);
      float c0 = (float)Math.cos(a);
      float c1 = (float)Math.cos(b); 
      float nv;
      for(int j=0; j<= slices;++j){
        float c = j*slicestemp;
        float x = (float)Math.cos(c);
        float y = (float)Math.sin(c);
        nv = x * s0;
        normal.put(nv);
        vertex.put(nv*radius); 
        nv = y * s0;
        normal.put(nv);
        vertex.put(nv*radius); 
        nv = c0;
        normal.put(nv);
        vertex.put(nv*radius); 
        nv = x * s1;
        normal.put(nv);
        vertex.put(nv*radius); 
        nv = y * s1;
        normal.put(nv);
        vertex.put(nv*radius); 
        nv = c1;
        normal.put(nv);
        vertex.put(nv*radius);
      } 
    }
    normal.position(0);
    vertex.position(0);
  
    gl.glVertexPointer( 3, GL10.GL_FLOAT, 0, vertex);
    gl.glNormalPointer(GL10.GL_FLOAT, 0, normal); 
    gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
    gl.glEnableClientState(GL10.GL_NORMAL_ARRAY); 
    triangles = (slices+1)*2;
    int k;
    for( k=0; k < stacks; k++ ){
      gl.glDrawArrays(GL10.GL_TRIANGLE_STRIP, k*triangles, triangles);  
    }  
  }
 
  private FloatBuffer allocateFloatBuffer(int capacity){
    ByteBuffer vbb = ByteBuffer.allocateDirect(capacity);
    vbb.order(ByteOrder.nativeOrder());
    return vbb.asFloatBuffer();
  }
}

執行結果:

【教學】Android OpenGL ES DrawEllipse

2010-11-04T07:38:00.000-07:00

本範例是利用先前建立好的3D的基本框架，
於A3DRender類別內增加畫橢圓形的方法，
圓形基本上也是由三角面形成，
所以範例內橢圓及圓形是用GL_TRIANGLE_FAN，
定義出各個頂點的位置資訊(不含顏色資訊)，
再用glDrawArrays畫出三角面，
專案為A3DEllipse，其A3DMain與A3DView內容不變，
如下圖：

A3DRender內新增drawEllipse方法，
可分別給予長及寬的參數來決定形狀，
程式碼如下：


package com.max;

import android.opengl.GLSurfaceView;
import android.opengl.GLU;
import javax.microedition.khronos.egl.EGLConfig;
import javax.microedition.khronos.opengles.GL10;
import java.nio.ByteBuffer;
import java.nio.ByteOrder;
import java.nio.FloatBuffer;

public class A3DRender implements GLSurfaceView.Renderer{
 
  @Override
  public void onSurfaceCreated(GL10 gl,EGLConfig config){
    gl.glClearColor(0.0f, 0.0f, 0.0f, 1.0f); 
    gl.glShadeModel(GL10.GL_SMOOTH);
    gl.glHint(GL10.GL_POINT_SMOOTH_HINT, GL10.GL_FASTEST); 
    gl.glClearDepthf(1.0f);
    gl.glDepthFunc(GL10.GL_LEQUAL);
    gl.glEnable(GL10.GL_DEPTH_TEST);   
  }
 
  @Override
  public void onSurfaceChanged(GL10 gl,int w,int h){
    gl.glViewport(0, 0, w, h);
    float ratio;
    ratio = (float)w/h;
    gl.glMatrixMode(GL10.GL_PROJECTION);
    gl.glLoadIdentity();
    gl.glFrustumf(-ratio, ratio, -1, 1, 1, 10);  
  }
 
  @Override
  public void onDrawFrame(GL10 gl){  
    gl.glClear(GL10.GL_COLOR_BUFFER_BIT | GL10.GL_DEPTH_BUFFER_BIT); 
    gl.glMatrixMode(GL10.GL_MODELVIEW);
    gl.glLoadIdentity();  
    GLU.gluLookAt(gl, 0, 0, 5, 0, 0, 0, 0, 1, 0);
    gl.glFrontFace(GL10.GL_CCW);
    gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
    //橢圓形
    drawEllipse( gl, 32, 3.0f, 1.0f, 0.0f, -4.0f, 0.0f,true );
    //圓形
    drawEllipse( gl, 24, 1.5f, 1.5f, 0.0f, 3.0f, 0.0f,false );
  }
 
  private void drawEllipse(GL10 gl,int seg,float w,float h,float px,float py,float
pz,boolean filled){
    gl.glTranslatef(px, py, pz);
    float vertices[];
    vertices = new float[seg*2];
    int count=0;
    for(float i=0; i<360.0f; i+=(360.0f/seg)){
      vertices[count++] = (float)Math.cos( degressToRadian(i) )*w;
      vertices[count++] = (float)Math.sin( degressToRadian(i) )*h; 
    }
    gl.glVertexPointer( 2, GL10.GL_FLOAT, 0, getFloatBuffer(vertices));
    gl.glDrawArrays((filled)?GL10.GL_TRIANGLE_FAN:GL10.GL_LINE_LOOP, 0, seg);
  }
 
  private double degressToRadian(float deg){
    double rad = 0;
    rad = (deg * Math.PI)/180.0f;
    return rad;
  }
 
  private FloatBuffer getFloatBuffer(float[] table ){
    ByteBuffer bb = ByteBuffer.allocateDirect(table.length * 4);
    bb.order(ByteOrder.nativeOrder());
    FloatBuffer fb = bb.asFloatBuffer();
    fb.put(table);
    fb.position(0);
    return fb;
  }
}

執行結果：

【教學】Android OpenGL ES DrawMesh

2010-11-03T09:35:00.000-07:00

本範例是利用先前建立好的3D的基本框架，
於A3DRender類別內增加畫三角面的方法，
在OpenGL裡畫三角面可用GL_TRIANGLES，
而三角面是幾何模型的最基本的單位，
任何複雜的模型都是由三角面形成，
所以範例內四方形面是用GL_TRIANGLE_STRIP，
定義出四個頂點的位置資訊，不含顏色資訊，
再用glDrawArrays畫出兩個三角面，
專案為A3DMesh，其A3DMain與A3DView內容不變，
如下圖：

A3DRender內新增drawTriMesh，drawSquMesh方法，
此方法只用簡單的頂點緩衝VertexBuffer，
往後範例再介紹索引緩衝IndexBuffer，
程式碼如下：


package com.max;

import android.opengl.GLSurfaceView;
import android.opengl.GLU;
import javax.microedition.khronos.egl.EGLConfig;
import javax.microedition.khronos.opengles.GL10;
import java.nio.ByteBuffer;
import java.nio.ByteOrder;
import java.nio.IntBuffer;
import java.nio.FloatBuffer;

public class A3DRender implements GLSurfaceView.Renderer{

  float triVtx[] = { -1.0f, -1.0f, 0, 
                      1.0f, -1.0f, 0,
                      0.0f,  1.0f, 0 };
 
  float squVtx[] = { -1.0f, 1.0f, 0,   
                     -1.0f,-1.0f, 0,
                      1.0f, 1.0f, 0,
                      1.0f,-1.0f, 0 };
               
  @Override
  public void onSurfaceCreated(GL10 gl,EGLConfig config){
    gl.glClearColor(0.0f, 0.0f, 0.0f, 1.0f); 
    gl.glShadeModel(GL10.GL_SMOOTH);
    gl.glHint(GL10.GL_POINT_SMOOTH_HINT, GL10.GL_FASTEST);
    gl.glClearDepthf(1.0f);
    gl.glDepthFunc(GL10.GL_LEQUAL);
    gl.glEnable(GL10.GL_DEPTH_TEST);  
  }
 
  @Override
  public void onSurfaceChanged(GL10 gl,int w,int h){
    gl.glViewport(0, 0, w, h);
    float ratio;
    ratio = (float)w/h;
    gl.glMatrixMode(GL10.GL_PROJECTION);
    gl.glLoadIdentity();
    gl.glFrustumf(-ratio, ratio, -1, 1, 1, 10);
    //GLU.gluOrtho2D(gl, 0.0f, w, h, 0.0f);  
  }
 
  @Override
  public void onDrawFrame(GL10 gl){ 
    gl.glClear(GL10.GL_COLOR_BUFFER_BIT | GL10.GL_DEPTH_BUFFER_BIT); 
    gl.glMatrixMode(GL10.GL_MODELVIEW);
    gl.glLoadIdentity(); 
    GLU.gluLookAt(gl, 0, 0, 5, 0, 0, 0, 0, 1, 0);
    gl.glFrontFace(GL10.GL_CCW); //逆時針
     gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
    drawTriMesh(gl, triVtx ); // 畫三角面 
    drawSquMesh(gl, squVtx ); // 畫四角面  
  }
 
  private void drawTriMesh(GL10 gl,float[] vtx){ 
    gl.glVertexPointer( 3, GL10.GL_FLOAT, 0, getFloatBuffer(vtx));
    gl.glTranslatef(-2.0f, 0, 0);
    gl.glDrawArrays(GL10.GL_TRIANGLES, 0, 3);
  }
 
  private void drawSquMesh(GL10 gl,float[] vtx){ 
    gl.glVertexPointer( 3, GL10.GL_FLOAT, 0, getFloatBuffer(vtx));
    gl.glTranslatef( 4.0f, 0, 0);
    gl.glDrawArrays(GL10.GL_TRIANGLE_STRIP, 0, 4);
  }
 
  private FloatBuffer getFloatBuffer(float[] table ){
    ByteBuffer bb = ByteBuffer.allocateDirect(table.length * 4);
    bb.order(ByteOrder.nativeOrder());
    FloatBuffer fb = bb.asFloatBuffer();
    fb.put(table);
    fb.position(0);
    return fb;
  }
}

執行結果：

【教學】Android OpenGL ES DrawLine

2010-11-03T04:29:00.000-07:00

本範例是利用先前建立好的3D的基本框架，
於A3DRender類別內增加畫線段的方法，
總共畫出兩種線，一種是線段，另一種是封閉線，
線段可用GL_LINES，封閉線用GL_LINE_LOOP，
畫線主要是定義出頂點的位置與顏色還有大小，
有了頂點資訊再用glDrawArrays將其畫出，
專案為A3DLine，其A3DMain與A3DView內容不變，
如下圖：

A3DRender內新增drawLines，drawLineLoop與getIntBuffer方法，
成像方面由透視改成正交模式，程式碼如下：


package com.max

import android.opengl.GLSurfaceView;
import android.opengl.GLU;
import javax.microedition.khronos.egl.EGLConfig;
import javax.microedition.khronos.opengles.GL10;
import java.nio.ByteBuffer;
import java.nio.ByteOrder;
import java.nio.IntBuffer;

public class A3DRender implements GLSurfaceView.Renderer{
  
  int one = 0x10000;
  int lineVtPos1[] = { one*300, one*100, 0,
                       one*100, one*400, 0 };
  int lineColor1[] = { one, one, one, one,
                       one, one, one, one };
  int lineVtPos2[] = { one*300, one*100, 0, 
                       one*300, one*400, 0,
                       one*100, one*400, 0,
                       one*100, one*100, 0 };
  int lineColor2[] = { one,   0,   0, one, 
                       one,   0, one, one,
                         0, one, one, one,
                         0, one,   0, one },
                      
  @Override
  public void onSurfaceCreated(GL10 gl,EGLConfig config){
    gl.glClearColor(0.0f,0.0f,0.0f,1.0f);//背景黑色
    //gl.glShadeModel(GL10.GL_FLAT);      //原本單一色註解
    gl.glShadeModel(GL10.GL_SMOOTH);      //平滑漸變色      
    gl.glHint(GL10.GL_POINT_SMOOTH_HINT,GL10.GL_FASTEST);
    gl.glEnable(GL10.GL_LINE_SMOOTH);
    gl.EnableClientState(GL10.GL_VERTEX_ARRAY);
    gl.EnableClientState(GL10.GL_COLOR_ARRAY);
  }

  @Override
  public void onSurfaceChanged(GL10 gl,int w,int h){
    gl.glViewport( 0, 0, w, h );
    //float ratio;
    //ratio = (float)w/h;
    gl.glMatrixMode(GL10.GL_PROJECTION);
    gl.glLoadIndentity();
    //gl.glFrustumf(-ratio,ratio,-1,1,1,500);
    GLU.gluOrtho2D(gl, 0.0f, w, h, 0.0f);
  }

  @Override
  public void onDrawFrame(GL10 gl){
    //gl.glClear(GL10.GL_COLOR_BUFFER_BIT);
    gl.glClear(GL10.GL_COLOR_BUFFER_BIT | GL10.GL_DEPTH_BUFFER_BIT);
    gl.glMatrixMode(GL10.GL_MODEVIEW);
    gl.glLoadIndentity();
    // 畫線段
    drawLines( gl, lineVtPos1, lineColor1, 3.0f );
    // 畫封閉線
    drawLineLoop( gl, lineVtPos2, lineColor2, 4.0f );
  }

  private void drawLines(GL10 gl, int[] vtx, int[] col, float siz){
    gl.glLineWidth(siz);
    gl.glVertexPointer( 3, GL10.GL_FIXED, 0, getIntBuffer(vtx) );
    gl.glColorPointer( 4, GL10.GL_FIXED, 0, getIntBuffer(col) );
    gl.glDrawArrays(GL10.GL_LINES, 0, 2);
  }

  private void drawLineLoop(GL10 gl, int[] vtx, int[] col, float siz){
    gl.glLineWidth(siz);
    gl.glVertexPointer( 3, GL10.GL_FIXED, 0, getIntBuffer(vtx) );
    gl.glColorPointer( 4, GL10.GL_FIXED, 0, getIntBuffer(col) );
    gl.glDrawArrays(GL10.GL_LINE_LOOP, 0, 4);
  }

  private IntBuffer getIntBuffer(int[] table){
    ByteBuffer bb = ByteBuffer.allocateDirect( table.length*4);
    bb.order(ByteOrder.nativeOrder());
    IntBuffer ib = bb.asIntBuffer();
    ib.put(table);
    ib.position(0);
    return ib;
  }
}

執行結果：

【教學】Android OpenGL ES DrawPoint

2010-11-02T05:16:00.000-07:00

本範例是利用先前建立好的3D的基本框架，
於A3DRender類別內增加畫頂點的方法，
在OpenGL裡畫點是用GL_POINTS，
定義出頂點的位置與顏色還有大小，
有了頂點資訊再用glDrawArrays將其畫出，
專案為A3DPoint，其A3DMain與A3DView內容不變，
如下圖：

A3DRender內新增drawPoint與getIntBuffer方法，
成像方面由透視改成正交模式，程式碼如下：


package com.max

import android.opengl.GLSurfaceView;
import android.opengl.GLU;
import javax.microedition.khronos.egl.EGLConfig;
import javax.microedition.khronos.opengles.GL10;
import java.nio.ByteBuffer;
import java.nio.ByteOrder;
import java.nio.IntBuffer;

public class A3DRender implements GLSurfaceView.Renderer{
  int one = 0x10000;
  // 頂點座標X,Y,Z
  int vertexArray[][] = { {one*120,one*200,0},
                          {one*150,one*250,0},
                          {one*200,one*150,0},
                          {one*50,one*100,0},
                          {one*250,one*50,0},
                          {one*250,one*300,0} };
  // 頂點顏色RGBA
  int colorArray[][] = { {one,0,0,one}, 
                         {one,one,0,one},
                         {one,0,one,one},
                         {one,one,one,one},
                         {0,one,one,one},
                         {0,0,one,one} };
  // 頂點大小
  int sizeArray[] = {4,8,16,24,32,64};

  @Override
  public void onSurfaceCreated(GL10 gl,EGLConfig config){
    gl.glClearColor( 0.0f, 1.0f, 0.0f, 1.0f);
    gl.glShadeModel(GL10.GL_FLAT);
    gl.glHint(GL10.GL_POINT_SMOOTH_HINT, GL10.GL_FASTEST);
    gl.EnableClientState(GL10.GL_VERTEX_ARRAY);
    gl.EnableClientState(GL10.GL_COLOR_ARRAY);
  }

  @Override
  public void onSurfaceChanged(GL10 gl,int w,int h){
    gl.glViewport( 0, 0, w, h );
    gl.glMatrixMode(GL10.GL_PROJECTION);
    gl.glLoadIndentity();
    //float ratio;
    //ratio = (float)w/h;
    //gl.glFrustumf(-ratio,ratio,-1,1,1,500);
    GLU.gluOrtho2D(gl, 0.0f, w, h, 0.0f);
  }

  @Override
  public void onDrawFrame(GL10 gl){
    //gl.glClear(GL10.GL_COLOR_BUFFER_BIT);
    gl.glClear(GL10.GL_COLOR_BUFFER_BIT | GL10.GL_DEPTH_BUFFER_BIT);
    gl.glMatrixMode(GL10.GL_MODEVIEW);
    gl.glLoadIndentity();
    int vtCount = vertexArray.length;
    for(int i=0; i<;vtCount i++){
      drawPoint( gl, vertexArray[i], colorArray[i], sizeArray[i] );
    }
  }

  private void drawPoint(GL10 gl, int[] vtx, int[] col, int siz){
    gl.glPointSize(siz);
    gl.glVertexPointer( 3, GL10.GL_FIXED, 0, getIntBuffer(vtx) );
    gl.glColorPointer( 4, GL10.GL_FIXED, 0, getIntBuffer(col) );
    gl.glDrawArrays(GL10.GL_POINTS, 0, 1);
  }

  private IntBuffer getIntBuffer(int[] table){
    ByteBuffer bb = ByteBuffer.allocateDirect( table.length*4);
    bb.order(ByteOrder.nativeOrder());
    IntBuffer ib = bb.asIntBuffer();
    ib.put(table);
    ib.position(0);
    return ib;
  }
}

執行結果：

【教學】Android OpenGL ES 3D基本框架建立

2010-11-01T06:16:00.000-07:00

本範例是在Android構建一個3D的基本框架，
於src內自行新增兩個類別，如下圖：

建立流程：
(1) 於Android Project中先建立一個渲染類別"A3DRender"
程式碼如下：


package com.max

import android.opengl.GLSurfaceView;
import javax.microedition.khronos.egl.EGLConfig;
import javax.microedition.khronos.opengles.GL10;

public class A3DRender implements GLSurfaceView.Renderer{
  
  @Override
  public void onSurfaceCreated(GL10 gl,EGLConfig config){
    gl.glClearColor( 0.0f, 1.0f, 0.0f, 1.0f);// 3D背景色rgba
  }

  @Override
  public void onSurfaceChanged(GL10 gl,int w,int h){
    gl.glViewport( 0, 0, w, h );
    gl.glMatrixMode( GL10.GL_PROJECTION);
    gl.glLoadIndntity();
    float ratio;
    ratio = (float)w/h;
    gl.glFrustumf(-ratio,ratio,-1,1,1,500);
  }

  @Override
  public void onDrawFrame(GL10 gl){
    gl.glClear(GL10.GL_COLOR_BUFFER_BIT);
    gl.glMatrixMode(GL10.GL_MODEVIEW);
    gl.glLoadIndentity();
  }
}

(2) 接下來是建立一個 A3DView類別，用來顯示OpenGL視圖
程式碼如下：


package com.max

import android.content.Context;
import android.opengl.GLSurfaceView;
import com.max.A3DRender;

public class A3DView extends GLSurfaceView{

  private A3DRender mA3DRender; 

  public A3DView(Context context){
    super(context);
    
    mA3DRender = new A3DRender();
    setRenderer(mA3DRender);
  }
}

(3) 於主程式將A3DView加入其中，之後執行。
程式碼如下：


package com.max

import android.app.Activity;
import android.os.Bundle;
import com.max.A3DView;

public class A3DMain extends Activity{
  
  private A3DView mA3DView;

  public void onCreate(Bundle savedInstanceState){
    super.onCreate(savedInstanceState);
    // setContentView(R.layout.main);
    
    mA3DView = new A3DView(this);
    setContentView(mA3DView);
  }
}

執行結果：

【教學】拖曳3D模型物件

2010-10-26T07:02:00.001-07:00


package
{
  import flash.events.Event;
  import flash.events.MouseEvent;

  import org.papervision3d.core.math.Number3D;
  import org.papervision3d.core.math.Plane3D;
  import org.papervision3d.core.geom.renderables.Vertex3D;
  import org.papervision3d.objects.DisplayObject3D;
  import org.papervision3d.view.BasicView;
  import org.papervision3d.materials.WireframeMaterial;
  import org.papervision3d.lights.PointLight3D;
  import org.papervision3d.materials.shadematerials.PhongMaterial;
  import org.papervision3d.objects.parsers.Max3DS;
  import org.papervision3d.objects.primitives.Plane;
  import org.papervision3d.events.FileLoadEvent;
  import org.papervision3d.events.InteractiveScene3DEvent;
  import org.papervision3d.render.QuadrantRenderEngine;

  public class ModelDrag extends BasicView
  {
    private var planeMat:WireframeMaterial;
    private var planeMod:Plane;
 
    private var shaderlight:PointLight3D;
    private var phongMat:PhongMaterial;
    private var wireMat:WireframeMaterial;
 
    private var max3dsMod:Max3DS;
    private var teapotMod:DisplayObject3D;
 
    private var planeToDragOn:Plane3D;
    private var currentModel:DisplayObject3D;
  
    public function ModelDrag()
    {
      init3DObject();
    }
 
    private function init3DObject():void
    {
      planeMat = new WireframeMaterial(0x00FF00, 1, 0);
      planeMod = new Plane(planeMat, 500, 500, 8, 8);
      planeMod.localRotationX = -90;
      scene.addChild(planeMod);
  
      max3dsMod = new Max3DS();
      max3dsMod.load("Model.3DS");
      max3dsMod.addEventListener( FileLoadEvent.LOAD_COMPLETE, onfileLoadHandle );
    }
 
    private function onfileLoadHandle(event:FileLoadEvent):void
    {
      viewport.opaqueBackground = 0x0;
      viewport.interactive = true;
  
      max3dsMod.scale = 1;
      var tmpMod:Max3DS = Max3DS(event.target);
      scene.addChild(tmpMod);
  
      shaderlight = new PointLight3D(true);
      shaderlight.position = new Number3D( -300, 300, -300 );
      scene.addChild(shaderlight);
      phongMat = new PhongMaterial( shaderlight, 0xFFFFFF, 0x555555, 100 );
      phongMat.interactive = true;
  
      wireMat = new WireframeMaterial(0xFFFFFF, 1, 0);
      wireMat.interactive = true;
      teapotMod = tmpMod.getChildByName("Teapot");
      teapotMod.material = phongMat;
      teapotMod.addEventListener(InteractiveScene3DEvent.OBJECT_PRESS,teapotModPressHandler);
  
      stage.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
  
      var up:Number3D = new Number3D(0, 1, 0);
      planeToDragOn = new Plane3D(up, new Number3D(0,0,0));
   
      camera.y = 100;
      camera.z = -200;

      renderer = new QuadrantRenderEngine(QuadrantRenderEngine.CORRECT_Z_FILTER);
      startRendering();
    }
            
    private function teapotModPressHandler(event:InteractiveScene3DEvent):void
    {
      currentModel = event.displayObject3D as DisplayObject3D;
      teapotMod.material = wireMat; 
    }
 
    private function mouseUpHandler(event:MouseEvent):void
    {
      currentModel = null;
      teapotMod.material = phongMat;
    }
 
    override protected function onRenderTick(event:Event = null):void
    { 
      var ray:Number3D = camera.unproject(viewport.containerSprite.mouseX, viewport.containerSprite.mouseY);
      ray = Number3D.add(ray, camera.position);

      var cameraVertex3D:Vertex3D = new Vertex3D(camera.x, camera.y, camera.z);
      var rayVertex3D:Vertex3D = new Vertex3D(ray.x, ray.y, ray.z);

      var intersectPoint:Vertex3D = planeToDragOn.getIntersectionLine(cameraVertex3D, rayVertex3D);
  
      if(currentModel)
      {
        currentModel.x = intersectPoint.x;
        currentModel.y = intersectPoint.y;
        currentModel.z = intersectPoint.z;
        viewport.buttonMode = true;
      }
      else
      {
        viewport.buttonMode = false;
      }
  
      super.onRenderTick(event);
    }
  }
}

demo

【教學】在Windows 7 上安裝 Android 開發環境步驟

2010-10-25T07:50:00.000-07:00

Step1:下載安裝JDK1.6
(1)連結 http://java.sun.com/javase/downloads/index.jsp,
下載"jdk-6u22-windows-i586.exe"安裝執行檔.
(2)直接執行安裝檔,安裝JDK至預設目錄
(C:\Program Files\Java\jdk1.6.0_22\)
(3)在桌面"電腦"點擊滑鼠右鍵,選取"內容",再選取"進階系統設定",
之後選"環境變數"找到"Path"變數名,點擊"編輯", 添加JDK的bin路徑
(C:\Program Files\Java\jdk1.6.0_22\bin),
完成後按"確定".
(4)於"系統變數"裡找到"CLASSPATH"變數名,點擊"編輯",
添加JDK的lib及demo路徑
(C:\Program Files\Java\jdk1.6.0_22\lib)及
(C:\Program Files\Java\jdk1.6.0_22\demo),
完成後按"確定".
(5)執行"CMD" "java -version",檢測JDK是否安裝成功.

Step2:下載安裝Eclipse
(1)登錄 http://www.eclipse.org/downloads/,
選擇"Eclipse IDE for Java Developers"下載,
(2)直接下載壓縮包.eclipse-java-galileo-SR2-win32,
解壓eclipse資料夾至C:\Program Files\.

Step3:下載安裝Android SDK
(1) 連結至http://developer.android.com/sdk/index.html,
"選取"android-sdk-r07-windows.zip"下載,
解壓縮下載好的SDK安裝包到要安裝的路徑(C:\Program Files\),
執行"Setup.exe"安裝.
(2) "Android SDK and AVD Manager"窗口選"Settings",
勾選完右下方點擊"Save & Apply",
(3) 重新執行"Setup.exe".
(4) 選"Available Packages"點擊"Install Selected"按鈕,安裝軟件包.
(5) 點擊"Accept All","Install Accepted"按鈕,開始下載安裝包 .
(6) 在桌面"電腦"點擊滑鼠右鍵,選取"內容",再選取"進階系統設定",
之後選"系統變量" 找到"Path"變數名,點擊"編輯",
(Android SDK安裝文件下的tools文件夾路徑加入)
(C:\Program Files\android-sdk-windows\tools),
完成後按"確定".

Step4:安裝ADT
(1) 開啟"Eclipse",點擊上方選單"Help",選擇"Software Update..."項
和"Avaiable Software"選項,點擊"Add Site..."按鈕,
輸入"https//dl-ssl.google.com/android/eclipse/".
(2) 開啟選單"Windows",選擇"Preferences"->"Android",
點擊"Browse"按鈕,選擇Android SDK的安裝路徑.

【教學】Android在Windows上開發環境

2010-10-22T21:06:00.000-07:00

Android作業系統除了用來開發手機外，
也可以開發其他嵌入式系統(Embedded System)。
其應用程式的開發環境可以是Windos、Mac OS X 或Linux作業系統。

下面介紹的是在Windos下開發Android所需的軟體開發包與工具：
(1)JDK 1.6
下載網址：http://java.sun.com/javase/downloads/index.jsp

(2)Eclipse Galileo(3.5)
下載網址：http://www.eclipse.org/downloads/

(3)Android SDK 2.2
下載網址：http://developer.android.com/sdk/index.html

(4)ADT 0.9.7
下載網址：https://dl-ssl.google.com/android/eclipse/

【教學】InteractiveSceneManager & Mouse3D

2010-10-21T07:23:00.000-07:00


package 
{
  import flash.events.Event;
  import flash.text.TextField; 
    
  import org.papervision3d.materials.WireframeMaterial;
  import org.papervision3d.objects.primitives.Sphere;
  import org.papervision3d.objects.primitives.Plane;
  import org.papervision3d.view.BasicView;  
    
  import org.papervision3d.core.utils.Mouse3D;
  import org.papervision3d.events.InteractiveScene3DEvent; 
 
  /**
   * ...interactiveSceneManager & Mouse3D
   * @author Max
   */
  public class PV3D_Mouse3D_Demo extends BasicView 
  {
    private var txt_mx:TextField;
    private var txt_my:TextField;
    private var txt_mz:TextField;
    private var txt_author:tAuthortxt;  

    private var planeMat:WireframeMaterial
    private var planeMod:Plane;
  
    private var markMat:WireframeMaterial;
    private var markMod:Sphere;
  
    private var m3D:Mouse3D;  
  
    public function PV3D_Mouse3D_Demo()
    { 
      init3D();
    }
  
    private function init3D():void
    {
      viewport.opaqueBackground = 0x0;
      viewport.interactive = true;
   
      txt_mx = new TextField();
      txt_mx.textColor = 0xFFFFFF;
      txt_mx.width = 200;
      txt_mx.selectable = false;
      txt_mx.x = 20;
      txt_mx.y = 20;
      viewport.addChild(txt_mx);
   
      txt_my = new TextField();
      txt_my.textColor = 0xFFFFFF;
      txt_my.width = 200;
      txt_my.selectable = false;
      txt_my.x = 20;
      txt_my.y = 40;
      viewport.addChild(txt_my);
   
      txt_mz = new TextField();
      txt_mz.textColor = 0xFFFFFF;
      txt_mz.width = 200;
      txt_mz.selectable = false;
      txt_mz.x = 20;
      txt_mz.y = 60;
      viewport.addChild(txt_mz);
     
      planeMat = new WireframeMaterial(0x00FF00, 1, 0);
      planeMat.doubleSided = true;
      planeMat.interactive = true;
      planeMod = new Plane(planeMat, 1000, 1000, 6, 6);
      scene.addChild(planeMod);
    
      markMat = new WireframeMaterial(0xFF0000, 1, 0);
      markMat.doubleSided = true; 
      markMod = new Sphere(markMat, 15, 4, 3);
      scene.addChild(markMod);  
     
      Mouse3D.enabled = true;
      m3D = viewport.interactiveSceneManager.mouse3D;
  
      planeMod.addEventListener(InteractiveScene3DEvent.OBJECT_OVER, onPlaneModOver);
      planeMod.addEventListener(InteractiveScene3DEvent.OBJECT_OUT, onPlaneModOut);
   
      startRendering();
    }
  
    public function onPlaneModOver(event:InteractiveScene3DEvent):void
    { 
      markMod.visible = true;
    }
  
    public function onPlaneModOut(event:InteractiveScene3DEvent):void
    {
      markMod.visible = false;
    }
  
    override protected function onRenderTick(event:Event = null):void 
    {
      txt_mx.text = "mx:" + m3D.x;
      txt_my.text = "my:" + m3D.y;
      txt_mz.text = "mz:" + m3D.z;
 
      markMod.x = m3D.x;
      markMod.y = m3D.y;
      markMod.z = m3D.z;  
       
      planeMod.pitch(.2);
      planeMod.yaw(.1);
      planeMod.roll(.2);
  
      super.onRenderTick(event);
    }
  }
}

demo

【作品】 PV3D 3D線段(Lines3D)測試

2010-05-19T04:45:00.000-07:00

demo

【作品】 Jiglib & papervision3d 碰撞測試

2010-05-14T05:17:00.000-07:00

demo

【作品】自訂Reflection效果測試

2010-05-12T09:07:00.000-07:00

使用PV3D內建的ReflectionView類別，
可以輕鬆建立倒影，
但是建立的倒影無法漸層。
於是自己寫了一個測試，
使其模型的倒影能有漸層效果。

demo

【作品】波浪效果選單測試

2010-05-04T05:53:00.000-07:00

這個選單是利用as3dmod變形類別，
再搭配簡單的平面模型來完成對位。

demo

陣列類別

2010-01-30T23:34:00.000-08:00

MFC的陣列類別可以很輕鬆建立與管理一維陣列物件,
陣列類別包括:
CbyteArray
CDWordArray
CobArray
CptrArray
CUintArray
CwordArray
CStringArray

【教學】平面基本材質(雙面貼圖)

2009-12-30T10:13:00.000-08:00


package
{
  import flash.events.Event;
  import org.papervision3d.view.BasicView;
  import org.papervision3d.materials.BitmapFileMaterial;
  import org.papervision3d.objects.primitives.Plane;
  import org.papervision3d.objects.DisplayObject3D;
  
  /**
  * ...DoubleTexture
  * @author Max
  */
  public class  DoubleTexture extends BasicView
  {
    private var FrontMat:BitmapFileMaterial;
    private var FrontMod:Plane;
    private var BackMat:BitmapFileMaterial;
    private var BackMod:Plane;
    private var PokerMod:DisplayObject3D;
 
    public function DoubleTexture():void
    {
      initPoker();
      startRendering();
    }

    private function initPoker():void
    {
      viewport.opaqueBackground = 0x000000;
      FrontMat = new BitmapFileMateria("http://7-12.idv.tw/DeyingData/Flash/PV3D/demo_texture_double/front.jpg",true);
      FrontMod = new Plane(FrontMat,256,384,1,1);
      FrontMod.x = 0;
      FrontMod.y = 0;
      FrontMod.z = 0;
      BackMat = new BitmapFileMaterial("http://7-12.idv.tw/DeyingData/Flash/PV3D/demo_texture_double/back.jpg",true);
      BackMod = new Plane(BackMat,256,384,1,1);
      BackMod.x = 0;
      BackMod.y = 0;
      BackMod.z = 0;
      BackMod.rotationY = 180;
  
      PokerMod = new DisplayObject3D();
      PokerMod.addChild(FrontMod);
      PokerMod.addChild(BackMod);
      scene.addChild(PokerMod);
    }
 
    override protected function onRenderTick(event:Event = null):void
    {
      PokerMod.yaw(10); 
      super.onRenderTick(event);
    }
  }
}

demo

【作品】極光效果測試

2009-11-05T07:37:00.000-08:00

這個測試主要運用曲線功能，
再搭配濾鏡效果，
使其隨機變換頂點座標位置，
也可運用座標陣列去變換，
方法很多種可測試，
也會產生不同效果。

demo

【教學】多圖載入時百分比表示

2009-10-14T06:49:00.000-07:00

這篇範例主要是測試多圖檔載入時，
如何計算百分比，
雖然現在有BulkLoader下載(loader)類別可用，
相當方便，不過還是用其他方法做測試。


package
{
  import flash.display.MovieClip;
  import flash.events.Event;
  import flash.events.MouseEvent;
  import flash.events.ProgressEvent;
  import flash.events.EventDispatcher;
  import flash.net.URLRequest;
  import flash.display.Loader;
  import flash.display.LoaderInfo;
  import flash.display.Bitmap;
  import flash.display.BitmapData;
   
  public class CMenuBack extends MovieClip
  {
    private var PicLoader:Array;
    private var PicLoaderInfo:Array;
    private var PicName:Array;
    private var TotalByte:int;
    private var PercentLoaded:Array;
    private var PicTotal:int;
    private var PicCount:int;
    private var PicIndex:int;
    public var Process:Number;

    public function CMenuBack():void
    {
      PicTotal = 10;
      PicLoader = new Array(PicTotal);
      PicLoaderInfo = new Array(PicTotal);
      PicName = new Array(PicTotal);
      PercentLoaded = new Array(PicTotal);
      TotalByte = 0;
      PicCount = 0;
      PicIndex = 0;
      Process = 0;

      for (var i:int = 0; i < PicTotal; i++ )
      {
        PicName[i]='http://7-12.idv.tw/DeyingData/Flash/AS3/LoadPic/pic'+(i+1).toString()+'.jpg';
        PicLoader[i] = new Loader();
        PicLoader[i].contentLoaderInfo.addEventListener( Event.INIT, oninitHandler);
        PicLoader[i].load( new URLRequest(PicName[i]));
      }

      addEventListener("myEvent1",MsgFun1);
    }

    private function MsgFun1(event:Event):void
    {
      LoasdPic(PicIndex);
    }

    private function oninitHandler(event:Event):void
    {
      var loader:Loader = Loader(event.target.loader);
      var info:LoaderInfo = LoaderInfo(loader.contentLoaderInfo);
      TotalByte = TotalByte + info.bytesTotal;

      if (PicCount>=(PicTotal-1))
      {
        dispatchEvent(new Event("myEvent1"));
      }

      for (var i:int = 0; i < PicTotal;i++ )
      {
        if (PicLoader[i].contentLoaderInfo == event.target)
        {
          PicLoader[i].unload();
          PicCount += 1;
        }
      }
    }

    private function onLoaderProgress(event:ProgressEvent):void
    {
      PercentLoaded[PicIndex] = event.bytesLoaded/TotalByte;
      PercentLoaded[PicIndex] = Math.round(PercentLoaded[PicIndex] * 100);
      Process = Process + PercentLoaded[PicIndex];
    }

    private function onPicLoaderComplete(event:Event):void
    {
      for (var i:int = 0; i < PicTotal;i++ )
      {
        if (PicLoader[i].contentLoaderInfo == event.target)
        {
          var PicBitmap:Bitmap;
          PicBitmap = Bitmap(PicLoader[i].content);
          addChild(PicBitmap);
          PicBitmap.x = i * 320;
          PicIndex += 1;
          if ( PicIndex < pictotal )
          {
            LoasdPic(PicIndex);
          }
          else
          {
            Process = 100;
          }
        }
      }
    }

    private function LoasdPic(index:int):void
    {
      PicLoader[index] = new Loader();
      PicLoader[index].contentLoaderInfo.addEventListener( ProgressEvent.PROGRESS, onLoaderProgress);
      PicLoader[index].contentLoaderInfo.addEventListener( Event.COMPLETE, onPicLoaderComplete);
      PicLoader[index].load( new URLRequest(PicName[index]));
    }
  }
}


package 
{
  import flash.display.MovieClip;
  import flash.display.Shape; 
  
  /**
  * ...
  * @author Max
  */
  public class CMask extends MovieClip 
  {
    private var square:Shape;
  
    public function CMask():void
    {
      square = new Shape();
      square.graphics.lineStyle(1, 0x000000);
      square.graphics.beginFill(0xff0000);
      square.graphics.drawRect(0, 0, 320, 240);
      square.graphics.endFill();
      this.addChild(square);
    }
  }
}


package 
{
  import flash.display.MovieClip;
  import flash.events.Event;
  import flash.text.TextField;
  import flash.display.Shape;
  import CMenuBack;
  import CMask;

  /**
   * ...
   * @author Max
   */
  public class CMenu extends MovieClip 
  {
    private var Menu_mc:CMenuBack;
    private var Mask_mc:CMask;
    private var Percent_txt:TextField;
    private var speed:int;
    private var LoaderBar:Shape = new Shape();
    private var LoaderPos:Number;
    private var IsDraw:Boolean;
 
    public function CMenu():void
    {
      speed = -1;
      IsDraw = true; 
      Menu_mc = new CMenuBack();
      addChild(Menu_mc);   
      Mask_mc = new CMask();
      addChild(Mask_mc);
      Mask_mc.alpha = 0.5;
      Menu_mc.mask = Mask_mc;
      LoaderPos = 0;
      LoaderBar.graphics.lineStyle(1, 0x000000);
      LoaderBar.graphics.beginFill(0x000000);
      LoaderBar.graphics.drawRect(0, 220, LoaderPos, 20);
      LoaderBar.graphics.endFill();
      LoaderBar.alpha = 0.6;
      this.addChild(LoaderBar);
    
      Percent_txt = new TextField();             
      Percent_txt.x = 10;             
      Percent_txt.y = 220;              
      Percent_txt.textColor = 0xffffff;              
      this.addChild(Percent_txt);
   
      addEventListener(Event.ENTER_FRAME, onEnterFrame); 
    }
  
    private function onEnterFrame(event:Event):void
    {
      if ( Menu_mc.Process==100 )
      {
        if (Menu_mc.x<-2880 || Menu_mc.x>0 )
        {
          speed *= -1;
        }
        Menu_mc.x += speed;
      }
   
      if ( Menu_mc.Process<100 && IsDraw==true )
      {  
        LoaderPos = Math.floor(Menu_mc.Process * 320 / 100);
        LoaderBar.graphics.clear();
        LoaderBar.graphics.beginFill(0x000000);
        LoaderBar.graphics.drawRect(0, 220, LoaderPos, 20);
        LoaderBar.graphics.endFill();
        LoaderBar.alpha = 0.6;
        Percent_txt.text = "Loading... " ;
      }
      else if( Menu_mc.Process>=100 && IsDraw==true )
      {
        LoaderPos = 320;
        LoaderBar.graphics.clear();
        LoaderBar.graphics.beginFill(0x000000);
        LoaderBar.graphics.drawRect(0, 220, LoaderPos, 20);
        LoaderBar.graphics.endFill();
        LoaderBar.alpha = 0.6;
        IsDraw = false;
        Percent_txt.text = ""; 
      }
      // Percent_txt.text = "Loading.. " + (int(Menu_mc.Process)).toString() + "%";
      // Percent_txt.text = "Loading... " ;
    }
  }
}

demo

【教學】PV3D 動態陰影範例 Shadow Texture

2009-09-20T23:38:00.000-07:00

此範例參考ZUPKO.INFO上，
Casting Shadows In Papervision3D - Redux範例，
修改部份內容作測試，
運用 ShadowCaster 這個類可以輕鬆建立陰影。

執行結果：

demo

【教學】PV3D動態選取貼圖 Dynamic Texture

2009-09-04T07:18:00.001-07:00

此範例可以動態選取左邊貼圖的範圍,
選取好貼圖會即時更新在方塊材質上.
運用到其他延伸也可以改其他面與模型喔!

ActionScript3程式代碼：


package
{
  import fl.controls.Label;
  import fl.controls.Slider;
  import fl.events.SliderEvent;
  import flash.display.DisplayObject;
  import flash.text.TextField;
  import flash.text.TextFieldAutoSize;
  import flash.events.Event;
  import flash.net.URLRequest;
  import flash.display.Loader;
  import flash.display.Bitmap;
  import flash.display.BitmapData;
 
  import org.papervision3d.core.geom.renderables.Triangle3D;
  import org.papervision3d.core.proto.MaterialObject3D;
  import org.papervision3d.materials.BitmapMaterial;
  import org.papervision3d.objects.primitives.Plane;
  import org.papervision3d.view.BasicView;

  /**
  * ...動態貼圖座標範例
  * @author Max
  */
  public class DynamicTexture extends BasicView
  {
    private var SLX:Slider;
    private var SLY:Slider;
    private var SLZ:Slider;
    private var TxtX:TextField;
    private var TxtY:TextField;
    private var TxtZ:TextField;
    private var ValueX:Number;
    private var ValueY:Number;
    private var ValueZ:Number;
 
    private var SLU:Slider;
    private var SLV:Slider; 
    private var TxtU:TextField;
    private var TxtV:TextField; 
    private var ValueU:Number;
    private var ValueV:Number;

    private var DynumicLoader:Loader;
    private var DynumicBitmap:Bitmap;
    private var DynumicBitmapData:BitmapData;
    private var PlaneMat:MaterialObject3D;
    private var PlaneMod:Plane;
 
    private var author:TextField;
    private var IGURL:TextField;
   
    public function DynamicTexture():void
    {
      opaqueBackground = 0x000000;
      DynumicLoader = new Loader();
      DynumicLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, onDynumicloaderComplete);
      DynumicLoader.load( new URLRequest("http://7-12.idv.tw/DeyingData/Flash/PV3D/demo_dynamictexture/texture.jpg"));
    }
 
    function thumbDragSLUHandler(event:SliderEvent):void
    {
      ValueU = Number( (event.value*0.01).toFixed(2) );
    }
 
    function thumbDragSLVHandler(event:SliderEvent):void
    {
      ValueV = Number( (event.value*0.01).toFixed(2) );
    }
 
    function thumbDragSLXHandler(event:SliderEvent):void
    {
      ValueX = event.value;
    }
 
    function thumbDragSLYHandler(event:SliderEvent):void
    {
      ValueY = event.value;
    }
 
    function thumbDragSLZHandler(event:SliderEvent):void
    {
      ValueZ = event.value;
    }
 
    private function onDynumicloaderComplete(event:Event):void
    {
      DynumicBitmap = Bitmap(DynumicLoader.content);
      DynumicBitmapData = DynumicBitmap.bitmapData;
  
      PlaneMat = new BitmapMaterial( DynumicBitmapData, true);
      PlaneMat.doubleSided = true;
      PlaneMat.tiled = true;
  
      PlaneMod = new Plane(PlaneMat, 800, 800, 2, 2);
      PlaneMod.autoCalcScreenCoords = true;
      scene.addChild(PlaneMod);
  
      author = new TextField();
      author.autoSize = TextFieldAutoSize.LEFT;
      author.textColor = 0xFFFFFF;
      author.text = "author:Max";
      viewport.addChild(author);
  
      IGURL = new TextField();
      IGURL.autoSize = TextFieldAutoSize.LEFT;
      IGURL.textColor = 0xFFFFFF;
      IGURL.text = "http://7-12.idv.tw";
      viewport.addChild(IGURL);
  
      ValueU = 0;
      TxtU = new TextField();
      TxtU.autoSize = TextFieldAutoSize.LEFT;
      TxtU.textColor = 0xFFFFFF;
      TxtU.text = "";
      viewport.addChild(TxtU);  
      SLU = new Slider();
      SLU.width = 100;
      SLU.minimum = -10;
      SLU.maximum = 10;
      SLU.liveDragging = true;
      SLU.snapInterval = 1;
      SLU.tickInterval = SLU.snapInterval; 
      viewport.addChild(SLU);
      SLU.addEventListener( SliderEvent.THUMB_DRAG, thumbDragSLUHandler);
  
      ValueV = 0;
      TxtV = new TextField();
      TxtV.autoSize = TextFieldAutoSize.LEFT;
      TxtV.textColor = 0xFFFFFF;
      TxtV.text = "";
      viewport.addChild(TxtV);  
      SLV = new Slider();
      SLV.width = 100;
      SLV.minimum = -10;
      SLV.maximum = 10;
      SLV.liveDragging = true;
      SLV.snapInterval = 1;
      SLV.tickInterval = SLV.snapInterval;
      viewport.addChild(SLV);
      SLV.addEventListener( SliderEvent.THUMB_DRAG, thumbDragSLVHandler);
   
      ValueX = 0;
      TxtX = new TextField();
      TxtX.autoSize = TextFieldAutoSize.LEFT;
      TxtX.textColor = 0xFFFFFF;
      TxtX.text = "";
      viewport.addChild(TxtX);
      SLX = new Slider();
      SLX.width = 100;
      SLX.minimum = 0;
      SLX.maximum = 180;
      SLX.liveDragging = true;
      SLX.snapInterval = 10;
      SLX.tickInterval = SLX.snapInterval; 
      viewport.addChild(SLX);
      SLX.addEventListener( SliderEvent.THUMB_DRAG, thumbDragSLXHandler);
  
      ValueY = 0;
      TxtY = new TextField();
      TxtY.autoSize = TextFieldAutoSize.LEFT;
      TxtY.textColor = 0xFFFFFF;
      TxtY.text = "";
      viewport.addChild(TxtY);
      SLY = new Slider();
      SLY.width = 100;
      SLY.minimum = 0;
      SLY.maximum = 180;
      SLY.liveDragging = true;
      SLY.snapInterval = 10;
      SLY.tickInterval = SLY.snapInterval;
      viewport.addChild(SLY);
      SLY.addEventListener( SliderEvent.THUMB_DRAG, thumbDragSLYHandler);
  
      ValueZ = 0;
      TxtZ = new TextField();
      TxtZ.autoSize = TextFieldAutoSize.LEFT;
      TxtZ.textColor = 0xFFFFFF;
      TxtZ.text = "";
      viewport.addChild(TxtZ);
      SLZ = new Slider();
      SLZ.width = 100;
      SLZ.minimum = 0;
      SLZ.maximum = 180;
      SLZ.liveDragging = true;
      SLZ.snapInterval = 10;
      SLZ.tickInterval = SLZ.snapInterval;
      viewport.addChild(SLZ);
      SLZ.addEventListener( SliderEvent.THUMB_DRAG, thumbDragSLZHandler);
  
      startRendering();
    }
  
    override protected function onRenderTick(event:Event = null):void
    {
      TxtU.x = PlaneMod.screen.x + 170 + stage.stageWidth / 2;
      TxtU.y = PlaneMod.screen.y - 120 + stage.stageHeight / 2;
      TxtV.x = PlaneMod.screen.x + 170 + stage.stageWidth / 2;
      TxtV.y = PlaneMod.screen.y - 70  + stage.stageHeight / 2;
      SLU.move( PlaneMod.screen.x + 170 + stage.stageWidth / 2 , PlaneMod.screen.y - 100 + stage.stageHeight / 2);
      SLV.move( PlaneMod.screen.x + 170 + stage.stageWidth / 2 , PlaneMod.screen.y - 50  + stage.stageHeight / 2);
  
      TxtX.x = PlaneMod.screen.x + 170 + stage.stageWidth / 2;
      TxtX.y = PlaneMod.screen.y - 20  + stage.stageHeight / 2;
      TxtY.x = PlaneMod.screen.x + 170 + stage.stageWidth / 2;
      TxtY.y = PlaneMod.screen.y + 30  + stage.stageHeight / 2;
      TxtZ.x = PlaneMod.screen.x + 170 + stage.stageWidth / 2;
      TxtZ.y = PlaneMod.screen.y + 80  + stage.stageHeight / 2;
      SLX.move( PlaneMod.screen.x + 170 + stage.stageWidth / 2 , PlaneMod.screen.y + 0   + stage.stageHeight / 2);
      SLY.move( PlaneMod.screen.x + 170 + stage.stageWidth / 2 , PlaneMod.screen.y + 50  + stage.stageHeight / 2);
      SLZ.move( PlaneMod.screen.x + 170 + stage.stageWidth / 2 , PlaneMod.screen.y + 100 + stage.stageHeight / 2);
  
      author.x = PlaneMod.screen.x + 170 + stage.stageWidth / 2;
      author.y = PlaneMod.screen.y + 180  + stage.stageHeight / 2;
  
      IGURL.x = PlaneMod.screen.x - 220 + stage.stageWidth / 2;
      IGURL.y = PlaneMod.screen.y + 180  + stage.stageHeight / 2;
   
      for each (var triangle3D:Triangle3D in PlaneMod.geometry.faces)
      {
        triangle3D.uv0.v -= ValueV;
        triangle3D.uv1.v -= ValueV;
        triangle3D.uv2.v -= ValueV;
   
        triangle3D.uv0.u -= ValueU;
        triangle3D.uv1.u -= ValueU;
        triangle3D.uv2.u -= ValueU;
      }
          
      BitmapMaterial(PlaneMod.material).resetUVS();
      PlaneMod.rotationX = ValueX;
      PlaneMod.rotationY = ValueY;
      PlaneMod.rotationZ = ValueZ;
  
      TxtU.text = "U值: " + ValueU.toString();
      TxtV.text = "V值: " + ValueV.toString(); 
      TxtX.text = "旋轉X軸: " + ValueX.toString();
      TxtY.text = "旋轉Y軸: " + ValueY.toString();
      TxtZ.text = "旋轉Z軸: " + ValueZ.toString();
     
      super.onRenderTick(event);
    }
  }
}

執行結果：

demo

【教學】PreLoad 下載進度百分比

2009-08-21T22:49:00.000-07:00

當檔案容量較大時，
下載常常會較久，
這時就會用到下載進度百分比，
以便掌握下載過程。

本範例主要是建立一個基本的框架，
以便套用到各項專案中，
說明了LoaderInfo的應用。

建立流程：
Step1：
1.先打開ㄧ個新專案
2.打開選單[視窗]->[其他面板]->[場景]

Step2：
1.加入一個新場景(PreLoad)
2.原先場景則為(main)

Step3：
1.接下來切換到(PreLoad)場景編寫程式
2.寫一個PreLoadClass.as(下載類別)

package 
{
  import flash.display.LoaderInfo;
  import flash.display.MovieClip;
  import flash.display.Shape;
  import flash.events.Event;
  import flash.text.TextField;
 
  /**
  * ...下載進度基本類別
  * @author Max
  */
  public class PreLoadClass extends MovieClip
  {
    private var _ProjectLoaderInfo:LoaderInfo;
    private var _LoadPercent:Number;
    private var _BarFrame:Shape;
    private var _ProcessBar:Shape;
    private var _Percent_txt:TextField;
   
    public function PreLoadClass():void
    {
      this.addEventListener(Event.ADDED_TO_STAGE, _init);
    }

    private function _init(event:Event):void
    {
      _LoadPercent = 0;
      _ProjectLoaderInfo = stage.loaderInfo;
      DrawProcess();  
      this.addEventListener( Event.ENTER_FRAME, _onEnterFrame ); 
      this.removeEventListener( Event.ADDED_TO_STAGE, _init ); 
    }

    private function DrawProcess():void
    {
      _BarFrame = new Shape();
      _BarFrame.graphics.lineStyle(2, 0x999999, 1, false, "normal", null, null, 3);
      _BarFrame.graphics.moveTo(223, 193);
      _BarFrame.graphics.lineTo(327, 193); 
      _BarFrame.graphics.moveTo(327, 193);
      _BarFrame.graphics.lineTo(327, 207); 
      _BarFrame.graphics.moveTo(327, 207);
      _BarFrame.graphics.lineTo(223, 207);
      _BarFrame.graphics.moveTo(223, 207);
      _BarFrame.graphics.lineTo(223, 193);
      this.addChild(_BarFrame);
   
      _ProcessBar = new Shape();
      _ProcessBar.x = 225;
      _ProcessBar.y = 195;
      this.addChild(_ProcessBar); 
   
      _Percent_txt = new TextField();
      _Percent_txt.x = 330;
      _Percent_txt.y = 190;
      _Percent_txt.textColor = 0xAAAAAA;
      this.addChild(_Percent_txt);
    }
  
    private function _onEnterFrame(event:Event):void
    {
      _LoadPercent = Math.round((_ProjectLoaderInfo.bytesLoaded / _ProjectLoaderInfo.bytesTotal)*100);
      _ProcessBar.graphics.beginFill(0xFFFFFF, 1);
      _ProcessBar.graphics.drawRect(0, 0, _LoadPercent, 10);
      _ProcessBar.graphics.endFill(); 
   
      if (_LoadPercent >= 100)
      {
        this.removeEventListener( Event.ENTER_FRAME, _onEnterFrame );
        this.dispatchEvent(new Event( Event.COMPLETE ));
        this.removeChild(_BarFrame);
        this.removeChild(_ProcessBar);
        this.removeChild(_Percent_txt);
      }
      
      _Percent_txt.text = _LoadPercent.toString() + "%";
    }
  }
}

Step4:
1.撰寫主要Main.as(文檔類別)

package 
{
  import flash.display.MovieClip;
  import flash.events.Event;
  import PreLoadClass;

  /**
  * ...下載進度文檔類別
  * @author Max
  */
  public class Main extends MovieClip
  {
    private var PreLoader:PreLoadClass;

    public function Main()
    {
      _init();
    }

    private function _init():void
    {
      this.stop();
      PreLoader = new PreLoadClass();
      this.addChild(PreLoader); 
      PreLoader.x = 0;
      PreLoader.y = 0;
      PreLoader.addEventListener(Event.COMPLETE, _PreLoadProcess);
    }

    private function _PreLoadProcess(event:Event):void
    {
      /*檔案下載完畢*/
      gotoAndStop(1,"main");
      PreLoader.removeEventListener( Event.COMPLETE , _PreLoadProcess);
      this.removeChild(PreLoader); 
    }
  }
}

執行畫面：

【教學】PV3D動態貼圖 Dynamic Texture

2009-07-23T06:30:00.000-07:00

這個範例是測試貼圖UV座標，
拖曳Slider可以看到貼圖的變化。

ActionScript3程式代碼：

package 
{
  import fl.controls.Label;
  import fl.controls.Slider;
  import fl.events.SliderEvent; 
  import flash.display.DisplayObject;
  import flash.text.TextField;
  import flash.text.TextFieldAutoSize;
  import flash.events.Event;
  import flash.net.URLRequest;
  import flash.display.Loader;
  import flash.display.Bitmap;
  import flash.display.BitmapData;
  
  import org.papervision3d.core.geom.renderables.Triangle3D;
  import org.papervision3d.core.proto.MaterialObject3D;
  import org.papervision3d.materials.BitmapMaterial;
  import org.papervision3d.objects.primitives.Plane;
  import org.papervision3d.view.BasicView;
 
  /**
  * ...動態貼圖座標範例
  * @author Max
  */
  public class DynamicTexture extends BasicView 
  { 
    private var SLX:Slider;
    private var SLY:Slider;
    private var SLZ:Slider;
    private var TxtX:TextField;
    private var TxtY:TextField;
    private var TxtZ:TextField;
    private var ValueX:Number;
    private var ValueY:Number;
    private var ValueZ:Number;
  
    private var SLU:Slider;
    private var SLV:Slider;  
    private var TxtU:TextField;
    private var TxtV:TextField;  
    private var ValueU:Number;
    private var ValueV:Number;
 
    private var DynumicLoader:Loader;
    private var DynumicBitmap:Bitmap;
    private var DynumicBitmapData:BitmapData;
    private var PlaneMat:MaterialObject3D;
    private var PlaneMod:Plane;
  
    private var author:TextField;
    private var IGURL:TextField;
    
    public function DynamicTexture():void
    { 
      opaqueBackground = 0x000000; 
      DynumicLoader = new Loader();
      DynumicLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, onDynumicloaderComplete);
      DynumicLoader.load( new URLRequest("http://7-12.idv.tw/DeyingData/Flash/PV3D/demo_dynamictexture/texture.jpg"));
    }
  
    function thumbDragSLUHandler(event:SliderEvent):void 
    {
      ValueU = Number( (event.value*0.01).toFixed(2) );
    }
  
    function thumbDragSLVHandler(event:SliderEvent):void 
    {
      ValueV = Number( (event.value*0.01).toFixed(2) );
    }
  
    function thumbDragSLXHandler(event:SliderEvent):void 
    {
      ValueX = event.value;
    }
  
    function thumbDragSLYHandler(event:SliderEvent):void 
    {
      ValueY = event.value;
    }
  
    function thumbDragSLZHandler(event:SliderEvent):void 
    {
      ValueZ = event.value;
    }
  
    private function onDynumicloaderComplete(event:Event):void
    {
      DynumicBitmap = Bitmap(DynumicLoader.content);
      DynumicBitmapData = DynumicBitmap.bitmapData;
   
      PlaneMat = new BitmapMaterial( DynumicBitmapData, true);
      PlaneMat.doubleSided = true;
      PlaneMat.tiled = true;
   
      PlaneMod = new Plane(PlaneMat, 800, 800, 2, 2);
      PlaneMod.autoCalcScreenCoords = true;
      scene.addChild(PlaneMod);
   
      author = new TextField();
      author.autoSize = TextFieldAutoSize.LEFT;
      author.textColor = 0xFFFFFF;
      author.text = "author:Max";
      viewport.addChild(author);
   
      IGURL = new TextField();
      IGURL.autoSize = TextFieldAutoSize.LEFT;
      IGURL.textColor = 0xFFFFFF;
      IGURL.text = "http://7-12.idv.tw";
      viewport.addChild(IGURL);
   
      ValueU = 0;
      TxtU = new TextField();
      TxtU.autoSize = TextFieldAutoSize.LEFT;
      TxtU.textColor = 0xFFFFFF;
      TxtU.text = "";
      viewport.addChild(TxtU);   
      SLU = new Slider();
      SLU.width = 100;
      SLU.minimum = -10;
      SLU.maximum = 10;
      SLU.liveDragging = true;
      SLU.snapInterval = 1;
      SLU.tickInterval = SLU.snapInterval;  
      viewport.addChild(SLU);
      SLU.addEventListener( SliderEvent.THUMB_DRAG, thumbDragSLUHandler);
   
      ValueV = 0;
      TxtV = new TextField();
      TxtV.autoSize = TextFieldAutoSize.LEFT;
      TxtV.textColor = 0xFFFFFF;
      TxtV.text = "";
      viewport.addChild(TxtV);   
      SLV = new Slider();
      SLV.width = 100;
      SLV.minimum = -10;
      SLV.maximum = 10;
      SLV.liveDragging = true;
      SLV.snapInterval = 1;
      SLV.tickInterval = SLV.snapInterval;
      viewport.addChild(SLV);
      SLV.addEventListener( SliderEvent.THUMB_DRAG, thumbDragSLVHandler);
    
      ValueX = 0;
      TxtX = new TextField();
      TxtX.autoSize = TextFieldAutoSize.LEFT;
      TxtX.textColor = 0xFFFFFF;
      TxtX.text = "";
      viewport.addChild(TxtX); 
      SLX = new Slider();
      SLX.width = 100;
      SLX.minimum = 0;
      SLX.maximum = 180;
      SLX.liveDragging = true;
      SLX.snapInterval = 10;
      SLX.tickInterval = SLX.snapInterval;  
      viewport.addChild(SLX);
      SLX.addEventListener( SliderEvent.THUMB_DRAG, thumbDragSLXHandler);
   
      ValueY = 0;
      TxtY = new TextField();
      TxtY.autoSize = TextFieldAutoSize.LEFT;
      TxtY.textColor = 0xFFFFFF;
      TxtY.text = "";
      viewport.addChild(TxtY);
      SLY = new Slider();
      SLY.width = 100;
      SLY.minimum = 0;
      SLY.maximum = 180;
      SLY.liveDragging = true;
      SLY.snapInterval = 10;
      SLY.tickInterval = SLY.snapInterval;
      viewport.addChild(SLY);
      SLY.addEventListener( SliderEvent.THUMB_DRAG, thumbDragSLYHandler);
   
      ValueZ = 0;
      TxtZ = new TextField();
      TxtZ.autoSize = TextFieldAutoSize.LEFT;
      TxtZ.textColor = 0xFFFFFF;
      TxtZ.text = "";
      viewport.addChild(TxtZ);
      SLZ = new Slider();
      SLZ.width = 100;
      SLZ.minimum = 0;
      SLZ.maximum = 180;
      SLZ.liveDragging = true;
      SLZ.snapInterval = 10;
      SLZ.tickInterval = SLZ.snapInterval;
      viewport.addChild(SLZ);
      SLZ.addEventListener( SliderEvent.THUMB_DRAG, thumbDragSLZHandler);
   
      startRendering();
    }
   
    override protected function onRenderTick(event:Event = null):void 
    { 
      TxtU.x = PlaneMod.screen.x + 170 + stage.stageWidth / 2;
      TxtU.y = PlaneMod.screen.y - 120 + stage.stageHeight / 2;
      TxtV.x = PlaneMod.screen.x + 170 + stage.stageWidth / 2;
      TxtV.y = PlaneMod.screen.y - 70  + stage.stageHeight / 2;
      SLU.move( PlaneMod.screen.x + 170 + stage.stageWidth / 2 , PlaneMod.screen.y - 100 + stage.stageHeight / 2);
      SLV.move( PlaneMod.screen.x + 170 + stage.stageWidth / 2 , PlaneMod.screen.y - 50  + stage.stageHeight / 2);
   
      TxtX.x = PlaneMod.screen.x + 170 + stage.stageWidth / 2; 
      TxtX.y = PlaneMod.screen.y - 20  + stage.stageHeight / 2; 
      TxtY.x = PlaneMod.screen.x + 170 + stage.stageWidth / 2; 
      TxtY.y = PlaneMod.screen.y + 30  + stage.stageHeight / 2; 
      TxtZ.x = PlaneMod.screen.x + 170 + stage.stageWidth / 2;
      TxtZ.y = PlaneMod.screen.y + 80  + stage.stageHeight / 2; 
      SLX.move( PlaneMod.screen.x + 170 + stage.stageWidth / 2 , PlaneMod.screen.y + 0   + stage.stageHeight / 2);
      SLY.move( PlaneMod.screen.x + 170 + stage.stageWidth / 2 , PlaneMod.screen.y + 50  + stage.stageHeight / 2);
      SLZ.move( PlaneMod.screen.x + 170 + stage.stageWidth / 2 , PlaneMod.screen.y + 100 + stage.stageHeight / 2);
   
      author.x = PlaneMod.screen.x + 170 + stage.stageWidth / 2; 
      author.y = PlaneMod.screen.y + 180  + stage.stageHeight / 2;
   
      IGURL.x = PlaneMod.screen.x - 220 + stage.stageWidth / 2; 
      IGURL.y = PlaneMod.screen.y + 180  + stage.stageHeight / 2;
    
      for each (var triangle3D:Triangle3D in PlaneMod.geometry.faces)
      {
        triangle3D.uv0.v -= ValueV;
        triangle3D.uv1.v -= ValueV;
        triangle3D.uv2.v -= ValueV;
    
        triangle3D.uv0.u -= ValueU;
        triangle3D.uv1.u -= ValueU;
        triangle3D.uv2.u -= ValueU; 
      }
            
      BitmapMaterial(PlaneMod.material).resetUVS();
      PlaneMod.rotationX = ValueX;
      PlaneMod.rotationY = ValueY;
      PlaneMod.rotationZ = ValueZ;
   
      TxtU.text = "U值: " + ValueU.toString();
      TxtV.text = "V值: " + ValueV.toString();  
      TxtX.text = "旋轉X軸: " + ValueX.toString();
      TxtY.text = "旋轉Y軸: " + ValueY.toString();
      TxtZ.text = "旋轉Z軸: " + ValueZ.toString();
      
      super.onRenderTick(event);
    }
  }
}

執行結果：

demo

【教學】Flash ActionScript3 Random亂數應用

2009-07-19T05:18:00.000-07:00

將一些常用到的亂數功能，
例如取一隨機亂數值、
取限定範圍內的亂數值、
取限定範圍不重複排列值等..，
封裝成CalRandomClass.as檔
只要在需要時引用並呼叫方法即可。

ActionScript3 CalRandomClass.as檔代碼：

package  
{  
  /**  
  * ...計算亂數的類別
  * @author Max  
  */    
  public class CalRandomClass  
  {
    private static  var _aUniqueIDs:Array; 
    
    // 建構子 
    public function CalRandomClass():void 
    {

    }  
    public function Ranround(nNumber:Number,nRoundToInterval:Number=1):Number 
    {
      return Math.round(nNumber/nRoundToInterval)*nRoundToInterval;
    }         
    public function Ranfloor(nNumber:Number,nRoundToInterval:Number=1):Number 
    { 
      return Math.floor(nNumber/nRoundToInterval)*nRoundToInterval; 
    }     
    public function Ranceil(nNumber:Number,nRoundToInterval:Number=1):Number 
    { 
      return Math.ceil(nNumber/nRoundToInterval)*nRoundToInterval; 
    }         
    public function Ranrandom(nMinimum:Number,nMaximum:Number=0,nRoundToInterval:Number=1):Number 
    {
      if (nMinimum > nMaximum) 
      {
        var nTemp:Number=nMinimum; 
        nMinimum=nMaximum; 
        nMaximum=nTemp; 
      } 
      var nDeltaRange:Number=(nMaximum-nMinimum)+(1*nRoundToInterval); 
      var nRandomNumber:Number=Math.random()*nDeltaRange; 
      nRandomNumber+=nMinimum; 
      return Ranfloor(nRandomNumber,nRoundToInterval); 
    }         
    public function getUnique():Number 
    { 
      if (_aUniqueIDs==null) 
      { 
        _aUniqueIDs=new Array(); 
      } 
      var dCurrent:Date=new Date(); 
      var nID:Number=dCurrent.getTime(); 
      while (!isUnique(nID)) 
      { 
        nID+=Ranrandom(dCurrent.getTime(),2*dCurrent.getTime()); 
      } 
      _aUniqueIDs.push(nID); 
      return nID; 
    }        
    private function isUnique(nNumber:Number):Boolean 
    { 
      for (var i:Number=0;i < _aUniqueIDs.length;i++) 
      {
        if (_aUniqueIDs[i]==nNumber) 
        { 
          return false; 
        } 
      } 
      return true; 
    }         
    // 取得單一隨機亂數值 
    public function GetSingleRandom():Number 
    {
      // 傳回虛擬亂數 n，其中 0 <= n < 1。 
      var ran:Number=Math.random(); 
      return ran; 
    }        
    // 取得一定範圍單一亂數值 
    public function GetRangeRandom(min:Number,max:Number,round:Number):Number 
    {
      // 取其有效位數 
      var tmproundstr:String=round.toString(); 
      var roundindex:int=tmproundstr.indexOf(".",0); 
      var roundnum:int=tmproundstr.length-roundindex-1; 
      // 取亂數 
      var ran:Number=Ranrandom(min,max,round); 
      var newnum:Number; 
      // 過濾無效位元 
      var tmpstr:String=ran.toString(); 
      var index:int=tmpstr.indexOf(".",0); 
      // 無小數點時處理 
      if (index==-1) 
      {
        tmpstr=tmpstr+".0"; 
        var newindex:int=tmpstr.indexOf(".",0); 
        newnum=Number(tmpstr.substr(0,newindex+roundnum+1)); 
      } 
      else 
      {
        newnum=Number(tmpstr.substr(0,index+roundnum+1)); 
      } 
      return newnum; 
    }        
    // 取得一定範圍不重覆所有亂數整數值
    public function GetRangeArrayRandom(min:int,max:int):Array
    {
      var ResNum:Number=0;
      var TmpAdd:Number=0;
      var TmpPos:Array=new Array();
      var TmpNum:Array=new Array();
      for (var i:int=0;i < (max-min)+1;i++)
      {
        TmpPos[i]=0;
      }          
      // 取得min-max的不重複亂數順序
      while (TmpAdd < (max-min)+1)
      {
        ResNum=Ranrandom( min, max,1);
        if (TmpPos[ResNum-min]!=1)
        {
          TmpPos[ResNum-min]=1;
          TmpNum.push(ResNum);
          TmpAdd=TmpAdd+1;
        }
      }
      return TmpNum;
    }
  }
}

過濾無效字元也可直接使用toFixed()來取有效位數，
修改如下：
//過濾無效位元
var newnum:Number;
newnum = Number(ran.toFixed(roundnum));

【教學】PV3D 結合 flartoolkit

2009-07-16T06:35:00.000-07:00

AR(Augmented Reality)擴張現實的技術，
以電腦圖學計算攝影機(Webcam)，
和標記(Marker)之間的相對位置，
將開發者創造的虛擬的物件，
依據標記在真實世界上的相關資訊，
覆蓋到真實環境中。
之前要玩這樣的技術，
只有C或Java語言才提供，
ARToolkit是C++開發的，
NyARToolkit則是由Java寫成的，
直到ㄧ位日本的程式設計師Saqoosha，
改寫ActionScript3的FLARToolKit版本。
此版結合PV3D也可只做AR的效果。

FLARToolKit可以由以下連結取得
http://www.libspark.org/svn/as3/FLARToolKit/

而想要製作Marker可以到
flash.tarotaro.org.blog這邊上傳自製的Marker。

以下就是參考FLARToolKit的範例修改而成

demo

【教學】Director 3D 滑鼠互動 & 模型貼圖變換

2009-07-11T08:57:00.000-07:00

CastMember視窗：

Lingo 程式代碼：
----------Movie Script:"Main"


global resSphere    -- 球體模型資源  
global modSphere    -- 球體模型  
global matSphere    -- 球體基本材質  
global txtSphere1   -- 球體基本貼圖1  
global txtSphere2   -- 球體基本貼圖2  
  
on startmovie  
  member("Scene3D").resetworld()  
  --建立球體模型資源 
  resSphere = member("Scene3D").newModelResource("SphereRes",#Sphere,#front) 
  --球體半徑 
  resSphere.radius = 40 
  --球體的起始角度 
  resSphere.startAngle = 0 
  --球體的結束角度 
  resSphere.endAngle = 360 
  --球體的解析度數(越高越平滑) 
  resSphere.resolution = 24 
  --建立球體模型 
  modSphere = member("Scene3D").newModel("SphereRes") 
  modSphere.resource = resSphere 
  --球體位置 
  modSphere.transform.position = vector(0,0,0) 
  --球體旋轉 
  modSphere.transform.rotation = vector(0,180,0) 
  --設定基本材質球顏色 
  --貼圖2 
  txtSphere2 = member("Scene3D").newTexture("SphereTxt2",#fromCastmember,member("Face2")) 
  --貼圖1 
  txtSphere1 = member("Scene3D").newTexture("SphereTxt1",#fromCastmember,member("Face1")) 
  --建立標準材質#standard,#painter,#engraver,#newsprint 
  matSphere = member("Scene3D").newshader("SphereMat",#standard) 
  --設定材質球陰影色 
  matSphere.ambient = rgb(50,50,50) 
  --設定材質球基本色 
  matSphere.diffuse = rgb(100,100,100) 
  --設定材質球反光色 
  matSphere.specular = rgb(255,255,255) 
  --設定材質球發亮度 
  matSphere.emissive = rgb(50,50,50) 
  --設定反光範圍大小 
  matSphere.shininess = 70 
  --材質混合度 
  matSphere.blend = 70   
  --材質透明度 
  matSphere.transparent = 100 
  --描繪形式(#fill,#wire,#point) 
  matSphere.renderstyle = #fill 
  --貼圖旋轉方向 
  matSphere.texturetransform.rotate(0,0,0) 
  --貼圖重複0.2重複5次 
  matSphere.texturetransform.scale(1,1,1) 
  --設定貼圖2 
  matSphere.texture = txtSphere2 
  --將材質指定給模型 
  modSphere.shader = matSphere           
end

----------Frame Script:"Loop"


global resSphere    -- 球體模型資源   
global modSphere    -- 球體模型  
global matSphere    -- 球體基本材質  
global txtSphere1   -- 球體基本貼圖1  
global txtSphere2   -- 球體基本貼圖2  
  
on exitFrame me

  --Pick  
  mousepos = point(_mouse.mouseH,_mouse.mouseV) 
  Tag = sprite(1).camera.spritespacetoworldspace(mousepos) --2Dto3D 
  Ori = sprite(1).camera.worldposition 
  Ray = Tag - Ori 
  PickMod = member("Scene3D").modelsUnderRay(Ori,Ray,1,#detailed)

  if count(PickMod)>0 then 
    PickModName = PickMod[1].model 
    PickModName.shader.texture=txtSphere1 
  else 
    modSphere.shader.texture=txtSphere2 
  end if

  go to the frame

end

Score視窗：

執行結果：

demo

【作品】Director 中使用Lingo 3D建置象棋

2009-07-11T05:20:00.001-07:00

這是之前用Lingo寫的一個3D象棋程式，
可用滑鼠抓取棋子，
測試了各種棋子的走法。

demo

【教學】VC++與Flash溝通(二)

2009-07-10T06:03:00.000-07:00

Step1：
1.開啟VS2005，建立一個新專案。

Step2：
1.專案類型選擇MFC。
2.類型選擇MFC應用程式。
3.為專案設定位置與名稱。
4.設定完按下[確定]鍵。

Step3：
1.使用MFC應用程式精靈來幫忙設定。
2.按[下一步>]。

Step4：
1.應用程式類型選擇以對話方塊為基礎(D)。
2.專案樣式為MFC標準。
3.使用MFC的共用DLL。
4.按[下一步>]。

Step5：
1.將最大化與功能表取消。
2.按[下一步>]。

Step6：
1.進階不做修改，直接[下一步>]。

Step7：
1.產生CMFCFlashProgApp與CMFCFlashProgDlg類別。
2.按下[完成]鍵，完成dialog設定。

Step8：
1.完成設定後可看到自動產生的對話框視窗。

Step9：
1.點選右邊[資源檢視]標籤。

Step10：
1.在左邊Dialog視窗內點擊滑鼠右鍵。
2.彈出視窗選擇[插入ActiveX控制項(X)...]。

Step11：
1.選取Shockwave Flash Object選項。
2.按下[確定]鍵。

Step12：
1.出現黑色方塊的Flash OCX控制項表示成功加入。

Step13：
1.在控制項上點擊滑鼠右鍵。
2.彈出視窗選擇[加入變數(B)...]。

Step14：
1.變數名稱取"m_Flashocx",(可自取)。
2.按下[完成]鍵。

Step15：
1.觀察[類別檢視]，
2.多了CShockwaveflash1這個類別。

Step16：
1.選取[方案總管]。
2.標頭檔多了shockwaveflash1.h檔，
3.原始程式檔多了shockwaveflash1.cpp檔。

Step17：
1.選取MFCFlashProgDlg.h檔。
2.#include "shockwaveflash1.h"自動被添加。
3.在//程式碼實作 public:裡
有 CShockwaveflash1 m_Flashocx;
表示控件已宣告。

Step18：
1.接下來可以到MFCFlashProgDlg.cpp裡
的BOOL CMFCFlashProgDlg::OnInitDialog()
函式裡建立實體以下為增加的程式碼片段。
VC程式碼：

//--------------------------------------主視窗
CMFCFlashProgDlg::MoveWindow(0,0,640,480,1);   
CMFCFlashProgDlg::ShowWindow(SW_SHOW);

//--------------------------------------Flash物件
hwndflash = m_Flashocx.GetSafeHwnd();
m_Flashocx.SetParent(this);    
m_Flashocx.MoveWindow( 0, 0, 550, 400, 1);   
m_Flashocx.ShowWindow(SW_SHOW);    
FlashName = _T("C://AS3TestProg.swf");
m_Flashocx.put_Movie(FlashName);
m_Flashocx.put_Menu(false);
m_Flashocx.put_Playing(true);

Step19：
1.接下來新增一個Button1(按鈕1)，
在按鈕上點擊兩下進入函式內，
將VC要與Flash溝通的程式碼加入其中，
以下為增加的程式碼片段。
VC程式碼：

void CMFCFlashProgDlg::OnBnClickedButton1()
{
    // TODO: 在此加入控制項告知處理常式程式碼
    CString XMLSTR;
    CString res;
    CString strStartFunction;
    CString strVarable;
    CString strValue;
    CString strEndFunction;
    //回呼函式名稱
    strStartFunction = _T("<invoke name='CallMeFromApplication'>");
    //Flash變數名    
    strVarable = _T("<arguments><string>strTest1</string></arguments>");
   //Flash變數值
    strValue = _T("<arguments><string>VC++SendFlash</string></arguments>");  
   //結束標籤
    strEndFunction = _T("</invoke>");                                            

    XMLSTR = strStartFunction + strVarable + strValue + strEndFunction;
    // 傳遞變數值給Flash
    res = m_Flashocx.CallFunction(XMLSTR);  
}

Step20：
1.而要從Flash傳遞給VC則需要新增FSCommand事件，
2.點選<加入>FSCommandShockwaveflash12。

Step21：
於VC程式中自動新增以下程式碼：
VC程式碼：

BEGIN_EVENTSINK_MAP(CMFCFlashProgDlg, CDialog)
    ON_EVENT(CMFCFlashProgDlg, IDC_SHOCKWAVEFLASH1, 150, 
    CMFCFlashProgDlg::FSCommandShockwaveflash1,VTS_BSTR VTS_BSTR)
END_EVENTSINK_MAP()

void CMFCFlashProgDlg::FSCommandShockwaveflash1(LPCTSTR command, LPCTSTR args)
{
    // TODO: 在此加入您的訊息處理常式程式碼

    fscomd = command;    
    fsargs = args;

    //為Flash fscommand的第一個參數
    if( fscomd == "ASCallVC" )   
    {
        //為Flash fscommand的第二個參數
        if( fsargs=="true" ) 
    {
        //可作為Flash傳遞過來想做的事    
              MessageBoxW( _T("Flash call VC++"), _T("MSG"), MB_OK);
    }
    }
}

程式執行結果：

【教學】VC++與Flash溝通(一)

2009-07-10T05:30:00.000-07:00

有時後會需要VC嵌入Flash一起製作專案，
Flash要如何與VC++等外部程式溝通呢？
原本在ActionScript2.0時非常容易，
只需要LoadVars與Fscommand就行了。
但是到了ActionScript3.0較複雜，
主要使用到ExternalInterface與fscommand，
以下測試的範例就是製作一個紅色的球，
球由起始點往右移動，
當到達X座標250時變會停住不動，
此時由VC++程式按扭來控制Flash的球，
讓他回到起始點重新移動。
VC++也可直接改變Flash的變數值。
而Flash在場景上按滑鼠時也會通知VC。
以下為Flash AS3部分的程式碼：

package 
{ 
  import flash.display.Stage; 
  import flash.display.StageAlign; 
  import flash.display.StageScaleMode;
  import flash.display.MovieClip;
  import flash.display.Shape; 
  import flash.events.Event; 
  import flash.events.MouseEvent;
  import flash.text.TextField;  
  import flash.external.ExternalInterface;
  import flash.system.fscommand;
  
  public class AS3TestProg extends MovieClip
  {  
    public var testnum:String;  
    public var shapobj:Shape;
    public var field:TextField;  
    public var strTest1:String;
    public var strTest2:String;
    public var strTest1txt:TextField;
    public var strTest2txt:TextField;

    public function AS3TestProg()
    {  
      testnum = "準備接收VC傳來的字串訊息.";
      field = new TextField();
      field.width = 300;
      field.height = 20;
      field.x = 50;
      field.y = 50;
      addChild(field);
      
      strTest1 = "測試字串1";
      strTest1txt = new TextField();
      strTest1txt.width = 300;
      strTest1txt.height = 20;
      strTest1txt.x = 50;
      strTest1txt.y = 70;
      addChild(strTest1txt);
     
      strTest2 = "測試字串2";
      strTest2txt = new TextField();
      strTest2txt.width = 300;
      strTest2txt.height = 20;
      strTest2txt.x = 50;
      strTest2txt.y = 90;
      addChild(strTest2txt);
       
      init();  
    }  

    public function init():void
    {
      stage.stageWidth = 550;
      stage.stageHeight = 400; 
      stage.frameRate = 24;
      stage.scaleMode = StageScaleMode.NO_SCALE;
      stage.align = StageAlign.TOP_LEFT;
      
      shapobj = new Shape();  
      shapobj.graphics.beginFill(0xFF0000, 100);
      shapobj.graphics.drawCircle(0, 0, 10);
      shapobj.graphics.endFill();
      shapobj.x = 10;
      shapobj.y = 10;
      addChild(shapobj);
      stage.addEventListener( MouseEvent.CLICK, onMouseUpHandle);
     
      // 與外部溝通
      if (ExternalInterface.available)
      {
        // 與VC++溝通的介面(VC傳值給Flash變數)    
        ExternalInterface.addCallback("CallMeFromApplication", InternalFunction);
        ExternalInterface.addCallback("CallMeFromApplication2", CallbackFunction);
      }
      
      addEventListener(Event.ENTER_FRAME, onEnterFrameHandle );
    }
    
    // 建立與VC++溝通的介面(VC傳值給Flash變數)
    public function InternalFunction(Str1:String ,Str2:String ):String
    {
      this[Str1] = Str2;  
      return "the function was called successfully";
    }
         
    // 建立與VC++溝通的介面(VC傳值給Flash變數)
    public function CallbackFunction(Str1:String ,Str2:String ):String
    {
      this[Str1] = Str2;  
      return "the function was called successfully";
    }
       
    public function onMouseUpHandle(event:MouseEvent):void
    {
      // trace("click");
      // 與VC++溝通的介面(Flash呼叫VC)   
      fscommand( "ASCallVC", "true");
    }

    public function onEnterFrameHandle(event:Event):void
    {
      field.text = testnum;
      strTest1txt.text = strTest1;
      strTest2txt.text = strTest2;
     
      if ( strTest2 == "ReSetFrame")
      {
        shapobj.x = 10;
        strTest2 = "重新開始";
      }
       
      shapobj.x += 1;
      if(shapobj.x>=250)
      {
        shapobj.x = 250;
        strTest2 = "到達終點"
      }
    }
  }
}

【教學】PV3D 自定義動畫網格範例

2009-07-08T03:04:00.000-07:00

這個範例是參考國外例子來改寫的，
主要測試自定義的TriangleMesh3D，
將自定義的類封裝成AnimatedMesh類，
將一些動畫的設定加入至該類，
是原先TriangleMesh3D教學篇的延伸。

執行結果：

demo

【教學】PV3D創建網格模型 TriangleMesh3D

2009-07-08T02:09:00.000-07:00

package  
{  
  // flash  
  import flash.events.Event;  
  // pv3d  
  import org.papervision3d.core.geom.TriangleMesh3D;  
  import org.papervision3d.core.geom.renderables.Triangle3D;  
  import org.papervision3d.core.geom.renderables.Vertex3D;  
  import org.papervision3d.materials.WireframeMaterial; 
  import org.papervision3d.materials.ColorMaterial; 
  import org.papervision3d.view.BasicView; 
  import org.papervision3d.objects.DisplayObject3D; 
  
  // TriangleMesh3DSample類別繼承BasicView 
  public class TriangleMesh3DSample extends BasicView 
  { 
    // 宣告網格三角面 
    private var triangleMesh3d1:TriangleMesh3D; 
    private var triangleMesh3d2:TriangleMesh3D; 
    private var triangleMesh3d3:TriangleMesh3D; 
    private var triangleMesh3d4:TriangleMesh3D; 
    // 自定網格群組 
    private var triangleMeshGroup:DisplayObject3D; 
    
    // 建構函式 
    public function TriangleMesh3DSample() 
    { 
      // 建置自定網格面 
      initMesh3D();     
    } 

    // 建置自定網格面 
    private function initMesh3D():void 
    {
      // 網格正面材質 
      var materialfront:WireframeMaterial = new WireframeMaterial(0x555555,100,0); 
      // 網格背面材質 
      var materialback:ColorMaterial = new ColorMaterial(0xcc0000); 
      // 自定網格群組 
      triangleMeshGroup = new DisplayObject3D();
      // 三角面頂點座標 
      var vertex3D_1:Vertex3D = new Vertex3D(-200,  200, 0 );
      var vertex3D_2:Vertex3D = new Vertex3D( 200, -200, 0 ); 
      var vertex3D_3:Vertex3D = new Vertex3D(-200, -200, 0 ); 
      var vertex3D_4:Vertex3D = new Vertex3D(-200,  200, 0 ); 
      var vertex3D_5:Vertex3D = new Vertex3D( 200,  200, 0 ); 
      var vertex3D_6:Vertex3D = new Vertex3D( 200, -200, 0 ); 
      // 三角面1頂點索引陣列 
      var triangleVertices1:Array = [vertex3D_3,vertex3D_2,vertex3D_1]; 
      // 建立三角面1         
      var triangle3d1:Triangle3D = new Triangle3D( null, triangleVertices1, null, null); 
      var triangleFaces1:Array = [triangle3d1]; 
      // 建立網格三角面1 
      triangleMesh3d1 = new TriangleMesh3D(materialfront,triangleVertices1,triangleFaces1,"m1");
      triangle3d1.instance = triangleMesh3d1; 
      triangleMeshGroup.addChild(triangleMesh3d1);
      // 三角面2頂點索引陣列 
      var triangleVertices2:Array = [vertex3D_6, vertex3D_5, vertex3D_4];
      // 建立三角面2 
      var triangle3d2:Triangle3D = new Triangle3D( null, triangleVertices2, null, null);
      var triangleFaces2:Array = [triangle3d2]; 
      // 建立網格三角面2 
      triangleMesh3d2 = new TriangleMesh3D(materialfront,triangleVertices2,triangleFaces2,"m2"); 
      triangle3d2.instance = triangleMesh3d2; 
      triangleMeshGroup.addChild(triangleMesh3d2);
      // 三角面3頂點索引陣列 
      var triangleVertices3:Array = [vertex3D_1,vertex3D_2,vertex3D_3]; 
      // 建立三角面3        
      var triangle3d3:Triangle3D = new Triangle3D( null, triangleVertices3, null, null);
      var triangleFaces3:Array = [triangle3d3]; 
      // 建立網格三角面3 
      triangleMesh3d3 = new TriangleMesh3D(materialback,triangleVertices3,triangleFaces3,"m3"); 
      triangle3d3.instance = triangleMesh3d3; 
      triangleMeshGroup.addChild(triangleMesh3d3); 
      // 三角面4頂點索引陣列 
      var triangleVertices4:Array = [vertex3D_4, vertex3D_5, vertex3D_6]; 
      // 建立三角面4 
      var triangle3d4:Triangle3D = new Triangle3D( null, triangleVertices4, null, null); 
      var triangleFaces4:Array = [triangle3d4]; 
      // 建立網格三角面4 
      triangleMesh3d4 = new TriangleMesh3D(materialback,triangleVertices4,triangleFaces4,"m4"); 
      triangle3d4.instance = triangleMesh3d4; 
      triangleMeshGroup.addChild(triangleMesh3d4); 
      // 自定網格群組加入場景中 
      scene.addChild(triangleMeshGroup); 
      // 開始渲染 
      startRendering();        
    } 
    
    // Loop(覆寫AbstractView的onRenderTick()方法)
    override protected function onRenderTick(event:Event=null):void
    {
      // 自定網格群組繞Y軸旋轉 
      triangleMeshGroup.rotationY += 5; 
      super.onRenderTick(event); 
    } 
  } 
}

執行結果：

demo

色彩值轉換函式

2009-07-06T19:51:00.000-07:00

將RGB值轉成16進制值：

private function RGBToHex(r:uint, g:uint, b:uint):uint
{
    var hex:uint = (r << 16 │ g << │ 8  b);
    return hex;
}

將16進制值轉成RGB值：

private function HexToRGB(hex:uint):Array
{
    var rgb:Array = [];
    var r:uint = hex >> 16 ;
    var g:uint = hex >> 8 & 0xFF;
    var b:uint = hex & 0xFF;
    rgb.push(r, g, b);
    return rgb;
}

SBCS函數對照表

2009-07-06T19:15:00.000-07:00

通用名稱	對應的SBCS函數
_tmain	main
_tWinMain	WinMain
__targv	__argv
標準輸出/輸入
_fgettc	fgetc
_fgettchar	_fgetchar
_fgetts	fgets
_fputtc	fputc
_fputtchar	_fputchar
_fputts	fputs
_ftprintf	fprintf
_ftscanf	fscanf
_gettc	getc
_gettchar	getchar
_getts	gets
_puttc	putc
_puttchar	putchar
_putts	puts
_sntprintf	_snprintf
_stprintf	sprintf
_stscanf	sscanf
_tprintf	printf
_tscanf	scanf
_ungettc	ungetc
_vftprintf	vfprintf
_vsntprintf	_vsnprintf
_vstprintf	vsprintf
_vtprintf	vprintf
資料轉換
_i64tot	_i64toa
_itot	_itoa
_ltot	_ltoa
_tcstod	strtod
_tcstol	strtol
_tcstoul	strtoul
_ttoi	atoi
_ttoi64	atoi64
_ttol	atol
_ui64tot	_ui64toa
_ultot	_ultoa
程序執行
_texecl	_execl
_texecle	_execle
_texeclp	_execlp
_texeclpe	_execlpe
_texecv	_execv
_texecve	_execve
_texecvp	_execvp
_texecvpe	_execvpe
_tspawnl	_spawnl
_tspawnle	_spawnle
_tspqwnlp	_spawnlp
_tspawnlpe	_spawnlpe
_tspawnv	_spawnv
_tspawnve	_spawnve
_tspawnvp	_spawnvp
_tspawnvpe	_spawnvpe
_tsystem	system
日期/時間
_tasctime	asctime
_tctime	ctime
_tstrdate	_strdata
_tstrtime	_strtime
_tutime	_utime
_tcsftime	strftime
目錄/路徑
_tchdir	_chdir
_tgetcwd	_getcwd
_tgetdcwd	_getdcwd
_tmkdir	_mkdir
_trmdir	_rmdir
_tfullpath	_fullpath
_tgetenv	getenv
_tmakepath	_makepath
_tputenv	_putenv
_tsearchenv	_searchenv
_tsplitpath	_splitpath
輸出/輸入
_tfdopen	fdopen
_tfopen	fopen
_tfreopen	freopen
_tperror	perror
_tpopen	_popen
_ttempnam	_tempnam
_ttmpnam	tmpnam
_tchmod	_chmod
_tcreat	_creat
_tfindfirst	_findfirst
_tfindnext	_findnext
_tmktemp	_mktemp
_topen	open
_taccess	access
_tremove	remove
_trename	rename
_tsopen	_sopen
_tunlink	_unlink
_tfinddata_t	_finddata_t
_tsta	_stat
_tstati64	_stati64
字串處理
_tcscat	strcat
_tcschr	strchr
_tcsclen	strlen
_tcscmp	strcmp
_tcscoll	strcoll
_tcscpy	strcpy
_tcscspn	strcspn
_tcsdup	_strdup
_tcsicmp	_stricmp
_tcslen	strlen
_tcsncat	strncat
_tcsnccat	strnccat
_tcsnccpy	strncpy
_tcsncmp	strncmp
_tcsncpy	strncpy
_tcsncset	_strnset
_tcsnicmp	_strnicmp
_tcsnset	_strnset
_tcspbrk	strpbrk
_tcsrchr	strrchr
_tcsrev	_strrev
_tcsset	_strset
_tcsspn	strspn
_tcsstr	strstr
_tcstok	strtok
_tcsxfrm	strxfrm
字元分類
_istascii	isascii
_istcntrl	iscntrl
_istxdigit	isxdigit
_istalnum	isalnum
_istalpha	isalpha
_istdigit	isdigit
_istgraph	isgraph
_istlower	islower
_istprint	isprint
_istpunct	ispunct
_istspace	isspace
_istupper	isupper
字元轉換
_totupper	toupper
_totlower	tolower

【教學】PV3D Particle3D 粒子效果

2009-07-03T12:13:00.000-07:00


package  
{  
  // Flash  
  import flash.events.Event;  
  import flash.display.Stage;  
  import flash.events.MouseEvent;  
  import flash.geom.Rectangle; 
  import flash.filters.BlurFilter;
  import flash.geom.ColorTransform; 
  import flash.geom.Point; 
  // PV3D 
  import org.papervision3d.view.BasicView;
  // Particles 
  import com.dangries.loaders.PictureLoader; 
  import com.dangries.bitmapUtilities.PictureAtomizer; 
  import com.dangries.objects.Particle3D; 
  import com.dangries.geom3D.*; 
  import com.dangries.display.RotatingParticleBoard; 
   
  public class Particle3D_Sample extends BasicView 
  { 
    private var picURLString:Array; 
    private var picLoader:PictureLoader; 
    private var particleboard:RotatingParticleBoard; 
    private var pic:Array; 
    private var atomizer:PictureAtomizer; 
    private var particles:Array; 
    private var p3d:Particle3D; 
    private var blur:BlurFilter; 
    private var darken:ColorTransform; 
    private var particleboardRect:Rectangle; 
    private var filterPoint:Point; 
    private var Step:int; 
    private var p:int;      

    public function Particle3D_Sample() 
    {     
      picURLString = ["/httpdocs/DeyingData/Flash/PV3D/demo_particle3D/mach.png"]; 
      picLoader = new PictureLoader(); 
      blur = new BlurFilter( 3, 3); 
      darken = new ColorTransform( 1, 1, 1, 0.8 ); 
      filterPoint = new Point( 0, 0); 
      particles = new Array();          
      viewport.opaqueBackground = 0x000000; 
      Step = 0; 
      p = 0;         
      particleboard = new RotatingParticleBoard( stage.stageWidth, stage.stageHeight, true, 0x00000000, 160); 
      particleboard.setDepthDarken( -10, -80, 1.5);  
      particleboard.makeFrame( 1, 0x000000, 1); 
      particleboard.holder.x = stage.stageWidth / 2  - particleboard.width / 2; 
      particleboard.holder.y = stage.stageHeight / 2 - particleboard.height / 2;  
      particleboardRect = new Rectangle( 0, 0, particleboard.width, particleboard.height );        
      
      picLoader.addEventListener( PictureLoader.ALL_PICS_LOADED, onCreateParticlesHandle); 
      picLoader.loadPics( picURLString);      
        
      stage.addEventListener(MouseEvent.CLICK, onMouseClickHandle); 
    } 

    function onCreateParticlesHandle(event:Event):void 
    { 
      pic = picLoader.picArray; 
      picLoader.removeEventListener( PictureLoader.ALL_PICS_LOADED, onCreateParticlesHandle); 
      atomizer = new PictureAtomizer();
      atomizer.sampling = 1;
      atomizer.spread = 1.33;
      atomizer.sampleFuzzX = 0;
      atomizer.sampleFuzzY = 0;
      atomizer.originX = Math.floor( pic[0].width/2 );
      atomizer.originY = Math.floor( pic[0].height/2);
      atomizer.addEventListener( PictureAtomizer.PARTICLES_CREATED, onRunHandle);
      atomizer.createParticles( pic[0]);      
    }

    private function onRunHandle(event:Event):void 
    {
      particles = atomizer.particleArray;
      atomizer.setPositionsByPic(0, 0, 0);
      viewport.addChild( particleboard.holder);
      startRendering(); 
    }
    
    private function onMouseClickHandle(event:MouseEvent):void
    {
      if (Step == 0)
      { 
        Step = 1;
      }
      if (Step == 2)
      {
        Step = 3;
      }
    }

    override protected function onRenderTick(event:Event = null):void
    {
      if ( Step == 1 )
      {
        for (var j:Number = 0; j <= particles.length - 1; j++)
        {
          particles[j].z = p*(128 - particles[j].lum);
        }
        p = p + 1;
        if ( p > 50)
        {
          p = 50;
          Step = 2;
        }
      }

      if ( Step == 3 )
      {
        for (var k:Number = 0; k <= particles.length - 1; k++)
        {
          particles[k].z = p*(128 - particles[k].lum);
        }
        p = p - 1;
        if ( p < 0)
        {
          p = 0;     
          Step = 0;
        }
      }

      particleboard.bitmapData.applyFilter( particleboard.bitmapData, particleboardRect, filterPoint, blur);
      particleboard.bitmapData.colorTransform( particleboardRect, darken);     
      particleboard.drawParticles( particles);        
      super.onRenderTick(event);
    }
  }
}

執行結果：

demo

【教學】PV3D 頂點基本建置 Pixel3D

2009-07-02T08:15:00.000-07:00

這個範例主要是測試頂點在3D場景中的變化，
PV3D主要提供了Pixels與Pixel3D這兩個類，
頂點加入光暈特效GlowFilter，
再配合TweenMax來改變頂點位置，
點擊滑鼠產生放大縮小效果：


package  
{  
  // flash  
  import flash.events.Event; 
  import flash.filters.GlowFilter;  
  import flash.events.MouseEvent;  
  // pv3d 
  import org.papervision3d.view.BasicView;  
  import org.papervision3d.core.geom.Pixels; 
  import org.papervision3d.core.geom.renderables.Pixel3D; 
  import org.papervision3d.core.effects.BitmapLayerEffect; 
  import org.papervision3d.view.layer.BitmapEffectLayer; 
  import org.papervision3d.objects.DisplayObject3D; 
  // gs
  import gs.TweenMax; 
  import gs.easing.*; 
  
  public class PV3DPoint_Sample extends BasicView 
  { 
    private var pixelArray:Array; 
    private var pixels:Pixels; 
    private var pixel3d:Pixel3D; 
    private var pixelbefly:BitmapEffectLayer; 
    private var PosXArray:Array; 
    private var PosYArray:Array; 
    private var PosZArray:Array; 
    private var step:int; 
    private var pgroup:DisplayObject3D; 

    public function PV3DPoint_Sample() 
    { 
      // 階段控制變數 
      step = 0; 
      // 3D點陣列 
      pixelArray = new Array(); 
      // 位置陣列 
      PosXArray = new Array(); 
      PosYArray = new Array(); 
      PosZArray = new Array(); 

      // 新增pixelbefly(像素層)讓 pixel繪製 
      pixelbefly = new BitmapEffectLayer(viewport,640,480,true,0,"clear_pre",false,false);
      // 清除畫面再繪製 
      pixelbefly.clearBeforeRender = true; 
      // 讓Pixels可以被繪製出來 
      viewport.containerSprite.addLayer(pixelbefly); 
      // 增加光暈特效 
      pixelbefly.addEffect(new BitmapLayerEffect(new GlowFilter(0xFFFFFF, 1,  3,  3, 5, 3))); 
      pixelbefly.addEffect(new BitmapLayerEffect(new GlowFilter(0x00AAFF, 1, 20, 20, 8, 3))); 
      // 設定背景色 
      viewport.opaqueBackground = 0x000000; 
      // 增設群組 
      pgroup = new DisplayObject3D(); 
      var index:int = 0; 
      for (var k:int = 0; k < 10; k++) 
      { 
        for (var i:int = 0; i < 10; i++) 
        { 
          for (var j:int = 0; j < 10; j++) 
          {
            pixels = new Pixels(pixelbefly);
            pixel3d = new Pixel3D(0xCCFFFFFF,0,0,0);
            pixels.addPixel3D(pixel3d);
            pixels.x = 0;
            pixels.y = 0; 
            pixels.z = 0;
            pixelArray[index] = pixels;  
            PosXArray.push(-250 + (50*i)); 
            PosYArray.push(-250 + (50*j)); 
            PosZArray.push(-250 + (50*k));
            pgroup.addChild(pixelArray[index], index.toString());
            index += 1; 
          } 
        } 
      } 
      scene.addChild(pgroup); 
      // 增加滑鼠事件
      stage.addEventListener(MouseEvent.CLICK, onPressHandle); 
      // 開始渲染 
      startRendering(); 
    }

    private function onPressHandle(event:MouseEvent):void 
    { 
      if ( step == 0) 
      { 
        step = 1; 
      }
      if ( step == 2) 
      { 
        step = 3; 
      } 
    } 

    override protected function onRenderTick(event:Event = null):void 
    {
      // 改變群組角度
      pgroup.rotationX = viewport.containerSprite.mouseY / 4;
      pgroup.rotationY = viewport.containerSprite.mouseX / 6;
      // 放大
      if (step == 1)
      {
        for (var index1:int = 0; index1 < 1000; index1++)
        {
          TweenMax.to(pixelArray[index1],1.2,{ x:PosXArray[index1],y:PosYArray[index1],z:PosZArray[index1],ease:Expo.easeInOut});
        }
        step = 2;
      }
      // 縮小
      if (step == 3)
      {
        for (var index2:int = 0; index2 < 1000; index2++)
        {
          TweenMax.to(pixelArray[index2],1,{ x:0,y:0,z:0,ease:Quad.easeIn} );
        }
        step = 0;
      }
      super.onRenderTick(event);
    }
  }
}

執行結果：

demo

【教學】動態改變MovieClip元件的註冊點

2009-06-30T02:29:00.000-07:00

當我們使用程式產生MovieClip時，
預設的註冊點是在物件的左上角座標(0,0)，
如果想要動態改變註冊點(任一點)，
可以再製作一個新的MovieClip來將原本的加入，
之後再設定其相對位置即可，
以下便是測試範例：


package  
{  
  import flash.display.MovieClip;  
  import flash.display.Shape;  
  import flash.events.Event;  
  import flash.events.MouseEvent;  

  public class Registration_Sample extends MovieClip  
  { 
    private var _Old_MC:MovieClip; 
    private var _New_MC:MovieClip; 
    private var act:Boolean; 
    private var line:Shape; 

    public function Registration_Sample() 
    { 
      act = false; 
      _Old_MC = new MovieClip();
      _Old_MC.graphics.clear(); 
      _Old_MC.graphics.beginFill(0x555555,0.5); 
      _Old_MC.graphics.drawRect(0,0,100,100); 
      _Old_MC.graphics.endFill(); 
      _Old_MC.x = 0; 
      _Old_MC.y = 0; 
     
      _New_MC = new MovieClip(); 
      _New_MC.x = stage.stageWidth/2; 
      _New_MC.y = stage.stageHeight/2; 
      _New_MC.addChild(_Old_MC); 
      addChild(_New_MC); 
      
      line = new Shape(); 
      line.graphics.clear(); 
      line.graphics.lineStyle(1,0xFF0000,1); 
      line.graphics.moveTo(0,stage.stageHeight/2); 
      line.graphics.lineTo(stage.stageWidth,stage.stageHeight/2); 
      line.graphics.lineStyle(1,0x00FF00,1); 
      line.graphics.moveTo(stage.stageWidth/2,0); 
      line.graphics.lineTo(stage.stageWidth/2,stage.stageHeight); 
      addChild(line); 
      
      stage.addEventListener(Event.ENTER_FRAME, onEnterFrameHandle); 
      stage.addEventListener(MouseEvent.MOUSE_UP, onMouseUphandle); 
    } 

    private function onMouseUphandle(event:MouseEvent):void 
    { 
      if (!act) 
      { 
        _Old_MC.x = -(_Old_MC.width/2); 
        _Old_MC.y = -(_Old_MC.height/2); 
        act = true; 
      } 
      else 
      { 
        _Old_MC.x = 0; 
        _Old_MC.y = 0; 
        act = false; 
      } 
    } 

    private function onEnterFrameHandle(event:Event):void 
    { 
      _New_MC.rotation += 5; 
    } 
  } 
}

執行結果：

demo

【教學】元件庫的MovieClip利用迴圈建立實體Object

2009-06-28T07:30:00.000-07:00

當元件庫有mc0 ~ mcN的MovieClip時，
想要利用迴圈來建立實體的流程：

1.個別打開元件庫的MovieClip連結屬性，建立連結。

2.使用getDefinitionByName這個類，可以取得元件庫的Class。
3.宣告ㄧ個陣列(準備存放建立的物件)。
4.之後於迴圈內new class()並將值放入陣列。


package
{
  import flash.display.MovieClip;
  import flash.utils.getDefinitionByName;

  public class Multiple_Sample extends MovieClip
  {
    private var objArray:Array;
    private var mcNum:int;
    public function Multiple_Sample():void
    {
      mcCount=10;
      objArray=new Array(mcCount);
      for(var i:int=0; i< mcCount; i++ )
      {
        var mclass:Class = getDefinitionByName("mc"+i.toString()) as Class;
        objArray[i]=new mclass();
        objArray[i].x=10+(i*(objArray[i].width+10));
        objArray[i].y=100;
        addChild(objArray[i]);
      }
    }
  }
}

執行結果：

【教學】Director 中使用Lingo 3D創建基本材質

2009-06-26T20:09:00.000-07:00

這是ㄧ個基本材質球的範例

Cast視窗：

Linog程式代碼：


---------- Movie Script:"Main"

global resSphere  -- 球體模型資源   
global modSphere  -- 球體模型
global txtSphere  -- 球體基本貼圖
global matSphere  -- 球體基本材質

on startmovie

  member("Scene3D").resetworld() 
  --建立球體模型資源
  resSphere = member("Scene3D").newModelResource("SphereRes",#Sphere,#front)
  --球體半徑
  resSphere.radius = 50
  --球體的起始角度
  resSphere.startAngle = 0
  --球體的結束角度
  resSphere.endAngle = 360
  --球體的解析度數(越高越平滑)
  resSphere.resolution = 24
  
  --建立球體模型
  modSphere = member("Scene3D").newModel("SphereRes")
  modSphere.resource = resSphere
  --球體位置
  modSphere.transform.position = vector(0,0,0)
  --球體旋轉
  modSphere.transform.rotation = vector(0,0,0)
   
  --設定基本材質球顏色
  --建立新的貼圖
  txtSphere = member("Scene3D").newtexture("SphereTxt")
  --建立標準材質
  matSphere = member("Scene3D").newshader("SphereMat",#standard)
  --設定材質球陰影色
  matSphere.ambient = rgb(50,50,50)                   
  --設定材質球基本色
  matSphere.diffuse = rgb(255,0,0)
  --設定材質球反光色
  matSphere.specular = rgb(255,255,255)
  --設定材質球發亮度
  matSphere.emissive = rgb(0,50,0)
  --設定反光範圍大小
  matSphere.shininess = 50
  --材質混合度
  matSphere.blend = 100
  --材質透明度
  matSphere.transparent = 100
  --描繪形式(#fill,##wire,#point)
  matSphere.renderstyle = #fill
  --設定貼圖
  matSphere.texture = txtSphere
  --將材質指定給模型
  modSphere.shader = matSphere                 
end


----------Frame Script:"Loop"
on exitFrame me

  go to the frame

end

Score視窗：

執行結果：

【教學】Director 中使用Lingo 3D創建基本貼圖

2009-06-26T11:01:00.000-07:00

這是ㄧ個簡單的球體加上基本材質貼圖的範例

Cast 視窗：

Lingo程式代碼：


----------Movie Script:"Main"
global resSphere    -- 球體模型資源
global modSphere  -- 球體模型
global txtSphere      -- 球體基本貼圖
global matSphere   -- 球體基本材質

on startmovie
  --初始化3D環境
  member("Scene3D").resetworld()
  --建立球體模型資源
  resSphere = member("Scene3D").newModelResource("SphereRes",#Sphere,#front)
  --球體半徑
  resSphere.radius = 50
  --球體的起始角度
  resSphere.startAngle = 0
  --球體的結束角度
  resSphere.endAngle = 360
  --球體的解析度數(越高越平滑)
  resSphere.resolution = 24  
  --建立球體模型
  modSphere = member("Scene3D").newModel("SphereRes")
  modSphere.resource = resSphere
  --球體位置
  modSphere.transform.position = vector( 0, 0, 0 )
  --球體旋轉
  modSphere.transform.rotation = vector( 0, 0, 0 )
  --設定基本材質球顏色
  --貼圖
  txtSphere = member("Scene3D").newTexture("SphereTxt",#fromCastmember,member("Ball"))
  --建立標準材質#standard,#painter,#engraver,#newsprint
  matSphere = member("Scene3D").newshader("SphereMat",#standard)
  --設定材質球陰影色
  matSphere.ambient = rgb(50,50,50)
  --設定材質球基本色
  matSphere.diffuse = rgb(100,100,100)
  --設定材質球反光色
  matSphere.specular = rgb(255,255,255)
  --設定材質球發亮度
  matSphere.emissive = rgb(50,50,50)
  --設定反光範圍大小
  matSphere.shininess = 70
  --材質混合度
  matSphere.blend = 70
  --材質透明度
  matSphere.transparent = 100
  --描繪形式(#fill,#wire,#point )
  matSphere.renderstyle = #fill
  --貼圖旋轉方向
  matSphere.texturetransform.rotate(0,0,0)
  --貼圖重複0.2重複5次
  matSphere.texturetransform.scale(1,1,1)
  --設定貼圖
  matSphere.texture = txtSphere
  --將材質指定給模型     
  modSphere.shader = matSphere               
end


----------Frame Script:"Loop"
on exitFrame me
  go to the frame
end

Scroe 視窗：

執行結果：

【教學】Director 中使用Lingo 3D創建網格面模型

2009-06-24T22:49:00.000-07:00

這是ㄧ個運用基本三角面製作的範例

Cast 視窗：

Lingo程式代碼：


----------Movie Script:"Main"
--三角面網格
global mshTriangle 
--三角面模型
global modTriangle  

on startmovie

  --3D環境初始
  member("Scene3D").resetworld()

  --建立網格
  --參數1:網格名稱
  --參數2:面數
  --參數3:頂點數
  --參數4:法向量
  --參數5:顏色數
  --參數6:貼圖座標
  mshTriangle = member("Scene3D").newMesh("TriangleRes",1,3,1,3,0)

  --頂點列表
  mshTriangle.vertexList=[vector(0,50,0),vector(-50,-50,0),vector(50,-50,0)]

  --顏色列表
  mshTriangle.colorList = [rgb(255,0,0),rgb(0,255,0),rgb(0,0,255)]     

  --面的頂點索引        
  mshTriangle.face[1].vertices = [1,2,3]  

  --面的顏色索引                                            
  mshTriangle.face[1].colors = [1,2,3]      

  --網格建立方式                                                
  mshTriangle.generateNormals(#flat) 

  --建立網格                                             
  mshTriangle.build()          
                                                                      
  --建立模型
  modTriangle = member("Scene3D").newModel("TriangleRes")   

  --設定大小          
  modTriangle.scale(1,1,1)      

  --設定模型資源                                                                
  modTriangle.resource = mshTriangle  

   --網格兩面顯示                                                 
  modTriangle.visibility = #both  
                                                               
end


----------Frame Script:"Loop"
--三角面模型
global modTriangle  

on exitFrame me

  --循環播放
  go to the frame   
  --模型旋轉     
  modTriangle.rotate(0,10,0)  
end

Score 視窗：

執行結果：

【教學】入門篇 PV3D 創建基本模型 Cube

2009-06-24T08:49:00.001-07:00

AS3程式代碼:


package 
{
  // flash
  import flash.events.Event;
 
  // pv3d
  import org.papervision3d.view.BasicView;
  import org.papervision3d.materials.WireframeMaterial;
  import org.papervision3d.materials.utils.MaterialsList;
  import org.papervision3d.objects.primitives.Cube;
 
  /**
   * ...
   * @author Max
   */
  // PV3DCube_Sample類繼承BasicView(基本3D框架)
  public class PV3DCube_Sample extends BasicView
  {
    // 方體模型材質
    private var CubeMat : WireframeMaterial; 
    // 方體模型材質列表
    private var CubeMatList : MaterialsList;
    // 方體模型
    private var CubeMod : Cube;
  
    // 建構子
    public function PV3DCube_Sample()
    {
      // 建置3D環境
      init3D();
    }
        
    // 建置3D環境
    private function init3D():void
    {
      // 建立材質(線性材質)
      // 參數1:顏色值
      // 參數2:Alpha值
      // 參數3:厚度
      CubeMat = new WireframeMaterial( 0xFF0000, 100, 0);
   
      // 建立材質列表
      CubeMatList = new MaterialsList(); 
   
      // 將方體六面材質加入材質列表
      CubeMatList.addMaterial( CubeMat, "front"  ); 
      CubeMatList.addMaterial( CubeMat, "back"   ); 
      CubeMatList.addMaterial( CubeMat, "left"   ); 
      CubeMatList.addMaterial( CubeMat, "right"  ); 
      CubeMatList.addMaterial( CubeMat, "top"    ); 
      CubeMatList.addMaterial( CubeMat, "bottom" ); 
   
      // 建立模型(方體)
      // 參數1:材質列表
      // 參數2:方體寬度
      // 參數3:方體深度
      // 參數4:方體高度
      // 參數5:寬度分隔節數
      // 參數6:深度分隔節數
      // 參數7:高度分隔節數 
      CubeMod = new Cube( CubeMatList, 200, 200, 200, 3, 3, 3);
   
      // 將模型加入3D場景中
      scene.addChild(CubeMod);
   
      // 開始渲染
      startRendering();
    }

    // Loop(循環渲染)
    override protected function onRenderTick(event:Event = null):void 
    {
      // 方體繞X軸旋轉
      CubeMod.pitch(1);
      // 方體繞Y軸旋轉
      CubeMod.yaw(2);
      // 方體繞Z軸旋轉
      CubeMod.roll(3);
   
      super.onRenderTick(event);
    }
  }
}

執行結果:

demo

【教學】入門篇 PV3D 創建基本模型 PaperPlane

2009-06-24T08:24:00.000-07:00

AS3程式代碼:


package  
{  
  // flash  
  import flash.events.Event;  
   
  // pv3d  
  import org.papervision3d.view.BasicView;  
  import org.papervision3d.materials.WireframeMaterial;  
  import org.papervision3d.objects.primitives.PaperPlane; 
   
  /** 
  * ... 
  * @author Max 
  */ 
  // PV3DPaperPlane_Sample類繼承BasicView(基本3D框架) 
  public class PV3DPaperPlane_Sample extends BasicView 
  {
    // 摺紙模型材質 
    private var PaperPlaneMat : WireframeMaterial; 
    // 摺紙模型 
    private var PaperPlaneMod : PaperPlane; 
     
    // 建構子 
    public function PV3DPaperPlane_Sample() 
    {
      // 建置3D環境 
      init3D(); 
    } 
    
    // 建置3D環境 
    private function init3D():void 
    { 
      // 建立材質(線性材質) 
      // 參數1:顏色值 
      // 參數2:Alpha值 
      // 參數3:厚度 
      PaperPlaneMat = new WireframeMaterial( 0xFF0000, 100, 0); 

      // 材質正反面都顯示 
      PaperPlaneMat.doubleSided = true; 
      
      // 建立模型(摺紙)
      // 參數1:材質
      // 參數2:比例 
      PaperPlaneMod = new PaperPlane( PaperPlaneMat, 2.5 ); 
      
      // 將模型加入3D場景中 
      scene.addChild(PaperPlaneMod); 
       
      // 開始渲染 
      startRendering();
    } 

    // Loop(循環渲染) 
    override protected function onRenderTick(event:Event = null):void 
    {
      // 摺紙繞X軸旋轉 
      PaperPlaneMod.pitch(5); 
      // 摺紙繞Y軸旋轉 
      PaperPlaneMod.yaw(5); 
      // 摺紙繞Z軸旋轉 
      PaperPlaneMod.roll(5); 
      super.onRenderTick(event); 
    } 
  } 
}

執行結果:

demo

【教學】入門篇 PV3D 創建基本模型 Sphere

2009-06-24T07:55:00.000-07:00

AS3程式代碼:


package 
{
  // flash
  import flash.events.Event;

  // pv3d
  import org.papervision3d.view.BasicView;
  import org.papervision3d.materials.WireframeMaterial;
  import org.papervision3d.objects.primitives.Sphere;
 
  /**
  * ...
  * @author Max
  */
  // PV3DSphere_Sample類繼承BasicView(基本3D框架)
  public class PV3DSphere_Sample extends BasicView
  {
    // 球體模型材質
    private var SphereMat : WireframeMaterial; 
    // 球體模型
    private var SphereMod : Sphere;
  
    // 建構子
    public function PV3DSphere_Sample()
    {
      // 建置3D環境
      init3D();
    }

    // 建置3D環境
    private function init3D():void
    {
      // 建立材質(線性材質)
      // 參數1:顏色值
      // 參數2:Alpha值
      // 參數3:厚度
      SphereMat = new WireframeMaterial( 0xFF0000, 100, 0);
   
      // 建立模型(球體)
      // 參數1:材質
      // 參數2:半徑
      // 參數3:寬面分隔節數
      // 參數4:高度分隔節數 
      SphereMod = new Sphere( SphereMat, 200, 12, 12);
   
      // 將模型加入3D場景中
      scene.addChild(SphereMod);
   
      // 開始渲染
      startRendering();
    }

    // Loop(循環渲染)
    override protected function onRenderTick(event:Event = null):void 
    {
      // 球體繞Y軸旋轉
      SphereMod.yaw(5);
      super.onRenderTick(event);
    }
  }
}

執行結果:

demo

【教學】入門篇 PV3D 創建基本模型 Cylinder

2009-06-23T09:56:00.000-07:00

AS3程式代碼:


package 
{
  // flash
  import flash.events.Event;
 
  // pv3d
  import org.papervision3d.view.BasicView;
  import org.papervision3d.materials.WireframeMaterial;
  import org.papervision3d.objects.primitives.Cylinder;
 
  /**
  * ...
  * @author Max
  */
  // PV3DCylinder_Sample類繼承BasicView(基本3D框架)
  public class PV3DCylinder_Sample extends BasicView
  {
    // 柱體模型材質
    private var CylinderMat : WireframeMaterial; 
    // 柱體模型
    private var CylinderMod : Cylinder;
  
    // 建構子
    public function PV3DCylinder_Sample()
    {
      // 建置3D環境
      init3D();
    }

    // 建置3D環境
    private function init3D():void
    {
      // 建立材質(線性材質)
      // 參數1:顏色值
      // 參數2:Alpha值
      // 參數3:厚度
      CylinderMat = new WireframeMaterial( 0xFF0000, 100, 0);

      // 建立模型(柱體)
      // 參數1:材質
      // 參數2:柱體半徑
      // 參數3:柱體高度
      // 參數4:行成圓的分隔數
      // 參數5:高度分隔節數
      // 參數6:頂部半徑
      CylinderMod = new Cylinder( CylinderMat, 150, 250, 12, 3, 150);
   
      // 將模型加入3D場景中
      scene.addChild(CylinderMod);

      // 開始渲染
      startRendering();
    }

    // Loop(循環渲染)
    override protected function onRenderTick(event:Event = null):void 
    {
      // 柱體繞X軸旋轉
      CylinderMod.pitch(5);
      // 柱體繞Y軸旋轉
      CylinderMod.yaw(5);
      super.onRenderTick(event);
    }
  }
}

執行結果:

demo

【教學】入門篇 PV3D 創建基本模型 Arrow

2009-06-23T08:41:00.000-07:00

AS3程式代碼:


package 
{
  // flash
  import flash.events.Event;
 
  // pv3d
  import org.papervision3d.view.BasicView;
  import org.papervision3d.materials.WireframeMaterial;
  import org.papervision3d.objects.primitives.Arrow;

  /**
   * ...
   * @author Max
   */
  // PV3DArrow_Sample類繼承BasicView(基本3D框架)
  public class PV3DArrow_Sample extends BasicView
  {
    // 箭頭模型材質
    private var ArrowMat : WireframeMaterial; 
    // 箭頭模型
    private var ArrowMod : Arrow;
  
    // 建構子
    public function PV3DArrow_Sample()
    {
      // 建置3D環境
      init3D();
    }
        
    // 建置3D環境
    private function init3D():void
    {
      // 建立材質(線性材質)
      // 參數1:顏色值
      // 參數2:Alpha值
      // 參數3:厚度
      ArrowMat = new WireframeMaterial( 0xFF0000, 100, 0);
    
      // 建立模型(箭頭)
      // 參數1:材質
      ArrowMod = new Arrow( ArrowMat );
   
      // 將模型加入3D場景中
      scene.addChild(ArrowMod);
   
      // 開始渲染
      startRendering();
    }

    // Loop(循環渲染)
    override protected function onRenderTick(event:Event = null):void 
    {
      // 箭頭繞X軸旋轉
      ArrowMod.pitch(5);
      // 箭頭繞Y軸旋轉
      ArrowMod.yaw(5);
      super.onRenderTick(event);
    }
  }
}

執行結果:

demo

【教學】入門篇 PV3D 創建基本模型 Cone

2009-06-22T07:14:00.000-07:00

AS3程式代碼:


package 
{
  // flash
  import flash.events.Event;
 
  // pv3d
  import org.papervision3d.view.BasicView;
  import org.papervision3d.materials.WireframeMaterial;
  import org.papervision3d.objects.primitives.Cone;
 
  /**
   * ...
   * @author Max
   */
  // PV3DCone_Sample類繼承BasicView(基本3D框架)
  public class PV3DCone_Sample extends BasicView
  {
    // 錐體模型材質
    private var ConeMat : WireframeMaterial; 
    // 錐體模型
    private var ConeMod : Cone;
  
    // 建構子
    public function PV3DCone_Sample()
    {
      // 建置3D環境
      init3D();
    }
            
    // 建置3D環境
    private function init3D():void
    {
      // 建立材質(線性材質)
      // 參數1:顏色值
      // 參數2:Alpha值
      // 參數3:厚度
      ConeMat = new WireframeMaterial( 0xFF0000, 100, 0);
    
      // 建立模型(錐體)
      // 參數1:材質
      // 參數2:錐體半徑
      // 參數3:柱體高度
      // 參數4:行成圓的分隔數
      // 參數5:高度分隔節數
      ConeMod = new Cone( ConeMat, 200, 300, 12, 3);
   
      // 將模型加入3D場景中
      scene.addChild(ConeMod);
   
      // 開始渲染
      startRendering();
    }

    // Loop(循環渲染)
    override protected function onRenderTick(event:Event = null):void 
    {
      // 錐體繞X軸旋轉
      ConeMod.pitch(5);
      // 錐體繞Y軸旋轉
      ConeMod.yaw(5);
      super.onRenderTick(event);
    }
  }
}

執行結果:

demo

【教學】入門篇 PV3D創建基本模型 Plane

2009-06-20T11:13:00.000-07:00

AS3程式代碼:


package 
{
  // flash
  import flash.events.Event;

  // pv3d
  import org.papervision3d.view.BasicView;
  import org.papervision3d.materials.WireframeMaterial;
  import org.papervision3d.objects.primitives.Plane;
 
  /**
  * ...
  * @author Max
  */
  // PV3DPlane_Sample類繼承BasicView(基本3D框架)
  public class PV3DPlane_Sample extends BasicView 
  {
    // 平面模型材質
    private var PlaneMat:WireframeMaterial;
  
    // 平面模型
    private var PlaneMod:Plane;  
  
    // 建構子
    public function PV3DPlane_Sample()
    {
      // 建置3D環境
      init3D();
    }
  
    // 建置3D環境
    private function init3D():void
    {
      // 建立材質(線性材質)
      // 參數1:顏色值
      // 參數2:Alpha值
      // 參數3:厚度
      PlaneMat = new WireframeMaterial( 0xFF0000, 100, 0);

      // 材質兩面都顯現
      PlaneMat.doubleSided = true;
   
      // 建立模型(平面)
      // 參數1:材質
      // 參數2:平面寬度
      // 參數3:平面高度
      // 參數4:寬度分隔數
      // 參數5:高度分隔數
      PlaneMod = new Plane( PlaneMat, 300, 300, 3, 3 );
   
      // 將平面模型加入3D場景中
      scene.addChild(PlaneMod);
   
      // 開始渲染
      startRendering();
    }

    // Loop(循環渲染)
    override protected function onRenderTick(event:Event = null):void 
    {
      // 平面模型繞Y軸自轉
      PlaneMod.yaw(10);  
      super.onRenderTick(event);
    } 
  } 
}

執行結果:

demo

ActionScript3 鍵盤控制

2009-06-18T20:51:00.000-07:00

AS3中的鍵盤事件可在任一個特定物件上偵聽，
使用方式很簡單，
只要先import flash.events.keyboardEvent類
在想要接收鍵盤訊號的物件上加入鍵盤偵聽事件即可。
鍵盤事件主要一般有
按下(KEY_DOWN)、
放開(KEY_UP)兩個事件。

  1 package
  2 {
  3     import flash.display.Sprite;
  4     import flash.events.KeyboardEvent;
  5
  6     /**
  7      * ...
  8      * @author Max
  9      */
 10     public class AS3KeyboardEvent extends Sprite
 11     {
 12         public function AS3KeyboardEvent()
 13         {
 14             initEvent();
 15         }
 16         private function initEvent():void
 17         {
 18             stage.addEventListener(KeyboardEvent.KEY_DOWN, onKeyboardEventHandle);
 19             stage.addEventListener(KeyboardEvent.KEY_UP,   onKeyboardEventHandle);
 20         }
 21         public function onKeyboardEventHandle(event:KeyboardEvent):void
 22         {
 23             trace(event.type);
 24         }
 25     }
 26 }

當按下任一鍵盤按鈕時會出現輸出訊息:
keyDown

當放開任一鍵盤按鈕時會出現輸出訊息:
keyUp

如果說想知道哪鍵盤被按下或放開，
需要鍵盤事件有關的資料。
這資料就是字元碼(charCode)、鍵位碼(keyCode)兩個屬性。
字元碼(charCode)屬性所表示的是被按下的字元，傳回ASCll碼。
鍵位碼(keyCode)字元內含代表被按下實體鍵的一個數字。

  1 package
  2 {
  3     import flash.display.Sprite;
  4     import flash.events.KeyboardEvent;
  5     import flash.ui.Keyboard;
  6     /**
  7      * ...
  8      * @author Max
  9      */
 10     public class AS3KeyCode extends Sprite
 11     {
 12         public function AS3KeyCode()
 13         {
 14            initKeyCode();
 15         }
 16         private function initKeyCode():void
 17         {
 18             stage.addEventListener(KeyboardEvent.KEY_DOWN, onKeyboardEventHandle);
 19         }
 20         public function onKeyboardEventHandle(event:KeyboardEvent):void
 21         {
 22             trace("charCode: " + event.charCode);
 23             trace("keyCode: "  + event.keyCode );
 24     
 25             switch(event.keyCode)
 26             {
 27                 case Keyboard.UP:
 28                 trace("按下鍵盤上鍵");
 29                 break;
 30         
 31                 case Keyboard.DOWN:
 32                 trace("按下鍵盤下鍵");
 33                 break;
 34         
 35                 case Keyboard.LEFT:
 36                 trace("按下鍵盤左鍵");
 37                 break;
 38         
 39                 case Keyboard.RIGHT:
 40                 trace("按下鍵盤右鍵");
 41                 break;
 42             }
 43         }
 44     }
 45 }

按下"A"鍵的輸出訊息:
charCode: 97
keyCode: 65

用程式碼做動畫

2009-06-13T19:41:00.000-07:00

用Flash的形狀(shape)或元件(symbol)做動畫，
Flash不會為各影格建立及儲存新的點陣圖像，
而連續影格的動畫，
Flash為影格儲存的是舞台(stage)上各個物件的資訊
(位置、大小、顏色..等)。
用程式碼(code)做動畫的流程：

初始化
重複動作
螢幕更新

【教學】PV3D 投影(Project)視圖(Viewport)

2009-06-13T02:23:00.000-07:00

PV3D2.0.883版本
在org/papervision3d/core/rende/project路徑下，
可以看到ProjectionPipeline這個類，
從字面上來看(投影管線)就好像水管ㄧ樣，
我們從管子的ㄧ方把資料放進去之後，
在裡面會做一些加工，
然後我們想要的東西就會從另ㄧ邊跑出來，
就像一個進行流水作業的工廠ㄧ樣。

ProjectionPipeline類別有一project的方法，
參數為(renderSessionData:RenderSessionData)，
在org/papervision3d/core/rende/project路徑下，
還有一個BasicProjectionPipeline類覆寫了此方法，
帶入renderSessionData這個參數，
就是管線來源資料，
透過處理得到我們的結果Viewport3D(視圖)。

當我們使用的預設的投影與渲染，
是將所有構成模型的三角面(Face)放在同一層，
只不過以先後順序將三角面一個個放上去，
才形成了遮擋，
而通常被擋住的就不顯示，
這種排列的缺點是，
當兩個模型非常靠近時，
他們的某些面會進行錯誤的排列，
產生很難看的破面現象。

而改用viewportLayer(視圖層級)，
能把一個或幾個模型以手動的方式加入一個或數個視圖層，
然後排列這些視圖層的前後順序。
這樣做的好處是，
可以對視圖層進行很多類似MovieClip的控制。
例如對視圖層加入濾镜特效等等，
甚至可以用来模擬镜頭焦距現象(Depth of Field)。
使用viewportLayer要注意的是，
一旦使用了layer，
就要場景裡所有物体都使用，
没有使用的物体都會被預設是排列在最底層，
也就是說，
沒有加入任何視圖層的模型都會被上面的視圖層蓋在最下面。

在org/papervision3d/view/layer/util路徑下，
有個視圖排列的類(ViewportLayerSortMode)，
該類別提供三個靜態屬性：
Z_SORT、INDEX_SORT、ORIGIN_SORT
說明了視圖層排列的方式。

透過投影矩陣轉換之後，
也就是3D轉成2D視圖，
一般viewport就是2D視圖結果，
所以像一些文字、圖片、Sprite、MovieClip...等，
就可加入至此。

【教學】PV3D 攝影機(Camera)

2009-06-07T22:59:00.000-07:00

PV3D2.0.883版本在org/papervision3d/cameras路徑下，
可以看到四個跟攝影機(Camera)有關的類(Class)：
CameraType、Camera3D、DebugCamera3D、SpringCamera3D。

主要先介紹CameraType這個類別，
該類別提供四個公用屬性這四個公用屬性可用字串
"Debug"(除錯)、"Free"(自由移動)、"Spring"(跟隨)、"Target"(目標)
來表示攝影機的類型，
一般我們在創建PV3D框架時所使用的camera類型，
預設值都是"Target"，
也就是攝影機的目標視點對準3D場景的世界座標中心(x:0,y:0,z:0)。
要變更CameraType類型只要在BasicView衍生的子類裡，
修改父類的參數值，
如：super( 640, 480, true, false, CameraType.FREE)，
第五個參數可換成
CameraType.TARGET、CameraType.FREE、CameraType.DEBUG、CameraType.SPRING。

PV3D改變攝影機種類檔案程式代碼:


package
{
  import flash.events.Event;
  import org.papervision3d.cameras.CameraType;
  import org.papervision3d.view.BasicView;

  public class PV3D_Sample_Camera extends BasicView
  {
    public function PV3D_Sample_Camera()
    {
      super( 640, 480, true, false, CameraType.DEBUG);
      startRendering();
    }
  
    override protected function onRenderTick(event:Event = null):void
    { 
      renderer.renderScene(scene, _camera, viewport);
    }
  }
}

當檔案執行成功時螢幕會自動出現debug文字訊息。

Camera3D是繼承CameraObject3D而來。

【教學】入門篇 PV3D 基本框架建置(一)

2009-06-07T20:38:00.000-07:00

PV3D2.0.以前早期提供的基本3D環境框架較繁雜，
主要需要自己建立一個基本3D環境類別(衍生Sprite)，
內容包含所有的3D基本物件scene、camera、viewport、
renderer(由Scene3D、Camera3D、Viewport3D、
BasicRenderEngine類別建立)。

主要是按照3D繪圖的流程來建立，
先建立好一個3D場景，
將任何3D物件(DisplayObject)加入，
之後透過world->view->projection
的一連串Transform(3D轉2D)產生viewport，
最後將viewport循環render渲染。

程式碼如下:


package
{
  //////////////////// 匯入類別
  //Flash
  import flash.display.Sprite;
  import flash.events.Event;

  //PV3D
  import org.papervision3d.scenes.Scene3D;
  import org.papervision3d.cameras.Camera3D;
  import org.papervision3d.view.Viewport3D;
  import org.papervision3d.render.BasicRenderEngine;
 
  //////////////////// PV3D基本框架類別
  public class PV3D_Framework extends Sprite
  {
    //場景3d，用來放置所有的3d物件 
    private var scene:Scene3D;
    //Camera3D 物件
    private var camera:Camera3D;
    //Viewport3D，3D轉成2D後的呈現畫面  
    private var viewport:Viewport3D;
    //渲染(算圖)引擎 
    private var renderer:BasicRenderEngine;
    
    //建構函式
    public function PV3D_Framework()
    {
      //初始化   
      init3D();
    }
 
    //////////////////// 初始化3D
    private function init3D():void
    {
      //建立scene3D物件
      scene = new Scene3D;
      //建立camera物件 
      camera = new Camera3D;
      //建立viewport物件(寬，高，是否自動對齊場景中間，是否可與mouse互動)
      viewport = new Viewport3D( 550, 400, true, false);
      //將viewport物件加入。 
      this.addChild(viewport);
      //建立渲染引擎
      renderer = new BasicRenderEngine;
      //加入時間軸(Loop)偵聽事件    
      this.addEventListener(Event.ENTER_FRAME, onEventRender3D);
    }
    
    //////////////////// 進入時間軸(Loop)
    private function onEventRender3D(event:Event):void
    {
      //渲染 
      renderer.renderScene( scene, camera, viewport); 
    }
  }
}

當檔案執行成功時輸出視窗會自動秀出下列訊息：
INFO: Papervision3D Public Beta 2.0 - Great White (December 3rd, 2008)INFO: Viewport
autoScaleToStage : Papervision has changed the Stage scale mode.

PV3D 格鬥遊戲3D碰撞測試

2009-06-03T07:27:00.000-07:00

這個範例主要是運用DAEMC這個類別來控制角色的動畫，
如等待、行走、攻擊..等。
此外加入3D物件碰撞偵測，
使出拳跟踢腳能判定是否碰撞，
再依據碰撞結果扣除血量。
不過目前是以出拳的最長點為判定屬點的判別，
將做方體(也就是整隻手的碰撞)，
及身體各部位碰撞體來做判斷應該會更準確。

demo

操控方式；
角色1：W、A、D鍵控制移動，G、H鍵攻擊
角色2：上、左、右鍵控制移動，K、L鍵攻擊

ActionScript 3.0 官方說明文件

2009-05-28T07:07:00.000-07:00

ActionScript 3.0 官方說明文件參考：
http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/

ActionScript 3.0 錯誤訊息對照表

2009-05-27T08:39:00.000-07:00

ActionScript 3.0 錯誤訊息都可以由下面查得: http://help.adobe.com/zh_TW/AS3LCR/Flash_10.0/runtimeErrors.html

BulkLoader 下載類別

2009-05-27T08:35:00.000-07:00

這是BulkLoader下載(loader)類別的說明文件:
http://www.stimuli.com.br:8080/media/projects/bulk-loader/docs/

PV3D 官方說明文件

2009-05-27T08:23:00.000-07:00

PV3D官方說明文件:
http://papervision3d.googlecode.com/svn/trunk/as3/trunk/docs/index.html

【教學】入門篇 PV3D 基本框架建置(二)

2009-05-21T03:21:00.000-07:00

PV3D2.0.883版本提供了的基本整合框架BasicView類別，
由於本身是繼承AbstractView類別，
而該類別又是從Sprite類別衍生而來，
所以可以加入任何DisplayObject。
BasicView類別主要封裝了BasicRenderEngine、Scene3D、Camera3D…等類別，
運用此類別能快速建立一個PV3D的環境。


package  
{
  import flash.events.Event;  
  import org.papervision3d.view.BasicView;  

  public class PV3D_Sample_BasicView extends BasicView  
  {
    public function PV3D_Sample_BasicView()
    {
      startRendering(); 
    } 

    override protected function onRenderTick(event:Event = null):void
    {
      renderer.renderScene(scene, _camera, viewport); 
    } 
  } 
}

當檔案執行成功時輸出視窗會自動秀出下列訊息：
INFO: Papervision3D Public Beta 2.0 - Great White (December 3rd, 2008)
INFO: Viewport autoScaleToStage : Papervision has changed the Stage scale mode.

PV3D 滑鼠操控角色 + 鏡頭切換

2009-05-16T00:45:00.000-07:00

以前用C#&XNA寫過類似的Demo，
在C#中對矩陣跟向量的操作個人認為比較容易，
反倒是PV3D在使用上較不靈活。
這是繼鍵盤操控3D角色(老鼠跑步)後，
又一新的測試，
利用外部載入地形與人物角色，
加上滑鼠偵測3D場景中網格面座標，
使人物能跟隨所設定的標記移動，
由於地形是平面的，
暫時用三角函數解決旋轉角度的問題，
有試著用兩向量內積的方式求角度，
也可得出角度，
不過仍需判定角色前方射線與標記所在象限，
這個問題比較麻煩，
不過要計算高低不平的地形，
還是需要用到，
有空會繼續研究。
可按"Ctrl"&"Shift"鍵去切換鏡頭跟隨。

Demo

PV3D應用DAE模型格式避免破面的幾種方法

2009-05-14T20:45:00.000-07:00

目前在3DMax裡製作了一個機器人模型，輸出給Director來製作操控機器人行走的Demo，輸出W3D格式時，在Director環境下測試正常，想另外輸出(export)DAE模型格式給PV3D使用，結果套用到PV3D時發生了嚴重的破面問題，查了一些網路上的資訊，也試了許多方式，歸納出DAE模型格式避免破面的幾種方法:

所有匯入PV3D的模型，未避免破面只有在3D製作軟體裡控制好模型的頂點數與面數。就拿Director與PV3D來比較，PV3D的模型點數與面數一定要再簡化(優化)。
所有模型在建模時，儘量使用Low Polygon的作法，直接使用EditMesh編輯，避免使用布林運算，因為布林往往會產生無法控制的面和線段，並儘量保持模型在四邊形面的基礎上。
在PV3D裡只要是距離太近的面也會行成破面，所以要掌握各頂點間的距離，不宜太近。
PV3D中使用QuadrantRenderEngine，不過最好還是在建模時就避免掉。

PV3D & Plane選單應用範例(三)

2009-05-14T10:33:00.000-07:00

Demo

PV3D & Plane選單應用範例(二)

2009-05-14T10:30:00.000-07:00

Demo

PV3D & Plane選單應用範例(一)

2009-05-14T10:28:00.000-07:00

Demo

PV3D 在3D物體表面上畫圖

2009-05-14T09:50:00.000-07:00

這是一個利用pv3d裡InteractiveScene3DEvent與
InteractiveUtils這兩個類加上匯入的DAE模型所做出來的範例，
可即時在3D的物體上Draw，
也測試了基本球體Sphere跟方體Cube，
InteractiveUtils這個類非常方便，
能幫我們處理了3D座標轉換的問題，
這使得PV3D在一些3D專案的應用上又有更多花樣了。

Demo

【教學】Director 中使用Lingo 3D創建基本分子模型

2009-05-11T09:09:00.000-07:00

Cast視窗:

Lingo程式代碼：


----------Movie Script:"Main"
global resParticle    -- 分子模型資源   
global modParticle    -- 分子模型
global txtParticle    -- 分子貼圖

on startMovie
  member("Scene3D").resetworld()
  --建立分子貼圖
  txtParticle = member("Scene3D").newTexture("particleTxt",#fromCastmember,member("txt1"))
  txtParticle.renderformat = #rgba8888           --以32bit的模式繪圖
  --建立分子模型資源 
  resParticle = member("Scene3D").newModelResource("ParticleRes",#Particle)
  resParticle.texture = txtParticle              --分子的貼圖
  resParticle.lifetime = 2000                    --分子存在的時間
  resParticle.drag = 1                           --分子的摩擦力0-100
  resParticle.Gravity = vector(0,0,0)            --分子地心引力
  resParticle.Wind = vector(0,0,0)               --分子風力
  resParticle.tweenmode = #age                   --分子顏色漸變方式(#velocity,#age)
  resParticle.colorRange.start = rgb(255,255,255)--分子開始的顏色
  resParticle.colorRange.end = rgb(0,0,0)        --分子結束的顏色
  resParticle.blendrange.start = 100             --分子開始的透明度
  resParticle.blendrange.end = 100               --分子結束的透明度
  resParticle.sizerange.start = 5                --分子開始的大小
  resParticle.sizerange.end = 1                  --分子結束的大小
  resParticle.emitter.numParticles = 1000        --分子數量
  resParticle.emitter.mode = #stream             --分子發射方式(#burst一次,#stream部分)
  resParticle.emitter.loop = true                --分子是否重複
  resParticle.emitter.direction = vector(0,0,0)  --分子發射方向
  resParticle.emitter.angle = 180                --分子發射角度(0-180)
  resParticle.emitter.distribution = #linear     --分子散發方式(#gaussian,#linear)  
  resParticle.emitter.region = [vector(0,0,0)]   --分子發射區域
  resParticle.emitter.path = [vector(0,0,0)]     --分子的前進路徑
  resParticle.emitter.pathStrength = 0.0         --分子是否緊靠path前進
  resParticle.emitter.minspeed = 40              --分子最小前進速度
  resParticle.emitter.maxspeed = 80              --分子最大前進速度  
  --建立分子模型
  modParticle = member("Scene3D").newModel("ParticleRes")
  modParticle.resource = resParticle 
  modParticle.transform.position = vector( 0, 0, 0 )  --分子位置
  modParticle.transform.rotation = vector( 0, 0, 0 )  --分子旋轉
end


----------Frame Script:"Loop"
on exitFrame me
  go to the frame
end

Score視窗:

執行結果:

【教學】Director 中使用Lingo 3D創建基本柱體模型

2009-05-11T09:02:00.000-07:00

Cast視窗：

Lingo程式代碼：


----------Movie Script:"Main"
global resCylinder    -- 柱體體模型資源   
global modCylinder  -- 柱體模型

on startmovie
  member("Scene3D").resetworld()
  --建立柱體模型資源 
  resCylinder = member("Scene3D").newModelResource("CylinderRes",#Cylinder,#front)
  resCylinder.height = 100          --柱體高度
  resCylinder.topRadius = 25        --柱體的頂面半徑 
  resCylinder.bottomRadius = 25     --柱體的底面半徑
  resCylinder.startAngle = 0        --柱體的起始角度
  resCylinder.endAngle = 360        --柱體的結束角度
  resCylinder.topCap = true         --柱體的頂面是否封閉
  resCylinder.bottomCap = true      --柱體的底面是否封閉
  resCylinder.resolution = 24       --柱體的解析度數(越高越平滑)
  resCylinder.numSegments = 2       --柱體的區段數
  --建立柱體模型
  modCylinder = member("Scene3D").newModel("CylinderRes")
  modCylinder.resource = resCylinder 
  modCylinder.transform.position = vector( 0, 0, 0 )     --柱體位置
  modCylinder.transform.rotation = vector( 30, 15, 15 )  --柱體旋轉
end


----------Frame Script:"Loop"
on exitFrame me
  go to the frame
end

Score視窗：

執行結果：

【教學】Director 中使用Lingo 3D創建基本球體模型

2009-05-11T08:14:00.000-07:00

Cast視窗：

Lingo程式代碼:


----------Movie Script:"main"
global resSphere    -- 球體模型資源   
global modSphere    -- 球體模型
on startmovie
  member("Scene3D").resetworld()
  --建立球體模型資源
  resSphere = member("Scene3D").newModelResource( "SphereRes", #Sphere, #front )
  resSphere.radius = 50           --球體半徑
  resSphere.startAngle = 0        --球體的起始角度 
  resSphere.endAngle = 360        --球體的結束角度
  resSphere.resolution = 24       --球體的解析度數(越高越平滑)
  --建立球體模型
  modSphere = member("Scene3D").newModel("SphereRes")
  modSphere.resource = resSphere
  modSphere.transform.position = vector( 0, 0, 0 )  --球體位置
  modSphere.transform.rotation = vector( 0, 0, 0 )  --球體旋轉
end


----------Frame Script:"Loop"
on exitFrame me
  go to the frame
end

Score視窗：

執行結果：

【教學】Director 中使用Lingo 3D創建基本方體模型

2009-05-11T07:34:00.000-07:00

Cast視窗：

Lingo程式代碼：


-----Movie Script:"Main"
global resBox    -- 方體模型資源   
global modBox    -- 方體模型

on startmovie
  member("Scene3D").resetworld()
  --建立方塊模型資源
  resBox = member("Scene3D").newModelResource( "BoxRes", #Box, #front )
  resBox.length = 60           --方體長度
  resBox.width = 60            --方體寬的 
  resBox.height = 60           --方體高度
  resBox.lengthVertices = 2    --方體長向的頂點數
  resBox.widthVertices = 2     --方體寬向的頂點數
  resBox.heightVertices = 2    --方體高向的頂點數
  resBox.top = true            --設定頂面為封閉
  resBox.bottom = true         --設定下面為封閉
  resBox.left = true           --設定左面為封閉
  resBox.right = true          --設定右面為封閉
  resBox.front = true          --設定前面為封閉
  resBox.back = true           --設定後面為封閉
  --建立方塊模型
  modBox = member("Scene3D").newModel("BoxRes")
  modBox.resource = resBox
  modBox.transform.position = vector( 0, 0, 0 )
  modBox.transform.rotation = vector( 20, 30, 20 )
end


-----Frame Script:"Loop"
on exitFrame me
  go to the frame
end

Score視窗：

執行結果：

【教學】Director 中使用Lingo 3D創建基本平面模型

2009-05-10T09:45:00.000-07:00

Cast視窗：

Lingo程式代碼：


----------Movie Script:"main"
global resPlane  -- 平面模型資源   
global modPlane -- 平面模型

on startmovie
  member("Scene3D").resetworld()
  --建立平面模型資源
  resPlane = member("Scene3D").newModelResource( "PlaneRes", #Plane, #both )
  resPlane.length = 120           --平面長度
  resPlane.width = 120            --平面寬的 
  resPlane.lengthVertices = 2  --長的頂點數
  resPlane.widthVertices = 2   --寬的頂點數
  --建立平面模型
  modPlane = member("Scene3D").newModel("PlaneRes")
  modPlane.resource = resPlane
  modPlane.transform.position = vector( 0, 0, 0 )
  modPlane.transform.rotation = vector( 0, 0, 0 )
end


----------Frame Script:"Loop"
on exitFrame me
  go to the frame
end

Score視窗：

執行結果：

學習3D程式的經驗

2009-05-08T08:57:00.000-07:00

很多新手都會問，
該如何進入3D的開發領域呢？
其實並不難，
就像看場棒球賽，
總要先了解棒球的遊戲規則，
才能享受棒球比賽的樂趣，
這裡提供出個人的學習3D程式的經驗流程，
希望能對大家有所幫助：

首先要找一套能提供3DAPI或支援3D引擎的程式開發工具，
如(Director Lingo3D、FlashActionScript Papervision3D、
C# XNA、VC++ DirectX等..)。
程式語言只是開發工具，
任選一種適合自己的來學習。
要開發3D的專案，
基本的程式基礎是要會的(例如變數、陣列、函式、迴圈..等)，
由於現在支援3D的程式語言都已是物件導向，
所以具備這樣的觀念是必須的。

學習3D最好能先學會一種3D建模的工具軟體，
如﹝3DMax、Maya..等﹞，
因為建模當中，
很多3D的觀念是相通的，
像是頂點Vertices、邊線Edge、網格Mesh、模型Model、
群組Group、3D空間座標、材質Material、貼圖Texture、
燈光Light、攝影機Camera等，
學會基本建模的概念對日後撰寫3D程式絕對有加分作用。

這裡提供大家一個觀念，
"3D"本身只是一個觀念(規則)，
跟你用甚麼語言來開發其實沒多大的關係，
瞭解3D圖學的數學運算原理，
如(向量運算、矩陣運算...等)，
這裡不用擔心它太複雜，
因為現在任何的3D引擎或API都已經提供相當完整的函式，
只要知道如何運用就可，
運算過程就交給程式去處理.
也就是要知道如何"套"比較重要，
因為有了觀念，
去學任何一種程式開發工具，
就能很快知道要如何"套"跟怎麼"套"了。

接下來就可找一些範例來實作，
開始可先套用，
再慢慢理解別人的code，
到後來就是看到效果就知如何下手，
當然這個過程可是非常漫長，
經驗是慢慢累積的，
多看多問是學習的不二法門。

PV3D & Jiglib 物理引擎範例

2009-05-06T07:54:00.000-07:00

特別研究了一下好用的Jiglib物理引擎，
他與PV3D做搭配非常簡易，
只需設定JBOX與PhysicsSystem
就能輕輕鬆鬆為建立好的模型加上物理性質，
本例主要測試的是JBOX，
所以自己做了一個簡易的骰子，
讓他與桌面都設上物理性質，
便可產生模擬物理碰撞的效果，
此外額外增加拖曳骰子跟基本點數判斷。

Demo

PV3D & as3dmod翻書效果模擬

2009-05-05T09:39:00.000-07:00

網路上一些翻書的範例大多都是2D的，
運用遮罩的方式去模擬，
研究了PV3D一陣子，
想測試PV3D與as3dmod，
利用as3dmod變形類別來修改物件的Mesh，
已達到真正的3D翻書,
以下是測試結果：

Demo

PV3D & DAE應用範例(四)

2009-05-04T09:11:00.000-07:00

這是使用Low Polygon的建模作法，
樹幹使用三角面，
樹葉部份是使用Plane貼上png透空貼圖。
測試3D場景內樹木的作法，
測試外部載入Flash內，
之後打造更大場景時，
可當作元件匯入：

Demo

PV3D & DAE應用範例(三)

2009-05-02T08:17:00.000-07:00

這個範例是載入自己在3DMax裡花了兩天所拉出的房子模型，
模型面數掌握在1000面以內，
﹝Vertext:479，Face:961﹞，
以便Flash在執行上能不吃太多CPU，
以下是測試結果：

Demo

【教學】入門篇 PV3D 下載與安裝設定

2009-05-01T22:47:00.000-07:00

Step1：
1.先連上http://code.google.com/p/papervision3d/updates/list。
2.在上列選取第二個﹝Downloads﹞，出現如下畫面。
3.找到Papervision3d最新版本來下載。

Step2：
1.點選最新版本Papervision3D_2.0.883.zip(目前為止最新版).準備下載。

Step3：
1.選取欲下載儲存PV3D檔案的資料夾路徑﹝D：﹞

Step4：
1.下載至﹝D：﹞。
2.PV3D壓縮檔﹝ZIP﹞準備解壓縮至自訂資料夾。
3.自訂資料夾﹝PV3D_2.0.883﹞資料名稱可自取。

Step5：
1.開啟自訂資料夾。
2.查看裡面內容，完成下載。

Step6：
1.準備設定Flash內的連結，打開Flash。

Step7：
1.開一個新檔案。
2.選取編輯->偏好設定。

Step8：
1.類別選取ActionScript。
2.語言選取ActionScript3.0設定...。

Step9：
1.在包含ActionScript類別檔案的資料夾，先點選"+"。
2.再點選瀏覽資料夾。
3.選取我們剛剛下載的自訂資料夾(PV3D_2.0.883)。
4.按下確定。

Step10：
1.完成PV3D下載及安裝設定。

Director 中使用ActiveX控制項介紹

2009-04-30T18:58:00.000-07:00

安裝在Windows作業系統下的ActiveX控制項，
可以由控制附加程式(Control Xtra)嵌入Director的電影(movie)中，
透過這項技術我們可執行ActiveX所賦予的功能。
在使用ActiveX 控制項前，
一定要先確定該控制項已經完整(註冊)安裝在系統中。

ActiveX控制項Property的使用：
ActiveX控制項以屬性來描述它的資訊與定義它的狀態。

Lingo語法:

set the 屬性名稱 of sprtite 編號 to 設定值
或
sprite(編號).屬性編號 = 設定值

ActiveX 控制項 Method的使用：
ActiveX控制項使用方法﹝Method﹞來描述它的機能,也就是一個函式。

Lingo語法:

put 方法名稱(sprite編號,引數1,...) into 變數名稱

註:變數可存放傳回值

ActiveX 控制項 Event的使用：
ActiveX控制項的事件(event)與 Director的事件是可以看作一樣的，
只要在Director的電影中建立相對應的處理函式就可以偵聽到事件。

Lingo語法:

on 事件名稱
敘述...
end

Director 的Lingo語言物件導向程式介紹

2009-04-29T09:43:00.000-07:00

Director的Lingo程式語言提供了
(OOP：ObjectOrientedProgramming)，
物件導向的程式設計使用物件的觀念來設計專案，
可以節省很多時間，
並在程式的維護上更有效率。

物件Object是資料與使用這些資料的介面的包裝，
是用類別所宣告的實體Instance。介面包括：

屬性(Properties)
是物件資料的存取介面，用來讀取物件資料或設定物件的特性。

方法(Method)
對應Lingo裡的Handle，是改變物件資料的介面。

事件(Event)
是物件與環境互動的介面，用來提供物件對外界訊息的反應。

類別Class是物件的原型，
它的屬性、行為及事件都會被用這個原型的物件所擁有，
此外類別可以繼承Inhert別的類別或是被別的類別繼承。

Lingo與其他物件導向語言對照表

Lingo語言	其他語言
Ancestor Scripts(祖系腳本)	Super Class 或 Base Class
Parent Scripts(父系腳本)	類別Class
Child Objects(子系物件)	實體Instance
Propert Variables(屬性變數)	Insatance Variables
Handles(方法處理函式)	方法Methods

Director 3D基本環境建置

2009-04-29T05:03:00.000-07:00

步驟1:
1.選取File。
2.開新檔案(New一個Movie檔)。

步驟2：
1.在castmember視窗中選取member(1)。
2.選取Menu上的Insert 。
3.下拉選單中選取Media Element。
4.下拉選單中選取ShockWave 3D。

步驟3：
1.出現Shockwave3D視窗，輸入Member名稱"3DWorld”。

步驟4：
1.此時Cast視窗內即出現Member("3DWorld")。

步驟5：
1.將Cast視窗內Member(1)拖曳至Stage視窗內。

步驟6：
1.於Score視窗內的Frame Script Channel上點擊滑鼠右鍵，
於彈出視窗內選擇FrameScript，按滑鼠左鍵確定。

步驟7：
1.隨即彈出Script編輯視窗，輸入Member名稱”Loop”，於視窗內輸入
go to the frame。(讓程式不斷執行)

步驟8：
1.Cast視窗內即出現Member("Loop")。於member(3)內雙擊滑鼠。

步驟9：
1.彈出Script編輯視窗,點擊Script視窗內”+號”，新增一個Script。
2.於Propert視窗內將Script的屬性更改為Movie。

步驟10：
1.將Cast視窗內Member(3)的名稱輸入為"Main”，繼續編輯該內容。

步驟11：
1.於Script視窗內輸入member(“3DWorld”).resetworld()，即完成基本3D環境創建。

Director Lingo 3D概述

2009-04-28T09:59:00.000-07:00

Director是一套功能強大的多媒體編輯工具。
早期在多媒體光碟上應用很廣，
很多CAI的互動教材都是由Director製作，
也能製作遊戲...等。

Director跟Flash很像的就是Flash有ActionScript程式語言，
而Director有Lingo程式語言作為編輯，
而在Director 8版以後，
能讓Director產生的影片能在網際網路上執行，
(Shockwave就是讓Director產生的格式可以在網路上播放的關鍵)，
在Director 8.5版以後革命性的產生變化，
增加了3D功能(Directtor的3D功能是支援3D硬體加速的)，
這項和intel合作的技術，
以網路3D為號召，
讓開發者在設計製作專案時，
可以發揮3D素材的優勢(虛擬實境，3D游戲，3D互動網頁)，
目前Director 11.5的版本已經支援DirectX9.0，
可以說在3D的效能上大大的提升。

3D模型(Model)構成了大多數程式的基礎。
大多數的遊戲幾乎都是使用模型來表現在遊戲世界中的一切。
瞭解3D模型運作的原理與細節，
將有助於製作出極佳的3D專案。
簡單的來說，3D模型是頂點(Vertices)的集合，
兩個點可以行成線(Edge)，
三個點就可以構成一個三角面(Face)，
而兩個三角面即可組成一個四邊形(Polygon)，
多個面就組成一個幾何物件(Mesh)。
其實萬物歸幾何，
透過觀察和幾何分析，
將真實世界所有的事物分解成複雜程度不一的幾何圖形。
就能透過電腦3D運算來模擬真實世界。

而Director裡3D格式就是Shockwave3D格式，
3D模型檔案包含每一頂點的一些附加屬性
(該頂點相對應的材質座標、該頂點的法向量等等)。
所有的模型資訊都儲存在檔案裡。
而每個3D編輯器都有不同的檔案格式；
像3DMax軟體就支援外掛輸出Shockwave3D檔案格[*.W3D]，
可以在編輯軟體中製作好模型在輸出給Director運用。
也可利用Lingo語言內建的3D Library來建立。

PV3D & DAE應用範例(二)

2009-04-23T10:42:00.000-07:00

之前看過國外的網站有人拿自己的頭部模型，
存成DAE檔匯入至PV3D中，
利用滑鼠控制頭部的轉動方向，
覺得很有趣，
自己嘗試用3DMax也拉了顆頭部模型，
頂點數不多，
而貼圖使用素材的照片，
測試了PV3D內的Blur filter跟InteractiveScene3DEvent，
以下是測試結果：

Demo

PV3D & DAE應用範例(一)

2009-04-21T09:05:00.000-07:00

最近研究了一下PV3D，
發現載入外部模型(DAE格式)非常方便，
在3DMax軟體中製作模型角色(骨骼動畫)，
配合外掛輸出DAE檔格式，
運用DAEMC這個Class，
可輕鬆製作角色動畫控制，
以下就是實作的範例。

Demo

Max の 3D Studio

【測試】Flash3D API(Molehill)Jiglib物理引擎範例

【測試】Flash3D API(Molehill) MD2模型範例

【教學】Flash 3D API(Molehill) Texture

【教學】Flash 3D API(Molehill) DrawSquareMesh

【教學】Flash 3D API(Molehill) DrawTriangleMesh

【教學】Flash 3D API(Molehill) 基本框架建立

【教學】Director 3D與PhysX 物理引擎

【教學】Android OpenGL ES LoadTexture

【教學】Android OpenGL ES Primitive_Cube

【教學】Android OpenGL ES Primitive_Sphere

【教學】Android OpenGL ES DrawEllipse

【教學】Android OpenGL ES DrawMesh

【教學】Android OpenGL ES DrawLine

【教學】Android OpenGL ES DrawPoint

【教學】Android OpenGL ES 3D基本框架建立

【教學】拖曳3D模型物件

【教學】在Windows 7 上安裝 Android 開發環境步驟

【教學】Android在Windows上開發環境

【教學】InteractiveSceneManager & Mouse3D

【作品】 PV3D 3D線段(Lines3D)測試

【作品】 Jiglib & papervision3d 碰撞測試

【作品】自訂Reflection效果測試

【作品】波浪效果選單測試

陣列類別

【教學】平面基本材質(雙面貼圖)

【作品】 極光效果測試

【教學】多圖載入時百分比表示

【教學】PV3D 動態陰影範例 Shadow Texture

【教學】PV3D動態選取貼圖 Dynamic Texture

【教學】PreLoad 下載進度百分比

【教學】PV3D動態貼圖 Dynamic Texture

【教學】Flash ActionScript3 Random亂數應用

【教學】PV3D 結合 flartoolkit

【教學】Director 3D 滑鼠互動 & 模型貼圖變換

【作品】Director 中使用Lingo 3D建置象棋

【教學】VC++與Flash溝通(二)

【教學】VC++與Flash溝通(一)

【教學】PV3D 自定義動畫網格範例

【教學】PV3D創建網格模型 TriangleMesh3D

色彩值轉換函式

SBCS函數對照表

【教學】PV3D Particle3D 粒子效果

【教學】PV3D 頂點基本建置 Pixel3D

【教學】動態改變MovieClip元件的註冊點

【教學】元件庫的MovieClip利用迴圈建立實體Object

【教學】Director 中使用Lingo 3D創建基本材質

【教學】Director 中使用Lingo 3D創建基本貼圖

【教學】Director 中使用Lingo 3D創建網格面模型

【教學】入門篇 PV3D 創建基本模型 Cube

【教學】入門篇 PV3D 創建基本模型 PaperPlane

【教學】入門篇 PV3D 創建基本模型 Sphere

【教學】入門篇 PV3D 創建基本模型 Cylinder

【教學】入門篇 PV3D 創建基本模型 Arrow

【教學】入門篇 PV3D 創建基本模型 Cone

【教學】入門篇 PV3D創建基本模型 Plane

ActionScript3 鍵盤控制

用程式碼做動畫

【教學】PV3D 投影(Project)視圖(Viewport)

【教學】PV3D 攝影機(Camera)

【教學】入門篇 PV3D 基本框架建置(一)

PV3D 格鬥遊戲3D碰撞測試

ActionScript 3.0 官方說明文件

ActionScript 3.0 錯誤訊息對照表

BulkLoader 下載類別

PV3D 官方說明文件

【教學】入門篇 PV3D 基本框架建置(二)

PV3D 滑鼠操控角色 + 鏡頭切換

PV3D應用DAE模型格式避免破面的幾種方法

PV3D & Plane選單應用範例(三)

PV3D & Plane選單應用範例(二)

PV3D & Plane選單應用範例(一)

PV3D 在3D物體表面上畫圖

【教學】Director 中使用Lingo 3D創建基本分子模型

【教學】Director 中使用Lingo 3D創建基本柱體模型

【教學】Director 中使用Lingo 3D創建基本球體模型

【教學】Director 中使用Lingo 3D創建基本方體模型

【教學】Director 中使用Lingo 3D創建基本平面模型

學習3D程式的經驗

PV3D & Jiglib 物理引擎範例

【作品】極光效果測試