您的位置：首页 > 产品设计 > 产品经理

Away3D实例教程 - 贴图（Dot3BitmapMaterial）

2009-06-04 18:43 441 查看
本例包含的内容有：

normalmap
Dot3BitmapMaterial

转载请注明出处：nooon.cnblogs.com

本例子将讲解如何使用normapmap和Dot3BitmapMaterial做一堵涂鸦墙。

本例会用到的图片：





normalmap.png,记录墙面每点的法线信息（稍后解释）





doodle.jpg用作墙体上的涂鸦内容。

看最终效果：点此观看（拖动鼠标，旋转摄像机；不同角度看看Dot3BitmapMaterial对光反射的变化。同时看墙后方的PhongBitmapMaterial类位图材质）。

先看看什么是normalmap。

normalmap，可以帮助低面模型（面数少的模型）生成更为现实的效果。比如在本例中，涂鸦墙墙体只是一个矩形，矩形每个面都是平整的。不会有砖体，这里我们就是借助上面的normalmap.png这张图片做normalmap生成墙表面凹凸不平的效果！如果不用NormalMap的话，我们当然也可以用3D软件做出一个有凹凸不平的效果的墙体（高面模型），然后用BitmapMaterial对模型贴图。但很显然这样的模型面数多，渲染时会拖垮电脑。现在3D游戏都会用normalmap让3D让模型更贴近真实。

normalmap之所以有此之能是因为normalmap能记录物体表面各点的位置信息。normalmap实质是一张没什么特别的RGB图像，但这样的RGB图片的每点的R、G、B值是用来记录该点的空间位置信息的（分别对应X、Y、Z）。这样3D引擎就可以根据RGB值计算使用Normalmap的模型的表面每个小曲面的垂线方向即法线，从而计算出模型表面各点对光的反射方向。所以normalmap称之法线图。





更多内容看：http://www.blacksmith-studios.dk/projects/downloads/bumpmapping_using_cg.php

如何的到normalmap呢？

可以到网上找。





当然可以自个做，3D软件大多可以，不过这里介绍一个很有趣的方法，看http://zarria.net/nrmphoto/nrmphoto.html

最后按惯例加上本例子的源代码：

package
{
importaway3d.cameras.HoverCamera3D;
importaway3d.containers.View3D;
importaway3d.core.utils.Cast;
importaway3d.lights.DirectionalLight3D;
importaway3d.materials.PhongBitmapMaterial;
importaway3d.materials.Dot3BitmapMaterial;
importaway3d.primitives.Cube;
importflash.display.Sprite;
importflash.events.Event;
importflash.events.MouseEvent;
[SWF(width="500",height="500",frameRate="30",backgroundColor="#000000")]
publicclassnormalMappingextendsSprite
{
privatevarview:View3D;
privatevarcam:HoverCamera3D;
privatevarcube:Cube;
privatevardoodle:Dot3BitmapMaterial;
privatevaroriginalmap:PhongBitmapMaterial;
privatevarlight:DirectionalLight3D;
privatevarmouseDown:Boolean;
privatevarlastMouseX:Number;
privatevarlastMouseY:Number;
privatevarlastPanangle:Number;
privatevarlastTiltangle:Number;
privatevarcameraSpeed:Number;
[Embed(source="resources/doodle.jpg")]privatevardoodleImage:Class;
[Embed(source="resources/normalmap.png")]privatevarnormalmapImage:Class;
publicfunctionnormalMapping()
{
//初始3D世界（摄像机、视口。。）
init3D();
//创建场景里的3D模型（建一立方体用作涂鸦的墙体）
createSce();
//添加侦听器（监测鼠标拖动，如拖动则旋转摄像机；并且每帧渲染）
addEventListener(Event.ENTER_FRAME,update);
stage.addEventListener(MouseEvent.MOUSE_DOWN,m_down_h);
stage.addEventListener(MouseEvent.MOUSE_UP,m_up_h);
}
privatefunctioninit3D():void
{
cam=newHoverCamera3D();
cam.distance=1200;
cam.panangle=cam.targetpanangle=30;
cam.tiltangle=cam.targettiltangle=0;
cam.mintiltangle=-90;
view=newView3D({camera:cam,x:250,y:250});
addChild(view);
};
privatefunctioncreateSce():void
{
//控制摄像机旋转速度
cameraSpeed=.3;
//创建直线光源，Dot3BitmapMaterial需要光源。没有光源与普通的BitmapMaterial无异
varlight:DirectionalLight3D=newDirectionalLight3D({brightness:1,ambient:0.25,diffuse:0.75,specular:0.9});
light.x=5000;
light.z=-50000;
light.y=1000;
view.scene.addChild(light);
//新建originalmap，是PhongBitmapMaterial类型，用作墙后方贴图
originalmap=newPhongBitmapMaterial(Cast.bitmap(newdoodleImage()));
//新建doodle，是Dot3BitmapMaterial类型，用作墙前方贴图
doodle=newDot3BitmapMaterial(Cast.bitmap(newdoodleImage()),Cast.bitmap(newnormalmapImage()),{smooth:true,precision:6});
//新建一立方体，用作墙体
cube=newCube({width:600,height:300,depth:20,segmentsW:2,segmentsH:2});
//分别为墙体前后方贴图
cube.cubeMaterials.front=doodle;
cube.cubeMaterials.back=originalmap;
view.scene.addChild(cube);
};
privatefunctionupdate(e:Event):void
{
if(mouseDown)
{
cam.targetpanangle=cameraSpeed*(stage.mouseX-lastMouseX)+lastPanangle;
cam.targettiltangle=cameraSpeed*(stage.mouseY-lastMouseY)+lastTiltangle;
};
cam.hover();
view.render();
};
privatefunctionm_down_h(e:MouseEvent):void
{
mouseDown=true;
lastMouseX=stage.mouseX;
lastMouseY=stage.mouseY;
lastPanangle=cam.targetpanangle;
lastTiltangle=cam.targettiltangle;
};
privatefunctionm_up_h(e:MouseEvent):void
{
mouseDown=false;
};
}
}


.csharpcode,.csharpcodepre
{
font-size:small;
color:black;
font-family:consolas,"CourierNew",courier,monospace;
background-color:#ffffff;
/*white-space:pre;*/
}
.csharpcodepre{margin:0em;}
.csharpcode.rem{color:#008000;}
.csharpcode.kwrd{color:#0000ff;}
.csharpcode.str{color:#006080;}
.csharpcode.op{color:#0000c0;}
.csharpcode.preproc{color:#cc6633;}
.csharpcode.asp{background-color:#ffff00;}
.csharpcode.html{color:#800000;}
.csharpcode.attr{color:#ff0000;}
.csharpcode.alt
{
background-color:#f4f4f4;
width:100%;
margin:0em;
}
.csharpcode.lnum{color:#606060;}


                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航