Max の 3D Studio

【教學】Away3D 運用MD2模型

2012-05-14T08:36:00.000-07:00

透過Away3D 4.0 可以很容易的使用MD2模型格式，
此範例可以使用滑鼠移動camera來觀察模型，
鍵盤數字1至5鍵可以切換不同動作。

【教學】IOS 建立OpenGL ES 2.0 3D基本環境

2012-05-03T08:02:00.000-07:00

IOS 建立3D基本環境步驟:

1.新開一個專案
   雖然有"OpenGL ES Application"這個現成框架，
   但此範例是使用手動自行創建3D基本環境，
   較預設的OpenGL ES的 3D框架精簡許多，
   所以這裡選擇"window-based Application"，
   再手動增加3D環境。

2.增加Frameworks連結
OpenGLES.framework
QuartzCore.framework

3.手動增加一個自訂的UIView
OPGLView.h
OPGLView.m

4.基本的三維環境寫在這個OPGLView
OPGLView.h

#import <uikit/uikit.h>
#import <QuartzCore/QuartzCore.h> 
#import <OpenGLES/ES2/gl.h>
#import <OpenGLES/ES2/glext.h>

@interface OPGLView:UIView
{
    GLuint viewRenderBuffer;
    GLuint viewFrameBuffer;

    CAEAGLLayer *eaglLayer;
    EAGLContext *context;
}

@end

OPGLView.m

#import "OPGLView.h"

@implementation OPGLView

+(Class)layerClass
{
    return [CAEAGLLayer class];
}

-(void)setuplayer
{
    eaglLayer = (CAEAGLLayer *) self.layer;
    eaglLayer.opaque = YES;
}

-(void)setupContext
{
    EAGLRenderingAPI eaglAPI = kEAGLRenderingAPIOpenGLES2;
    context = [[EAGLContext alloc] initWithAPI:eaglAPI];
    if(!context)
    {
        exit(1);
    }
    if(![EAGLContext setCurrentContext:context])
    {
        exit(1);
    }
}

-(void)setupRenderBuffer
{
    glGenRenderbuffers(1,&viewRenderBuffer);
    glBindRenderbuffer(GL_RENDERBUFFER, viewRenderBuffer);
    [context renderbufferStorage:GL_RENDERBUFFER fromFrawable:eaglLayer];
}

-(void)setupFrameBuffer
{
    glGenFramebuffers(1,&viewFrameBuffer);
    glBindFramebuffer(GL_FRAMEBUFFER, viewFrameBuffer);
    glFramebufferRenderbuffer(GL_FRAMEBUFFER, 
                              GL_COLOR_ATTACHMENT0,
                              GL_RENDERBUFFER,
                              viewRenderBuffer);
}

-(void)setupDisplayLink
{
    CADisplayLink *displayLink = [CADisplayLink displayLinkWithTarget:self
                                  selector:@selector(render:)];
    [displayLink addToRunLoop:[NSRunLoop currentRunLoop] 
                               forMode:NSDefaultRunLoopMode];
}

-(void)render:(CADisplayLink *)displayLink
{
    glClearColor( 100.0f/255.0f,
                  100.0f/255.0f,
                  100.0f/255.0f,
                  1.0f);
    glClear(GL_COLOR_BUFFER_BIT);

    [context presentRenderbuffer:GL_RENDERBUFFER];
}

-(id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if(self)
    {
        [self setupLayer];
        [self setupContext];
        [self setupRenderBuffer];
        [self setupFrameBuffer];
        [self setupDisplayLink];
    }
    return self;
}

-(void)dealloc
{
   [context release];
   context = nil;
    
   [super dealloc];
}
  
@end

5.將OPGLView加入OPGLSampleAppDelegate中
OPGLSampleAppDelegate.h

#import "OPGLView.h"
  
@interface OPGLSampleAppDelegate:NSObject
{
    OPGLView *mOPGLView;
}
@property (nonatomic, retain) IBOutlet UIWindow *window;

@end

OPGLSampleAppDelegate.m

-(BOOL)application:(UIApplication *)application 
    didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
    CGRect screenBounds = [[UIScreen mainScreen] bounds];    
    mOPGLView = [[[OPGLView alloc] initWithFrame:screenBounds] autorelease];
    [self.window addSubview:mOPGLView];
    
    // Override point for customization after application launch.
    [self.window makeKeyAndVisible];
    return YES;
}
....

執行結果:

【教學】Flash3D (Proscenium) 運用SkyBox模擬720度全景(Panorama)效果

2012-04-28T09:51:00.000-07:00

透過Proscenium這個3D Framework可以很容易的使用skybox，
只須將(Panorama)全景圖區分為前後上下左右六張圖，
指定給SceneSkyBox就行了。

package 
{
    import com.adobe.scenegraph.BasicScene;
    import com.adobe.scenegraph.SceneSkyBox;
    import com.adobe.utils.LoadTracker;
    import flash.display3D.Context3DRenderMode;
    import flash.utils.Dictionary;
    import flash.display.BitmapData;
    import flash.geom.Vector3D;
 
    /**
     * Panorama Demo
     * @author Max
     */
    public class Flash3D_Proscenium_SkyBox extends BasicScene 
    { 
        protected static const IMAGE_FILENAMES:Vector = 
        new ["../res/images/right.png", 
                     "../res/images/left.png",
                     "../res/images/top.png", 
                     "../res/images/bottom.png", 
                     "../res/images/front.png", 
                     "../res/images/back.png"];
   
        private var skybox:SceneSkyBox; 
        protected static const CAMERA_ORIGIN:Vector3D = new Vector3D( 0, 0, 20 );
        protected static const ORIGIN:Vector3D = new Vector3D();
  
        public function Flash3D_Proscenium_SkyBox(renderMode:String = Context3DRenderMode.AUTO)
        {
            super(renderMode);
        }
  
        override protected function initModels():void 
        {
            super.initModels();
            LoadTracker.loadImages(IMAGE_FILENAMES, imageLoadComplete);
        }
  
        protected function imageLoadComplete(bitmaps:Dictionary):void
        {
            var i:uint;               
            var bitmapDatas:Vector. = new Vector.(6, true);                 
            for (i = 0; i < 6; i++)
            {                       
                bitmapDatas[i] = bitmaps[IMAGE_FILENAMES[i]].bitmapData;
            }
   
            skybox = new SceneSkyBox(bitmapDatas, false);
            scene.addChild(skybox);
            skybox.name = "Sky";  
        }
  
        override protected function resetCamera():void
        {
            _camera = scene.activeCamera;
            _camera.identity();
            _camera.position = CAMERA_ORIGIN;
            _camera.appendRotation( -15, Vector3D.X_AXIS );
            _camera.appendRotation( -25, Vector3D.Y_AXIS, ORIGIN );
        } 
    } 
}

執行結果:

demo

【測試】使用FlashDevelop開發Flash3D (Proscenium)

2012-02-25T18:50:00.007-08:00

Proscenium是Adobee官方自家推出的3D Framework，
支持GPU加速，必須要在FlashPlayer 11上運行。
目前官方已有許多範例，針對這些範例做了一些測試。

我使用的開發工具是FlashDevelop，(官方是用FlashBuilder)。
以下便是FlashDevelop開發Proscenium的步驟：
Step1:
(1) 下載安裝FlashDevelop
     http://www.flashdevelop.org/

(2) 下載FlexSDK
     http://opensource.adobe.com/wiki/display/flexsdk/Download+Flex+4.5

(3) 下載FlashPlayer11.1
     http://www.adobe.com/support/flashplayer/downloads.html

(4) 下載PlayerGlobal.swc
     http://www.adobe.com/support/flashplayer/downloads.html

(5) 下載proscenium_p1_100311.zip
     http://labs.adobe.com/technologies/proscenium/

Step2:
(1) 將剛剛下載的Flex SDK解壓縮至指定路徑(自訂)

(2) 將下載的playerglobal.swc檔放至Flex SDK目錄下的frameworks\libs\player\11.0內

(3) 將下載的FlashPlayer檔放至FlashDevelop目錄下的Tools\flexsdk\runtimes\player\11.0內

(4) 開啟FlashDevelop後，於上方選取Tools->;ProgramSetting->;AS3Context，找到"Installed Flex SDKs"項目，點擊右方按鈕添加我們的Flex SDK。

(5) 於上方選取Tools->ProgramSetting->FlashViewer，"external Player path"選取剛剛放到FlashDevelop目錄下的FlashPlayer。

Step3:
(1) 於FD上方選取Project->new project->AS3 Project，

(2) 將proscenium_p1_100311.zip解壓縮至指定路徑(自訂)

(3) 把proscenium解壓後的libs目錄內的Proscenium.swc跟Pellet.swc兩個檔，放到FD所開啟的AS3 Project專案目錄下的lib資料夾內。

(4) 把proscenium解壓後的code\ProsceniumSamples下的src、res目錄都放到FD所開啟的AS3 Project專案目錄下。

(5) 將lib中的兩個SWC添加到專案中（右鍵Add To Library）

(6) 在專案打開Properties視窗，將Output中的Platform中的FlashPlayer改成11.0

(7) Properties視窗，將CompilerOptions中Additional Compiler Options加入-swf-version=13

(8) 在src下逐個把.as文件set Document Class，然後按下Ctrl+Entere觀看結果；

demo

【測試】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