1234 第1页 | 共4 页下一页
返回列表 发新帖
查看: 18258|回复: 33
打印 上一主题 下一主题

away3d4.0 新手入门系列教程 第一讲 3D WORLD

[复制链接]

10

主题

3

听众

760

积分

初级设计师

Rank: 3Rank: 3

纳金币
3
精华
0

最佳新人 活跃会员 热心会员 灌水之王 突出贡献

跳转到指定楼层
楼主
发表于 2012-8-21 13:03:09 |只看该作者 |倒序浏览
         网页的多媒体应用FLASH功不可没,在线视频,网页动画,网页游戏等等..FLASH MX FLASH8的出现在flash应用越来越广的时候,纵多闪客横空出世的时候,AS程序员可以用FLASH这个低门槛的软件做游戏的时候,大家心里或许都有遗憾。就是FLASH对于3D的无力。在AS2时代,那语言还不强大成熟的时候这简直是个高不可攀的梦想,仅有PV3D这样的先驱者做着尝试,后来Adobe收购了MM公司 FLASH也划于其旗下,AS3的横空出世,完善的OOP编程模式,特别是FP10里Z轴的出现 让FLASH3D看到曙光了,一大批基于AS3的较为成熟的3D引擎也纷纷出现: A3D AWAY3D 等。后来在AODBE MAX大会上 AODOBE宣布了FlashPlayer基于GPU渲染的MOLEHILL(也就是后来的STAGE3D) ,当演示的时候 flashplayer里面绚丽的3D效果 我相信看到的人都和我一样热血沸腾。在现在这个时代已经到来。FP11已经具备了GPU硬件加速功能。flashplayer实时渲染上十万个多边形模型已经不再话下。我相信大家都想看到在网页上玩CS。而更多的ASer应该更想动起手来制作属于自己的3D世界。在此我就将个人研究学习心得贡献出来,抛砖引玉,和大家共同学习,以下是我将用到的引擎和环境。
        1引擎:我将会用Away3d这款3D引擎来讲。因为其清楚的API和免费开源。
        2环境:个人比较懒。而且网上的配置教程也比较多,如果你是低版本的FLASH PRO 或者FLASH BUILD 那自行去找配置教程,我推荐就直接使用FLASH BUILD4.6,或者FLASH CS6  这样不用去配置环境。而AWAY3D的类文件我会放在附件里。


=================================华丽的分割线====================================

现在我们打开FLASH 或者 FLASH BUILD 开始动手开始创建我们的第一个3D世界
   创建away3d的3D世界 首先我们得了解away3d的几个基本类 也是每次我们做的时候必须初始化的  View3D ,Scene3D ,Camera3D。这三个类我做下简单的解释
1   View3D 我们可以理解为一个窗子。就像我们站在屋外可以通过窗子看到屋内的家具。同理 如果同时有多扇窗子,我们就可以看到多个屋内环境。在AWAY3D里面 我也可以通过创建多个View3D来看到这个3D世界。
2 Scene3D  我还是拿屋子做比较。Scene3D就类似这个屋内这个空间。因为这个空间的存在。我们才能向里面放置家具。
3 Camera3D 这个就类似我们的眼睛。因为它我们才看到这个世界。我们改变Camera3D 的坐标 遍可以从不同角度来观看这个3D世界

以上就是3个基础类。他们的创建方式如下
var _view:View3D=new View3D();
addChild(_view);

var _scene:Scene3D=new Scene3D();
_view.scene=_scene;

var _camera:Camera3D=new Camera3D();
_view.camera=_camera;

好了基本元素创建完毕 最后 我们需要用一个ENTER_FRAME来实时渲染这个View3D
_view.render();

下面我们来说说AWAY3D的基本模型
Away3d里面有我们常见的几何体。如球SphereGeometry
,盒子CubeGeometry
,平面Plane,圆柱体CylinderGeometry等等 他们都在primitives类里面 大家可以自行查阅。在这我就不一一列举了 他们创建的方式也几乎一样。我现在教大家创建一个基本3D模型:球。
在away3d里 创建模型需要3个条件 Mesh(网格) Mode(模型)  Material(贴图)
Mesh是一个显示对象 我们的Mode 和Material就将放置其中 然后显示出来
我们现在创建一个纯白色,半径为200,横向细分(细分就是模型的拓扑结构,细分越大 每个多边形就越小 模型也越光滑。相应的对电脑的压力也越大)为32 纵向细分为24的球,代码如下
var _material:ColorMaterial=new ColorMaterial(0xffffff);
var _sphere:SphereGeometry=new SphereGeometry(100,32,32);
var _sphereMesh:Mesh=new Mesh(_sphere,_material);
然后我们将Mesh addChild 到View3D里

_view.scene.addChild(_sphereMesh);

然后我们输出 就可以看到一个白色的圆。如图

是不是很不立体啊 呵呵因为没打灯光 没有明暗关系

我们可以打一个灯光

var _dlirectionalLight=new DirectionalLight();
   var _dl2irectionalLight=new DirectionalLight(.5,1,-1);
   _dl2.ambient=.1
   var _light:StaticLightPicker=new StaticLightPicker([_dl,_dl2]);
   
   _sphereMesh.material.lightPicker=_light;
   
   _view.scene.addChild(_dl);


然后我们输出就可以看到如下图


现在就有3D感觉了吧 好吧 今天教程到此为止。
全部的代码如下
package  {

import flash.display.MovieClip;
import away3d.containers.View3D;
import away3d.containers.Scene3D;
import away3d.cameras.Camera3D;
import flash.events.Event;
import flash.display.Sprite;
import away3d.materials.ColorMaterial;
import away3d.primitives.SphereGeometry;
import away3d.entities.Mesh;
import away3d.lights.DirectionalLight;
import away3d.materials.lightpickers.StaticLightPicker;

public class Main extends  Sprite {
  
  private var _view:View3D;
  
  private var _scene:Scene3D;
  
  private var _camera:Camera3D;
  
  private var _material:ColorMaterial;
  
  private var _sphere:SphereGeometry;
  
  private var _sphereMesh:Mesh;
  
  private var _dlirectionalLight;
  private var _dl2irectionalLight;
  
  private var _light:StaticLightPicker;
   
  public function Main()
  {
   _view=new View3D();
   addChild(_view);
   
   _scene=new Scene3D();
   _view.scene=_scene;   
   _camera=new Camera3D();
   _view.camera=_camera;
      _material=new ColorMaterial(0xffffff);
   _sphere=new SphereGeometry(100,32,32);
   _sphereMesh=new Mesh(_sphere,_material);
   _view.scene.addChild(_sphereMesh);
   
   _dl=new DirectionalLight();
   _dl2=new DirectionalLight(.5,1,-1);
   _dl2.ambient=.1
   _light=new StaticLightPicker([_dl,_dl2]);
   
   _sphereMesh.material.lightPicker=_light;
   
   _view.scene.addChild(_dl);
   this.addEventListener(Event.ENTER_FRAME,enterFrameFunction)
  }
  
  private function enterFrameFunction(evt:Event):void
  {
   _view.render();
  }
}

}




在下一篇教程里 我会给大家介绍一下light (灯光)
  
分享到: QQ好友和群QQ好友和群 腾讯微博腾讯微博 腾讯朋友腾讯朋友 微信微信
转播转播0 分享淘帖0 收藏收藏0 支持支持0 反对反对0
回复

使用道具 举报

wsk    

0

主题

1

听众

24

积分

设计初学者

Rank: 1

纳金币
24
精华
0

活跃会员 灌水之王

沙发
发表于 2012-9-7 11:54:20 |只看该作者
支持!!!!!!!!!!!!
回复

使用道具 举报

0

主题

0

听众

22

积分

设计初学者

Rank: 1

纳金币
22
精华
0
板凳
发表于 2012-9-7 17:21:07 |只看该作者
总算找到中文教程了,好东西,支持!
回复

使用道具 举报

0

主题

0

听众

18

积分

设计初学者

Rank: 1

纳金币
18
精华
0
地板
发表于 2012-9-24 09:19:40 |只看该作者
楼主加油,极度支持,呵呵    。
回复

使用道具 举报

ss33    

0

主题

0

听众

17

积分

设计初学者

Rank: 1

纳金币
15
精华
0
5#
发表于 2012-9-26 11:48:51 |只看该作者
怎么到处away3d类都不一样啊。。。
回复

使用道具 举报

0

主题

0

听众

16

积分

设计初学者

Rank: 1

纳金币
16
精华
0
6#
发表于 2012-10-9 11:25:17 |只看该作者
好教程 谢谢!
回复

使用道具 举报

0

主题

0

听众

24

积分

设计初学者

Rank: 1

纳金币
24
精华
0
7#
发表于 2012-10-20 15:05:32 |只看该作者
支持 支持~~~~~~~~~~~~~~
回复

使用道具 举报

0

主题

0

听众

28

积分

设计初学者

Rank: 1

纳金币
28
精华
0
8#
发表于 2012-10-26 22:06:33 |只看该作者
找地址
回复

使用道具 举报

0

主题

0

听众

28

积分

设计初学者

Rank: 1

纳金币
28
精华
0
9#
发表于 2012-10-29 19:47:52 |只看该作者
给师傅顶顶人气
回复

使用道具 举报

0

主题

1

听众

21

积分

设计初学者

Rank: 1

纳金币
17
精华
0

活跃会员 灌水之王

10#
发表于 2012-12-4 17:00:43 |只看该作者
看看~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
回复

使用道具 举报

1234 第1页 | 共4 页下一页
返回列表 发新帖
您需要登录后才可以回帖 登录 | 立即注册

手机版|纳金网 ( 闽ICP备2021016425号-2/3

GMT+8, 2024-11-30 09:00 , Processed in 0.114717 second(s), 37 queries .

Powered by Discuz!-创意设计 X2.5

© 2008-2019 Narkii Inc.

回顶部