2012年7月25日 星期三

JiglibFlash 3D 物理引擊

JiglibFlash 是一個3D 物理引擊, 是國外高手參照C++ 編寫成ActionScript 3.0. 在我們使用Away3D 渲染(Redernering) 模型時候, 可以配合JiglibFlash 計算物理現象, 產生互動效果.



雖然JiglibFlash 3D 物理引擊效能比不上AwayPhysics, 但基本功能齊全, 運算不會進行域內存操作, 無需考慮高級功能許可證 (Premium Features License) 問題. 若不是要求極高效能,  這是我們其中的一個好選擇.

大家可以到官方網頁下載最新範例試試.

2012年7月24日 星期二

Away3d 與 AwayPhysics

AwayPhysics 是一個高效能的3D 物理引擊. 我們可以配合Away3d 製作出色的遊戲和軟件, 透過Adobe AIR 發佈於多數電腦或移動裝置 (Android / iOS) 中運行.

請按 [觀看] 範例

由於AwayPhysics 是一個由Alchemy 編譯成的SWC 元件, 它可能利用ApplicationDomain.domainMemory 進行域內存操作, 使其運作效能大大提升. 若配合Away3d 一同使用, 我們必須考慮Adobe 較早前宣布的高級功能許可證 (Premium Features License), 這個限制為開發人員帶來一點麻煩.

作者把官方範例改為以Away3d 4.0 Gold 版本, 大家可以 [下載] 範例試試看.

2012年7月23日 星期一

[教學] Away3D 4.0 Gold 基礎模型載入

為大家介紹Away3D 4.0 Gold 載入.3ds 檔, 然後手動貼上紋理(Texture) 於模型:

請按 [觀看] 範例

當主程式進入ADDED_TO_STAGE 狀態, 我們會設定以下步驟:
  • 設定View3D 與Camera3D:
    private function setUpView():void
    {
      // <----- define variable
      _view = new View3D();
      
      // <----- set View3d
      _view.width = width;
      _view.height = height;
      _view.backgroundColor = 0xffffff;
      _view.antiAlias = 16; //抗鋸齒有效設值為 0,2,4和16
      
      // <----- set camera
      _view.camera.position = new Vector3D( 0, 1400, -1000);
      _view.camera.lookAt(new Vector3D(0, 400, 0));
      _view.camera.lens.near = 0.2;
      (_view.camera.lens as PerspectiveLens).fieldOfView = 60;
      
      // <----- add object
      addChild(_view);
      addChild(new AwayStats(_view));
    }
    

  • 設定光源:
    private function setUpLights():void
    {
      var light1:DirectionalLight = new DirectionalLight(0,-2,1);
      var light2:DirectionalLight = new DirectionalLight(0,2,-2);
      _lightPicker = new StaticLightPicker([light1, light2]);
      _view.scene.addChild(light1);
      _view.scene.addChild(light2);
    }
    

  • 載入.3ds 檔, 並關閉自動貼Texture 功能 new AssetLoaderContext(false):
    private function initMesh():void
    {
      Loader3D.enableParser(Max3DSParser);
      _loader = new Loader3D();
      _loader.addEventListener(AssetEvent.MESH_COMPLETE, meshCompleteHandler);
      _loader.loadData(MyMesh, new AssetLoaderContext(false), null, new Max3DSParser());
      _loader.scale(1);
      _view.scene.addChild(_loader);
    }
    

  • 最後, Mesh 完成載入時, 手動貼上Texture 於每一個Mesh 上:
    private function meshCompleteHandler(event:AssetEvent):void{
      // <----- define materials
      var m1:TextureMaterial = new TextureMaterial(Cast.bitmapTexture(Skin01Texture));
      var m2:TextureMaterial = new TextureMaterial(Cast.bitmapTexture(Skin02Texture));
      
      // <----- set materials
      m1.specular = 0.4;
      m1.lightPicker = _lightPicker;
      m2.specular = 0.9;
      m2.lightPicker = _lightPicker;
      
      // <----- apply materials to mesh
      for (var i:int = 0; i < _loader.numChildren; i++){
        var mesh:Mesh = Mesh(_loader.getChildAt(i));
        if(mesh.name.indexOf("polySurfac")>-1)
          mesh.material = m1;
        else
          mesh.material = m2;
      }
    }
    

播放時, Stage3D 會因應系統自動選擇DirectX, OpenGL 和Software 作為硬體加速模式. 我們製作和顯示模型時, 應考慮多數用戶的硬體效能, 選擇合適設定, 為用戶達至最佳顯示效果.
大家可以 [下載] 範例試試看.

2012年7月20日 星期五

[教學] AIRKinect 2.0 安裝

最近AIRKinect 發佈的2.0 版本. 我們有以下兩種方式啟動:

AIRKinect 與 OpenNI 安裝:

_選擇安裝OpenNI, 過程較為複雜, 需要順序安裝以下驅動程序 (Device driver):
  1. OpenNI Installer
  2. NITE Installer
  3. Sensor Installer (Driver for Primesense Devices: Asus Xtion Pro,etc.)
  4. Kinect Installer (Driver for Kinect)
另外, 安裝必須合以下條件:
  1. 使用Windows 7 32-bit 版本
  2. 驅動程序發佈版本(Version) 必須一致
  3. 不能安裝Kinect for Windows SDK
我們在Google Code 上找尋simple-openni, 它會提供版本一致的傻瓜包 [下載] .

AIRKinect 與Kinect for Windows SDK 安裝:

_選擇安裝Kinect for Windows SDK 過程較為簡單, 大家在Microsoft [下載] 最新的SDK 便可以.

3D Character Demo
Basic Demo
若沒有特別需要, 作者建議選擇Kinect for Windows SDK 作為驅動程序.
安裝完成後, 大家可以下載AIRKinect Examples 來玩玩喔.

注意事項:
  • 在ActionScript Build Packaging 與ActionScript Build Path 設定正確的ANE 檔案:
       OpenNI - 請使用
    airkinect-2-core-openni.ane
       Kinect for Windows SDK - 請使用airkinect-2-core-mssdk.ane
  • Kinect 對電腦的USB 選擇嚴格, 不要使用USB HUB 或機箱前方的USB 接口

API 參考資料: http://as3nui.github.com/AIRKinect/docs/AIRKinect/

2012年7月18日 星期三

Away3D 4.0.7 Gold 版本

最新發佈的Away3D 4.0.7 Gold 版本, 包括一些全新的範例給開發者下載參考.





下載範例後, 我們在Flash Builder 作出以下設定, 便可運作:
  1. 建立ActionScript Project:

  2. 把下載的範例和away3d-core-fp11_4_0_7_gold.swc 複製至Project 中:

  3. PropertiesActionScript Build Path 設定swc 路徑:

  4. 在Main-app.xml 設定 <renderMode>direct</renderMode> :

  5. 最後, 把Main 繼承(extends) 相關的範例:
    package
    {
      import flash.display.Sprite;
      import flash.events.Event;
      
      [SWF(backgroundColor="#000000", frameRate="30", quality="LOW", width="1024", height="768")]
      //public  class Main extends Advanced_ShallowWaterDemo
      //public class Main extends Intermediate_CharacterAnimation
      //public class Main extends Intermediate_Globe
      //public class Main extends Intermediate_Head
      //public class Main extends Intermediate_MD5Animation
      //public class Main extends Intermediate_MouseInteraction
      //public class Main extends Basic_View
      //public class Main extends Basic_Tweening3D
      //public class Main extends Basic_SkyBox
      //public class Main extends Basic_Shading
      public class Main extends Basic_LoadMD2
      //public class Main extends Basic_Load3DS
      //public class Main extends Advanced_FractalTreeDemo
      {
        public function Main()
        {
          super();
        }
      }
    }
    
大家可以下載玩玩, 一些範例效果不錯喔.
若發佈至電話中運作, 設定與以上方法相似, 但某些範運作會出現錯誤.

API 參考資料: http://away3d.com/livedocs/away3d/4.0/

2012年7月17日 星期二

Flash Daily 網頁介紹

Flash Daily 的作者, 收集不少關於Flash 示範, 內容十分豐富. 我們可以發現不少驚訝作品:

Hello Racer

+360º - Car Visualizer

Neema
還有許多Augmented Reality (AR), Kinect, 3D Engine... 等示範喔.

FLARToolKit 的AR Marker

日本研發Augmented Reality(AR) 引擊FLARToolKit, 能讀取紙張上的Marker 圖案, 在相對的位置顯示3D 模型.

我們可以到官方網頁下載 version 4.x進行測試. 這個版本支援Away3D 的 4.x 版本, 3D 模型利用Stage3D 以硬件加速顯示.

另外, 由於Stage3D 是底層繪圖引擎, 任何物件會在Stage3D 上覆蓋, 所以Web Camera 部分, 我們暫時只有兩種手法完成:

  • 在3D 引擎以背景(Background) 形式貼上, 這是FLARToolKit 範例使用的手法:
    view3d.background = new FLARWebCamTexture(captureWidth, captureHeight);
    

  • 或使用StageVideo, 由於StageVideo 比Stage3D 更為底一層, 會在3D 引擎後方顯示. 
作者在電話測試, 發現沒有在電腦運行的順暢, 相信還需要一點時間改良喔.