<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>IT妖怪 &#187; 三维设计</title>
	<atom:link href="http://blog.ityao.com/archives/category/design/3d/feed" rel="self" type="application/rss+xml" />
	<link>http://blog.ityao.com</link>
	<description>热爱生活，热爱程序</description>
	<lastBuildDate>Wed, 03 Aug 2011 02:56:30 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.2.1</generator>
		<item>
		<title>Alternativa3D – Hello World（2）</title>
		<link>http://blog.ityao.com/archives/355</link>
		<comments>http://blog.ityao.com/archives/355#comments</comments>
		<pubDate>Wed, 16 Sep 2009 13:43:32 +0000</pubDate>
		<dc:creator>liu</dc:creator>
				<category><![CDATA[Adobe Flex]]></category>
		<category><![CDATA[三维设计]]></category>
		<category><![CDATA[Alternativa3D]]></category>

		<guid isPermaLink="false">http://blog.ityao.com/?p=355</guid>
		<description><![CDATA[ok,上期讲到了怎么导入Alternativa3D上的例子，现在我们继续学习Alternativa3D的开发。 我将会依照http://docs.alternativaplatform.com/display/TDEN/Home中的 Tutorials 来继续我们这个专题。 你需要的开发环境是 Flex Builder 3 Alternativa3D的开发包(现在我用的版本是5.5.0，可能有些函数在不同的版本会有变化，因此请确保你的版本和我一样♥) ———————————————————低调的分割线—————————————————— (本文参照http://docs.alternativaplatform.com/display/TDEN/Home中的 Hello, Alternativa3D而写。) 在这个教程中，我们将一步一步学习如何在Alternativa3D中创建一个简单的3D场景。 第一步，在Flex Builder（Flash也是可以作为开发环境的）中创建一个名为HelloAlternativa3D的新项目。 注意两点 项目为Action Script项目 项目名称为“HelloAlternativa3D”，大小写不要错否则拷贝后面的代码可能会报错。 第二步，导入Alternativa3D的库文件,在工程属性中设置。也可以在创建工程师就设置好。 第三步，拷贝下面的代码到项目根目录的HelloAlternativa3D.as HelloAlternativa3D.as 先运行看看效果:) 试试 键盘上的“W、A、S、D”和“上、下、左、右”，还有空格和鼠标滚轮，别忘了加上Shift键。 &#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;-朴素的分割线&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8211; 下面介绍一下代码： 创建场景 首先我们传建一个场景并且添上一个方盒: 添加摄像机 摄像机是必不可少的东东，这一步也是不可缺少的，初学Flash 3D时，最容易出现的错误就是模型或者场景没问题，但是摄像机方向有问题或者缩放比率有问题，导致找不到错误点 、 控制摄像机 在Alternativa3D中，已经提供了很多控制控制摄像机的类（这里有介绍），现在我们先挑一个 alternativa.engine3d.controllers.CameraController 用法如下 最后的工作 现在场景、摄像机、控制全都有了，我们把他们组装在一起 最后附上我的工程文件:) HelloAlternativa3D PS:建议你的Alternativa3D库文件放在D盘，就像下面这样，这样就不用修改工程文件里面的库文件配置了]]></description>
			<content:encoded><![CDATA[<p>ok,上期讲到了怎么导入Alternativa3D上的例子，现在我们继续学习Alternativa3D的开发。</p>
<p>我将会依照<a href="http://docs.alternativaplatform.com/display/TDEN/Home" target="_blank">http://docs.alternativaplatform.com/display/TDEN/Home</a>中的 Tutorials 来继续我们这个专题。</p>
<p><span id="more-355"></span></p>
<p>你需要的开发环境是</p>
<ul>
<li>Flex Builder 3</li>
</ul>
<ul>
<li>Alternativa3D的开发包(现在我用的版本是5.5.0，可能有些函数在不同的版本会有变化，因此请确保你的版本和我一样♥)</li>
</ul>
<p>———————————————————低调的分割线——————————————————</p>
<p>(本文参照<a href="http://docs.alternativaplatform.com/display/TDEN/Home" target="_blank">http://docs.alternativaplatform.com/display/TDEN/Home</a>中的 <a title="Hello, Alternativa3D" href="http://docs.alternativaplatform.com/display/TDEN/Hello%2C+Alternativa3D">Hello, Alternativa3D</a>而写。)</p>
<p>在这个教程中，我们将一步一步学习如何在Alternativa3D中创建一个简单的3D场景。</p>
<p>第一步，在Flex Builder（Flash也是可以作为开发环境的）中创建一个名为HelloAlternativa3D的新项目。</p>
<p>注意两点</p>
<ul>
<li>项目为Action Script项目</li>
</ul>
<ul>
<li>项目名称为“HelloAlternativa3D”，大小写不要错否则拷贝后面的代码可能会报错。</li>
</ul>
<p><a href="http://blog.ityao.com/wp-content/uploads/2009/09/1.png"><img src="http://blog.ityao.com/wp-content/uploads/2009/09/1.png" alt="新建一个名为“HelloAlternativa3D”的Action Script工程" title="新建一个名为“HelloAlternativa3D”的Action Script工程" width="529" height="502" class="alignnone size-full wp-image-371" /></a></p>
<p>第二步，导入Alternativa3D的库文件,在工程属性中设置。也可以在创建工程师就设置好。</p>
<div id="attachment_372" class="wp-caption alignnone" style="width: 542px"><a href="http://blog.ityao.com/wp-content/uploads/2009/09/21.png"><img src="http://blog.ityao.com/wp-content/uploads/2009/09/21.png" alt="导入Alternativa3D的库文件" title="导入Alternativa3D的库文件" width="532" height="681" class="size-full wp-image-372" /></a><p class="wp-caption-text">导入Alternativa3D的库文件</p></div>
<p>第三步，拷贝下面的代码到项目根目录的HelloAlternativa3D.as</p>
<div style="border-width: 1px">
<blockquote>
<div style="border-bottom-width: 1px"><strong>HelloAlternativa3D.as</strong></div>
<div style="border-bottom-width: 1px">
<pre class="brush: as3; title: ; notranslate">
package {
 import alternativa.engine3d.controllers.CameraController;
 import alternativa.engine3d.core.Camera3D;
 import alternativa.engine3d.core.Object3D;
 import alternativa.engine3d.core.Scene3D;
 import alternativa.engine3d.display.View;
 import alternativa.engine3d.materials.WireMaterial;
 import alternativa.engine3d.primitives.Box;
 import alternativa.utils.FPS;

 import flash.display.Sprite;
 import flash.display.StageAlign;
 import flash.display.StageScaleMode;
 import flash.events.Event;

 [SWF(backgroundColor=&quot;#000000&quot;, frameRate=&quot;100&quot;)]

 public class HelloAlternativa3D extends Sprite    {

 private var scene:Scene3D;
 private var view:View;
 private var camera:Camera3D;
 private var cameraController:CameraController;
 private var box:Box;

 public function HelloAlternativa3D()    {
 addEventListener(Event.ADDED_TO_STAGE, init);
 }

 public function init(e:Event): void {
 removeEventListener(Event.ADDED_TO_STAGE, init);

 stage.scaleMode = StageScaleMode.NO_SCALE;
 stage.align = StageAlign.TOP_LEFT;

 // Creating scene
 scene = new Scene3D();
 scene.root = new Object3D();
 box = new Box(100, 100, 100, 3, 3, 3);
 box.cloneMaterialToAllSurfaces(new WireMaterial(1, 0xFFFFFF));
 scene.root.addChild(box);

 // Adding camera and view
 camera = new Camera3D();
 camera.x = 100;
 camera.y = -150;
 camera.z = 100;
 scene.root.addChild(camera);

 view = new View();
 addChild(view);
 view.camera = camera;

 // Connecting camera controller
 cameraController = new CameraController(stage);
 cameraController.camera = camera;
 cameraController.setDefaultBindings();
 cameraController.checkCollisions = true;
 cameraController.collisionRadius = 20;
 cameraController.lookAt(box.coords);
 cameraController.controlsEnabled = true;

 // FPS display launch
 FPS.init(stage);

 stage.addEventListener(Event.RESIZE, onResize);
 stage.addEventListener(Event.ENTER_FRAME, onEnterFrame);
 onResize(null);
 }

 private function onResize(e:Event):void {
 view.width = stage.stageWidth;
 view.height = stage.stageHeight;
 }

 private function onEnterFrame(e:Event):void {
 // User input processing
 cameraController.processInput();
 // Scene calculating
 scene.calculate();
 }
 }
}
</pre>
</div>
</blockquote>
</div>
<p>先运行看看效果:)</p>
<p><a href="http://blog.ityao.com/wp-content/uploads/2009/09/3.png"><img src="http://blog.ityao.com/wp-content/uploads/2009/09/3.png" alt="3" title="3" width="800" height="609" class="alignnone size-full wp-image-377" /></a></p>
<div style="border-width: 1px">试试 键盘上的“W、A、S、D”和“上、下、左、右”，还有空格和鼠标滚轮，别忘了加上Shift键。</div>
<div style="border-width: 1px">&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;-朴素的分割线&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8211;</div>
<div style="border-width: 1px">下面介绍一下代码：</div>
<div style="border-width: 1px">
<ol>
<li>
<h5>创建场景</h5>
<p>首先我们传建一个场景并且添上一个方盒:</p>
<div style="border-width: 1px">
<div>
<pre class="brush: as3; title: ; notranslate">
// Create scene object. Scene is a container which have everything else inside.
scene = new Scene3D();
// Set root object for scene hierarchy. Root object coordinate system becomes scene global coordinate system.
scene.root = new Object3D();
// Create cube primitive
box = new Box(100, 100, 100, 3, 3, 3);
// Set material which draws primitive edges
box.cloneMaterialToAllSurfaces(new WireMaterial(1, 0xFFFFFF));
// Add primitive to a scene
scene.root.addChild(box);
</pre>
</div>
</div>
</li>
<li>添加摄像机<br />
摄像机是必不可少的东东，这一步也是不可缺少的，初学Flash 3D时，最容易出现的错误就是模型或者场景没问题，但是摄像机方向有问题或者缩放比率有问题，导致找不到错误点</p>
<pre class="brush: as3; title: ; notranslate">
// Create camera instance and set it's coordinates
camera = new Camera3D();
camera.x = 100;
camera.y = -150;
camera.z = 100;
// Add camera to the scene
scene.root.addChild(camera);
// Create a view and connect it to the camera
view = new View();
addChild(view);
view.camera = camera;
</pre>
<p>、</li>
<li>控制摄像机<br />
在Alternativa3D中，已经提供了很多控制控制摄像机的类（<a href="http://help.alternativaplatform.com/en/client/alternativa/engine3d/controllers/package-detail.html" target="_blank">这里有介绍</a>），现在我们先挑一个  alternativa.engine3d.controllers.CameraController<br />
用法如下</p>
<pre class="brush: as3; title: ; notranslate">
// Create controller and connect camera
cameraController = new CameraController(stage);
cameraController.camera = camera;
// Set default control keys
cameraController.setDefaultBindings();
// Turn on camera collision detection
cameraController.checkCollisions = true;
// Set collision detection radius for camera
cameraController.collisionRadius = 20;
// Aim camera at the cube primitive
cameraController.lookAt(box.coords);
// Activate camera controls
cameraController.controlsEnabled = true;
</pre>
</li>
<li>最后的工作<br />
现在场景、摄像机、控制全都有了，我们把他们组装在一起
<pre class="brush: as3; title: ; notranslate">
public function HelloAlternativa3D() {

 //...

 // Initialize FPS display
 FPS.init(stage);
 // This function is for view size changes during player window changes
 addEventListener(Event.RESIZE, onResize);
 // This function enables user input processing and scene calculation every frame
 stage.addEventListener(Event.ENTER_FRAME, onEnterFrame);
 // Initial view size
 onResize(null);
}

private function onResize(e:Event):void {
 // Set view size equal to player window size
 view.width = stage.stageWidth;
 view.height = stage.stageHeight;
}

private function onEnterFrame(e:Event):void {
 // User input processing
 cameraController.processInput();
 // Scene calculating. Scene will be recalculated and all changes will be redrawed in camera.
 scene.calculate();
}
</pre>
</li>
</ol>
</div>
<div style="border-width: 1px">最后附上我的工程文件:)</div>
<div style="border-width: 1px"><a href="http://blog.ityao.com/wp-content/uploads/2009/09/HelloAlternativa3D.zip">HelloAlternativa3D</a></div>
<div style="border-width: 1px">PS:建议你的Alternativa3D库文件放在D盘，就像下面这样，这样就不用修改工程文件里面的库文件配置了</div>
<pre class="brush: bash; title: ; notranslate">
D:\alternativa3d_5.5.0\
D:\alternativa3d_5.5.0\alternativa3d_fp9
D:\alternativa3d_5.5.0\alternativa3d_fp10
</pre>
</div>
]]></content:encoded>
			<wfw:commentRss>http://blog.ityao.com/archives/355/feed</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
	</channel>
</rss>

