返回 导航

Flex

hangge.com

Away3D - 在Flex中加载嵌入Away3D Sprite

作者:hangge | 2015-12-10 08:32
通常我们通过继承 Sprite,在起内部使用 ActionScript 来进行 Away3D 的三维创作。但有时我们需要把做好的 3d Sprite 嵌入到 Flex 页面中,那么可以进行如下操作。

1,Flex加载Away3D的Sprite方法与注意事项:
(1)Flex 版本要使用4。
(2)先在 Flex 页面中先添加个 UIComponent,再把 3D Sprite 的实例对象放到这个 UIComponent 里。
(3)Flex 页面的背景色设为透明(backgroundAlpha="0")。否则加载进来也是显示一片空白。
(4)Flex 默认的帧率24帧/秒。如果和制作的 Away3D Sprite 帧率不一致的话,会造成显示效果的差异。Flex这边可以修改 MXML 页面的 frameRate 属性使其一致。

2,比如下面是一个3D Sprite(MyAway3DSprite.as)
效果很简单,只是添加了个坐标轴。
package{
	import flash.display.Sprite;
	import flash.display.StageAlign;
	import flash.display.StageScaleMode;
	import flash.events.Event;
	
	import away3d.containers.View3D;
	import away3d.debug.Trident;

	[SWF( frameRate="60", backgroundColor="#FFFFFF")]
	public class MyAway3DSprite extends Sprite {
				
		private  var _view3D:View3D;
		
		public function MyAway3DSprite() {
			addEventListener(Event.ADDED_TO_STAGE, init);
		}
		
		private function init(e:Event):void{
			stage.scaleMode = StageScaleMode.NO_SCALE;
			stage.align = StageAlign.TOP_LEFT;
			
			// 创建一个视口
			_view3D = new View3D();
			addChild(_view3D);
			
			//添加 坐标系.
			var trident:Trident = new Trident(150);
			_view3D.scene.addChild(trident);
			
			addEventListener(Event.ENTER_FRAME, _onEnterFrame);
		}
		
		/**
		 * 渲染视图
		 */
		private function _onEnterFrame(e:Event):void
		{
			_view3D.render();
		}
	}
}

3,Flex中的页面代码如下:
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			   xmlns:mx="library://ns.adobe.com/flex/mx"
			   backgroundAlpha="0" frameRate="60"
			   creationComplete="init(event)" >
	<fx:Script>
		<![CDATA[
			import mx.events.FlexEvent;
			
			protected function init(event:FlexEvent):void
			{
				var main:MyAway3DSprite = new MyAway3DSprite();
				container.addChild(main);
			}
			
		]]>
	</fx:Script>
	<mx:UIComponent id="container" width="100%" height="100%"></mx:UIComponent>
</s:Application>
评论

全部评论(0)

回到顶部