首頁 > ActionScript, FLEX, 程式設計, 網頁設計 > FLEX with PV3D , DAE model 玩轉茶壺

FLEX with PV3D , DAE model 玩轉茶壺

2009年4月6日  瀏覽次數 : 8,528

今天有朋友留言問到,如何在 FLEX 使用 PV3D 的 3D 物件,雖然是不難,但是也不是三言兩語可以在回覆間道盡,所以特地發了一篇在 FLEX 中使用 PV3D 建立 DAE 的 3D 物件,因為只是練習,所以我就不拿太難的物件了,隨手拿了朋友的茶壺來試試看,不知道這個茶壺夠不夠力。

image 圖 : 科..科..不知道你的茶壺夠不夠力~

其實要在 PV3D 裡面用 3D 物件可以用 3DS MAX 或是 MAYA 來製作,但是奶綠老師有說,要使用低面素的 3D 模型來做,不然會造成 CPU 的 LOADING 太高,我測試大概 20 個茶壺就跑不動囉。

至於 DAE 是類似一種 XML 語言的模型,他是記錄許多點與線段的組合,還可以加上 PNG 圖片的貼圖,PV3D 還可以直接呼叫 DAE 的物件播放動畫,這部分網路上都可以找到資料。

今天就來簡單玩一下茶壺吧。

 

原始碼 :

Teapot.as

?View Code ACTIONSCRIPT
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
package
{
	import flash.display.Sprite;
	import flash.events.Event;
 
	import org.papervision3d.objects.parsers.Collada;
	import org.papervision3d.view.BasicView;
 
	public class Teapot extends Sprite
	{
		private var view:BasicView;
		//private var collada:Collada;
		public function Teapot()
		{
			this.init3DEngine();
			this.init3DObject();
 
		}
		private function init3DEngine():void{
			view = new BasicView(0, 0, true, true, "Target");
			this.addChild(view);
			this.addEventListener(Event.ENTER_FRAME, onEventRender3D);
		}
		private function init3DObject():void{
			//this.collada = new Collada("teapot.dae");
			//this.collada.scale = 0.1;
			//view.scene.addChild(this.collada);
		}
		private function onEventRender3D(event:Event):void{
 
			this.view.singleRender();
		}
 
		public function addTeapot():void{
			this.view.scene.removeChildByName("teapot");
			var collada:Collada = new Collada("teapot.dae");
			collada.scale = 0.1;
			collada.name = "teapot";
			collada.x = Math.random() * 400 - 200;
			collada.y = Math.random() * 400 - 200;
			collada.z = Math.random() * 400 - 200;
			collada.rotationX = Math.random() * 360 ;
			collada.rotationY = Math.random() * 360 ;
			collada.rotationZ = Math.random() * 360 ;
 
			this.view.scene.addChild(collada);
		}
	}
}

DAEonFLEX.mxml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" fontSize="14" creationComplete="init()" frameRate="41">
	<mx:Script>
		<![CDATA[
 
			private var teapot:Teapot = new Teapot();
 
			private function init():void{
				this.PV3DArea.addChild(this.teapot);
			}
		]]>
	</mx:Script>
	<mx:Canvas width="90%" height="80%" backgroundColor="white">
		<mx:UIComponent id="PV3DArea" width="100%" height="100%"/>
	</mx:Canvas>
	<mx:ApplicationControlBar>
		<mx:Button label="玩轉茶壺" click="this.teapot.addTeapot()"/>
	</mx:ApplicationControlBar>
 
</mx:Application>

Random Posts

Loading…

:: 把這篇好文推到書籤網站與更多人分享吧 ::
  • funp
  • Hemidemi
  • YahooKimo
  • Google
  • udn
  • Haohao
  • Live

相關文章 :

Ausir ActionScript, FLEX, 程式設計, 網頁設計 , , ,

  1. 2009年4月6日23:36 | #1

    範例請用開新視窗開啟
    因為 DAE 檔案讀取較慢
    按下按鈕後 請稍等一下才可以繼續按

  2. 2009年4月7日08:11 | #2

    這是Flex版的pv3D嗎>
    是宋老說的那一套嗎?

  3. 2009年4月7日09:19 | #3

    @梅干扣肉

    不是內~

    這個就是在 FLEX 內使用 PV3D 的功能而以說
    上次看奶綠的部落格~好像 PV3D 的效能目前比 ADOBE 的好

  4. forgot
    2009年4月7日11:23 | #4

    我直接copy程式碼 然後把我的3d物件(以輸出成dae)直接改名為teapot
    然後把它跟我的mxml放再同一個資料夾
    可是…RUN的時候並沒有物件初來 我少做了哪依步驟了嗎??

  5. 2009年4月7日11:26 | #5

    @forgot

    所以你已經把你的 xxx.dae 改成 teapot.dae 並且放在同一個資料夾了嘛~

    那 FLEX 的程式有跳出錯誤訊息嗎?~
    或是你可以把你的 DAE 丟出來 我 LOAD 看看

  6. forgot
    2009年4月7日13:51 | #6

    是低
    沒有跳出任何錯誤訊息..他是空白的畫面
    囧rz!!! 連BUTTON也沒有出現
    我在想會不是會是我沒有PATH的關係
    我的方法是加入Library path > add swc >
    加入Papervision3D_rev859.swc
    (從http://code.google.com/p/papervision3d/ 抓的)

  7. 2009年4月7日14:36 | #7

    我是使用 Papervision3D_2.0.883.swc 這個 SWC
    不過覺得跟版本沒啥關係
    不過你連按鈕都沒出現
    可能連 FLEX 都有問題吧 @@” 好歹 BUTTON 也要出現阿
    用 DEBUG 模式看看有沒有錯誤訊息吧

  8. forgot
    2009年4月7日15:01 | #8

    果然有錯誤

    Main Thread (Suspended: VerifyError: Error #1053: 不合法覆寫 org.papervision3d.core.geom.TriangleMesh3D 中的 material。)

  9. 2009年4月7日15:08 | #9

    @forgot

    這個你要檢查一下你的錯誤在哪裡耶~@@
    光光這樣我可能沒辦法幫你呢~^^

  10. forgot
    2009年4月7日15:11 | #10

    這是內容 我正在努力看懂中

    ?View Code ACTIONSCRIPT
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    
    VerifyError: Error #1053: 不合法覆寫 org.papervision3d.core.geom.TriangleMesh3D 中的 material。
     
    	at flash.display::MovieClip/nextFrame()
    	at mx.managers::SystemManager/deferredNextFrame()    [C:\autobuild\3.2.0frameworks\projects\framework\src\mx\managers\SystemManager.as:319]
    	at mx.managers::SystemManager/preloader_initProgressHandler()[C:\autobuild\3.2.0frameworks\projects\framework\src\mx\managers\SystemManager.as:2945]
    	at flash.events::EventDispatcher/dispatchEventFunction()
    	at flash.events::EventDispatcher/dispatchEvent()
    	at mx.preloaders::Preloader/timerHandler()[C:\autobuild\3.2.0\frameworks\projects\framework\src\mx\preloaders\Preloader.as:398]
    	at flash.utils::Timer/_timerDispatch()
    	at flash.utils::Timer/tick()
  11. 2009年4月7日15:45 | #11

    @forgot
    我在做錯誤碼追蹤比較弱一點 >”<~

    不過你已經可以在 FLEX 內正確的使用 PV3D 了嗎?
    可以不用一開始就使用 DAE 建模來練習 @@”

  12. forgot
    2009年4月7日15:51 | #12

    嗯嗯
    我好像跳太快了
    我還沒有在FLEX內正確的使用PV3D

  13. 2009年4月7日15:52 | #13

    你可以先參考這篇
    http://blog.corausir.org/programing/ausir-884

    先把 plane 正確的建立在 FLEX 裡面喔

  14. forgot
    2009年4月7日16:14 | #14

    我要瘋了
    完全一樣的問題
    錯誤碼都一模一樣
    正在努力除錯中

  15. forgot
    2009年4月7日16:16 | #15

    我懷疑是我的source path錯了

  16. 2009年4月7日16:16 | #16

    錯誤碼的意思是說 複寫到 material 這個值~
    你檢查看看 用 DEBUG 模是看你是哪一行跳錯

  17. 2009年4月7日16:16 | #17

    forgot :

    我懷疑是我的source path錯了

    可以試試看用別版的 SWC

  18. forgot
    2009年4月7日17:21 | #18

    我用了別版的SWC可以運作了 真神奇
    然後
    http://blog.corausir.org/programing/ausir-884
    做出來了
    現在是DAE出不來
    請問可以把您的teapot.dae給我嗎
    我想測試看看

  19. 2009年4月7日17:23 | #19

    嗯~
    請下載
    http://files.corausir.org/swf/teapot.dae

    按右鍵另存吧

  20. forgot
    2009年4月7日17:23 | #20

    阿阿阿 出來了
    只是他LAG
    大師在上 受小弟好幾拜

  21. 2009年4月7日17:25 | #21

    @forgot

    過獎了 @@”

    我只是分享一些經驗罷了~
    如果可以幫上一點小忙我也蠻開心了 ^^”

  22. hi小飛俠
    2009年4月8日17:34 | #22

    對於一個山頂洞人時代的 廣告文字者 而言,
    以上,
    根本就是 外星文…
    不過,很喜歡!
    請教,目前市場上架一個網站,
    費用普遍怎麼計算?!
    PS.我們自己會把畫面做好喔,
    只是不會動…
    要有動畫要有購物車的 那種,
    請美麗的您
    多多幫忙回答囉

  23. 2009年4月8日17:43 | #23

    @hi小飛俠

    HI ^^ 市場上的價格很亂~
    有的靠美術設計拉高價格
    有的靠程式設計拉高價格

    所以要詳細談過內容才可以算出真正的價格
    如果你有需要的話可以談談看喔~

  24. 2009年4月15日16:20 | #24

    您好~

    不知道你是否對PaperVision3D熟練呢?.
    做出類似這種效果
    http://kiroukou.media-box.net/demos/sandy/mrdoob/index.html

    因為數學展示有需要,要展示可以720度控制旋轉的多方體、方椎或圓柱體。
    但是不用上面這樣複雜,就是簡單的立方體控制就可以了

    不知道你是否有在接這一方面的案子呢?
    如果你有時間也願意的話,請mail到我的信箱詳談
    //信箱我刪掉了 避免你被攻擊

    謝謝你 ^_^~

    阿默

  25. 2009年4月15日18:22 | #25

    阿默已連絡上

  26. 2009年4月19日16:56 | #26

    嗨 您好
    這剛好就是我所需要的啦
    另外再問
    有沒有可能去利用鍵盤去控制茶壺的行走路徑呢
    因為我照您的方法 利用3D去見了一台車子 然後放到FLEX中
    現在想要用見排去控制它的行走方向

    可以給我個方向或範例嗎
    謝謝

  27. 2009年4月19日16:57 | #27

    @樂

    可以阿~ 你可以用鍵盤去控制旋轉角度
    以及前進後退阿~

    範例喔~~
    我在找找在貼上來哦~

  28. 2009年4月19日17:06 | #28

    挖 你回的好快喔
    我也正在找尋範例當中
    謝謝你囉

  29. 2009年4月19日17:09 | #29

    @樂

    剛好在線上處理東西
    你可以參考這篇
    國外範例
    控制 DAE 的

    不過我想你應該沒用到那麼難

    其實你只要偵聽鍵盤
    然後移動物件的 X Y Z 跟 旋轉及可

    這篇是播放 DAE 動畫的

  30. 2009年4月19日17:33 | #30

    他這個好像是利用actionscript project做出來的吧?
    我使用的方法是跟你一樣
    在flex中去呼叫actionscript 這方法是相通的嗎

    不好意思 因為我是初學者 所以問一些很蠢的問題請不要見怪

  31. 2009年4月20日00:08 | #31

    試了好久 都無法運作 我直接用您的範例去改的
    想利用鍵盤來讓茶壺移動
    可是都一直失敗><
    看來我的功力還是不夠到家阿

  32. 2009年4月20日08:15 | #32

    @樂

    這樣子喔~
    如果有時間的話
    我可以放個簡單的範例上來 ^^

  33. 东方之蜘蛛
    2009年5月21日16:41 | #33

    代碼完全和你的一樣,茶壺就是出不來,不知為何??
    錯誤行:var collada:Collada = new Collada(”teapot.dae”);
    提示:COLLADA file load error

  34. 2009年5月21日17:02 | #34

    @@ 只有這樣子我也不太清楚為甚麼

    不過或許是 PV3D 的版本不同有可能造成 COLLADA 的問題

    應該不會出現 DAE 的問題說

  35. CRI
    2010年2月24日16:20 | #35

    不好意思
    如果想要做一個像你牛的那樣範例
    用的是Maya去做
    大概的方式要怎麼去做呢!?
    會輸出.dae檔 不過不會做3D圖

  36. 2010年2月24日20:37 | #36

    @CRI

    用 MAYA 或是 3DS 應該都可以製作
    但是你要先安裝一個 DAE 外掛
    他就可以把模型轉出為 DAE 檔案囉

  1. 本篇文章目前尚無任何 trackbacks 和 pingbacks。