flex/flash 3d基础1

新的flex/flash给了3D一个很好的展示平台，下面就让我们走进flash3d世界
[b]【贝武易科技专业flex3D开发--www.newflash3d.com】[/b]
十分感谢kirupa.com的贡献。
下面我们进入flex，新建一个项目Zooming Figures如下：

[img]/upload/attachment/54419/e8713c4a-222a-3b62-9c6a-3f1b71d814ae.jpg[/img]
选择项目根目录，单击右键选属性，导入一个SWC文件，这个文件为我们从flash cs3输出来库文件，具体的输出方法见[url]http://bvu.iteye.com/blog/283173[/url]

[img]/upload/attachment/54432/92a2eae6-c28b-3ddf-9e5d-a7755d0376fb.jpg[/img]
导入Figure.swc。（我们在下面提供了该文件）
导入界面

[img]/upload/attachment/54435/24fdc371-6881-31f3-8ef9-d0b28117a129.jpg[/img]
导入完毕后，关键的一部是要在flex中使用它，把主程序改为

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:local="*" layout="absolute">
<local:figure/>
</mx:Application>

我们分析一下代码
xmlns:local="*"，告诉程序一个新的组见空间，local是新的组件空间名，*表示应用这个组件空间里的所有组件，我们在--flex组件样式演示--里有专门的介绍，这里就不细说了。
<local:figure/> 生成一个组件，我们可以看到场景中多出了一个人物角色的图，他就是我们的figure组件了。

[img]/upload/attachment/54437/9662173d-1342-3054-89ca-b0eac6490952.jpg[/img]
上面我们成功的导入了一个swf来作为flex的应用，但是上面的方法导入的swf，我们发现有一个问题是在应用它的scaleX、scaleY的时候不起作用。
所以我们利用另外一种方法导入，使用SWFLoader组件，这个组件很好的控制和利用了swf的属性，同时可以控制导入的swf作为一个MovieClip，控制它的播放和暂定等。
所以，利用SWFLoader组件作为导入完整的代码如下：

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" applicationComplete="init();">
<mx:Canvas width="300" height="300">
	<mx:SWFLoader id="swfload" source="assets/Figure.swf"/>
</mx:Canvas>
<mx:Script>
	<![CDATA[
	    private var FigureA:MovieClip;  
		private function init():void{    
		    FigureA = swfload.content as MovieClip;
		    addEventListener(Event.ENTER_FRAME, aa);
		}
		private function aa(evt:Event):void {
			text1.text = String(FigureA.x);
		}

	]]>
</mx:Script>
<mx:Text id="text1"/>
</mx:Application>

简单的解析：
我们通过mx:SWFLoader把Figure.swf导进去。
把SWFLoader放到一个Canvas里去，代码如下：
<mx:Canvas width="300" height="300">
<mx:SWFLoader id="swfload" source="assets/Figure.swf"/>
</mx:Canvas>
<mx:Text id="text1"/>是加入一个辅助显示的文字组件；
好，准备元素准备好了，下面我们就进入三维的世界！！
因为flex\flash它们只是一个二维的平面显示(X,Y)，我们需要模拟出一个Z轴出来，我们这样定义，以你作为参考，你的显示屏幕的平面为0平面，也就是Z轴为零，所有的图像都投影到这个平面来显示出来，远离你而去的方向为Z轴的正方向，冲着你来的方向为Z轴的负方向。
[b]三维里的基本概念：[/b]
供投影显示的平面（这里是我们的flex显示屏幕）；
焦距；
Z轴；
当然，这所有的元素都是虚的概念，需要我们去在空间想像的去构建。
焦距：FocalLength = 300;
在flex里的代码为

private var FocalLength:Number;
FocalLength=300;

默认的情况下我们的flex舞台的坐标为X、Y，如下图

[img]/upload/attachment/54599/dd0b001b-820f-3432-ba8e-da79f905b299.jpg[/img]
我们虚拟出一个Z轴来，如图

[img]/upload/attachment/54601/05033d05-f41c-3acb-a483-6944b96932da.jpg[/img]
看下面的关系图：

[img]/upload/attachment/54603/50601be6-2cc8-38ef-b935-55b81d7a8d88.jpg[/img]
从这个图我们可以看出，物体（红色箭头）如果沿着Z轴平行移动，在观察点看来，它投影到显示屏幕上的显示物体（小的红色箭头）他们始终是有这么一种关系：（注：“：”是比的意思）
[b]物体投影的高度：焦距=物体实际的高度：（物体的Z轴值+焦距）[/b]
如果我们定义一个缩放比率（scaleRatio）：
[b]缩放比率（scaleRatio）=物体投影的高度：物体实际的高度；[/b]
那么我就可以获得
[b]缩放比率（scaleRatio）=物体投影的高度：物体实际的高度=焦距：（物体的Z轴值+焦距）[/b]
如下图

[img]/upload/attachment/54608/1194f625-8dc8-3df9-b2f8-7c636e296f1d.jpg[/img]
对于X和Y轴，他们服从同样的关系，但是我们只要用一个缩放比率（scaleRatio）就行，他们服从同样的规律。
[b]【贝武易科技专业flex3D开发--www.newflash3d.com】[/b]
这一节就讲到这里，请看下一节，flex/flash 3d基础2，接着讲。