Laya3d API

scene

  • 創(chuàng)建場景
    var scene = Laya.stage.addChild(new Laya.Scene());
  • 加載外部場景
Laya.loader.create("LayaScene_01/loveScene.ls",
Laya.Handler.create(this, this.completeHandler), null, Laya.Scene);
function completeHandler() {
    // 第一種方法 獲取場景
    // var scene=Laya.Scene.load("LayaScene_01/loveScene.ls");
    // 第二種方法，緩存后加載方式
    var scene = Laya.loader.getRes("LayaScene_01/loveScene.ls");
    Laya.stage.addChild(scene);
}

camera

  • 創(chuàng)建相機(jī) (縱橫比, 近距裁剪, 遠(yuǎn)距裁剪)
    var camera = new Laya.Camera(0,0.1,100); 
camera.nearPlane = 0;
camera.farPlane = 100;
  • 添加到場景
    scene.addChild(camera);
  • 視野角度 (90度)
    camera.fieldOfView = 90;
  • 移動相機(jī)
    camera.transform.translate(new Laya.Vector3(0,0,3),false);
  • 旋轉(zhuǎn)
    camera.transform.rotate(new Laya.Vector3(0,0,3),true,true);
  • 正交投影
    camera.orthographicProjection = true;
  • 正交大小
    camera.orthographicVerticalSize = 7;
  • 看向某點(diǎn)方向 (某點(diǎn), 坐標(biāo)系朝向)
camera.transform.lookAt(box.transform.position,new Laya.Vector3(0,1,0));
  • 相機(jī)下的背景色
    camera.clearColor = new Laya.Vector3(0.5,0.5,0.6);
  • 天空盒
var skyBox:Laya.SkyBox = new Laya.SkyBox();
//必須設(shè)置, 否則無法顯示天空
camera.clearFlag = Laya.BaseCamera.CLEARFLAG_SKY;
//綁定
camera.sky = skyBox;
加載貼圖
skyBox.textureCube = Laya.TextureCube.load("skyBox/skyCube.ltc");
  • 多鏡頭
var camera1=new Laya.Camera();
camera1.viewport=new Laya.Viewport(0,0,640,720);

var camera2=new Laya.Camera();
camera2.viewport=new Laya.Viewport(640,0,640,720);

light

  • 點(diǎn)光源
//創(chuàng)建點(diǎn)光
var light = scene.addChild(new Laya.PointLight());
//移動燈光位置
light.transform.translate(new Laya.Vector3(-3,5,0));
//設(shè)置點(diǎn)光照亮范圍
light.range = 6;
//設(shè)置點(diǎn)光的衰減
light.attenuation = new Laya.Vector3(0.01,0.01,0.03);
  • 平行光
//創(chuàng)建平行光
var light = scene.addChild(new Laya.DirectionLight());
//設(shè)置平行光的方向
light.direction = new Laya.Vector3(0.5, -1, 0);
  • 聚光燈
//添加聚光
var light = scene.addChild(new Laya.SpotLight());
//設(shè)置聚光的位置
light.transform.position = new Laya.Vector3(0,5,0);
//設(shè)置聚光的衰減
light.attenuation = new Laya.Vector3(0.1, 0, 0.1);
//設(shè)置聚光的方向
light.direction=new Laya.Vector3(0, -1, 0);
//設(shè)置聚光范圍
light.range = 5;
//設(shè)置聚光值
light.spot = 5;
  • 環(huán)境顏色
//貌似環(huán)境色從燈光中去除了, 材質(zhì)中去找
light.ambientColor = new Laya.Vector3(1,1,0);
  • 漫反射顏色
//設(shè)置燈光的漫反射色為純紅色
//light.diffuseColor = new Laya.Vector3(1,0,0);
//設(shè)置燈光顏色為純紅色(與diffuseColor作用相同)
light.color = new Laya.Vector3(1,0,0);
  • 高光色
//設(shè)置高光顏色為藍(lán) 貌似從燈光中去除了, 材質(zhì)中去找
light.specularColor = new Laya.Vector3(0.5,0.5,1);
  • 投影 shadow
//添加燈光投影
light.shadow=true;
//產(chǎn)生投影的范圍（如過小將不會產(chǎn)生投影）
light.shadowDistance=45;
//生成陰影貼圖數(shù)量
light.shadowPSSMCount = 1;
//模糊等級,越大越高,效果更好，更耗性能
light.shadowPCFType=1;
//投影質(zhì)量
light.shadowResolution=2048;

材質(zhì)需要設(shè)置

//產(chǎn)生陰影
sphere.meshRender.castShadow=true;
//接受陰影
box.meshRender.receiveShadow=true;

模型 Mesh / Geometry

  • 創(chuàng)建盒子
//創(chuàng)建盒子模型(參數(shù)為：長、寬、高，單位：米)
var boxMesh:Laya.BoxMesh=new Laya.BoxMesh(2,2,2);
//創(chuàng)建模型顯示對象
var box3D:Laya.MeshSprite3D=new Laya.MeshSprite3D(boxMesh);
  • 創(chuàng)建球體
//創(chuàng)建球體模型(參數(shù)為：半徑、水平層數(shù)、垂直層數(shù))
var sphereMesh:Laya.SphereMesh=new Laya.SphereMesh(1,8,8);
//創(chuàng)建模型顯示對象
var sphere3D:Laya.MeshSprite3D=new Laya.MeshSprite3D(sphereMesh);
  • 創(chuàng)建圓柱體
//創(chuàng)建圓柱體模型(參數(shù)為：半徑、高、圓截面線段數(shù))
var cylinderMesh:Laya.CylinderMesh=new Laya.CylinderMesh(1,2,8);
//創(chuàng)建模型顯示對象
var cylinder3D:Laya.MeshSprite3D=new Laya.MeshSprite3D(cylinderMesh);
  • 模型貼圖
//創(chuàng)建材質(zhì)----------------------------------
var material:Laya.StandardMaterial = new Laya.StandardMaterial();
//為模型賦材質(zhì)（單個(gè)材質(zhì)可賦給多個(gè)模型）
box3D.meshRender.material = material;
  • 加載建模和事件偵聽
//加載導(dǎo)出的卡車模型
this.truck3D = Laya.Sprite3D.load("LayaScene_truck/truck.lh");
//模型與材質(zhì)加載完成事件監(jiān)聽
this.truck3D.on(Laya.Event.HIERARCHY_LOADED,this,this.onLoded);
this.scene.addChild(this.truck3D);
//模型與材質(zhì)加載完成后回調(diào)
private onLoded():void
{ 
  console.log(this.truck3D);
  //獲取模型（查看.lh文件，有兩個(gè)子對象模型，一為車頭“head”，一為車身“body”，暫取其中一個(gè)模型）
  var meshSprite3D:Laya.MeshSprite3D = this.truck3D.getChildAt(0).getChildAt(0) as Laya.MeshSprite3D;
  //輸出模型的名字(輸出“body”)
  console.log(meshSprite3D.name);
}
  • 加載建模后替換建模
//加載導(dǎo)出的卡車模型
this.truck3D = Laya.Sprite3D.load("LayaScene_truck/truck.lh");
this.scene.addChild(this.truck3D);
//模型與材質(zhì)加載完成事件監(jiān)聽
this.truck3D.on(Laya.Event.HIERARCHY_LOADED,this,this.onLoaded);
//模型與材質(zhì)加載完成后回調(diào)
private onLoaded():void
{ 
  console.log(this.truck3D);
  //獲取模型（查看.lh文件，有兩個(gè)子對象模型，一為車頭“head”，一為車身“body”，暫取其中一個(gè)模型）
  this.meshSprite3D = this.truck3D.getChildAt(0).getChildAt(0) as Laya.MeshSprite3D;
  //輸出模型的名字(輸出“body”)
  console.log(this.meshSprite3D.name);
  //2秒后更換模型網(wǎng)格
  Laya.timer.once(2000,this,this.onTimerOnce);
}
private onTimerOnce():void{
  //創(chuàng)建模型網(wǎng)格并更換原始網(wǎng)格
  this.meshSprite3D.meshFilter.sharedMesh = Laya.Mesh.load("LayaScene_truck/Assets/truck-head.lm");
  //因使用了卡車頭網(wǎng)格，位置會沖個(gè)，所以進(jìn)行位置移動
  this.meshSprite3D.transform.translate(new Laya.Vector3(0,0,-8));
}

材質(zhì) Material

  • 標(biāo)準(zhǔn)材質(zhì) standerd
//創(chuàng)建標(biāo)準(zhǔn)材質(zhì)
var material = new Laya.StandardMaterial();
//創(chuàng)建漫反射二維紋理貼圖
material.diffuseTexture = Laya.Texture2D.load("res/layabox.png");
//為box模型賦材質(zhì)
box.meshRender.material = material;

異步加載

//異步加載材質(zhì)文件創(chuàng)建標(biāo)準(zhǔn)材質(zhì)（也可以預(yù)加載）
var material = Laya.StandardMaterial.load("truck/Assets/Materials/t0200.lmat");
//為box模型賦材質(zhì)
box.meshRender.material = material;
  • 修改材質(zhì)
//加載導(dǎo)出的卡車模型
this.role3D = Laya.Sprite3D.load("LayaScene_truck/truck.lh");
//模型與材質(zhì)加載完成監(jiān)聽與回調(diào)
this.role3D.on(Laya.Event.HIERARCHY_LOADED,this,onLoadComplete);
this.scene.addChild(this.role3D);
//模型與材質(zhì)加載完成后回調(diào)
function onLoadComplete(){
  //獲取車身模型（查看.lh文件，模型中兩個(gè)對象，車頭“head”與車身“body”，他們都用同一個(gè)材質(zhì)）
  var meshSprite3D = this.role3D.getChildAt(0).getChildAt(0);
  //從模型上獲取自身材質(zhì)
  var material = meshSprite3D.meshRender.material;
  //修改材質(zhì)的反射顏色，讓模型偏紅
  material.albedo = new Laya.Vector4(1,0,1,1);
}
  • 修改共享材質(zhì)
//加載導(dǎo)出的卡車模型
this.role3D = Laya.Sprite3D.load("LayaScene_truck/truck.lh");
//模型與材質(zhì)加載完成監(jiān)聽與回調(diào)
this.role3D.on(Laya.Event.HIERARCHY_LOADED,this,onLoadComplete);
this.scene.addChild(this.role3D);
//模型與材質(zhì)加載完成后回調(diào)
function onLoadComplete(){
  //獲取車身模型（查看.lh文件，模型中兩個(gè)對象，車頭“head”與車身“body”，它們都用同一個(gè)材質(zhì)）
  var meshSprite3D = this.role3D.getChildAt(0).getChildAt(0);
  //從模型上獲取共享材質(zhì)
  var shareMaterial = meshSprite3D.meshRender.shareMaterial;
  //修改材質(zhì)的反射顏色，讓模型偏紅
  shareMaterial.albedo = new Laya.Vector4(1,0,0,1);
}
  • 修改材質(zhì)列表
//加載場景
this.scene = Laya.Scene.load("LayaScene_01/loveScene.ls");
Laya.stage.addChild(this.scene);
//場景模型與材質(zhì)加載完成監(jiān)聽與回調(diào)
this.scene.on(Laya.Event.HIERARCHY_LOADED,this,function(){
  setModelMaterial(this.scene);
});
//修改模型材質(zhì)(場景或模型)
function setModelMaterial(model){
  //如果是模型網(wǎng)格顯示對象
  if(model instanceof Laya.MeshSprite3D){
    //獲取模型網(wǎng)格對象
    var meshSprite3D = model;
    //獲取材質(zhì)列表數(shù)組
    var materials = meshSprite3D.meshRender.materials;
    //對模型網(wǎng)格中的所有材質(zhì)進(jìn)行修改
    for(var m = 0;m < materials.length;m++){
      //獲取共享材質(zhì)
      var mat = materials[m];
      //修改材質(zhì)反射顏色
      mat.albedo = new Laya.Vector4(0.5,0.5,1,1);
    }
  }
  //如果是蒙皮模型網(wǎng)格顯示對象
  if(model instanceof Laya.SkinnedMeshSprite3D){
    //獲取蒙皮模型網(wǎng)格顯示對象
    var skinnedMeshSprite3D = model;
    //獲取材質(zhì)列表數(shù)組
    var materials1 = skinnedMeshSprite3D.skinnedMeshRender.materials;
    //對蒙皮模型網(wǎng)格中的所有材質(zhì)進(jìn)行修改
    for(var n = 0;n < materials1.length;n++){
      //獲取共享材質(zhì)
      var mat1 = materials1[n];
      //修改材質(zhì)反射顏色
      mat1.albedo = new Laya.Vector4(0.5,0.5,1,1);
    }
  }
  //遞歸方法獲取子對象
  for(var i = 0;i < model._childs.length;i++){
    setModelMaterial(model._childs[i]);
  }
}

材質(zhì)的光色與貼圖

  • 反射率 albedo

反射率的值是一個(gè)四維向量，查看下列代碼，向量中四個(gè)元素分別代表著紅、綠、藍(lán)、透明alpha。
透明alpha效果為百分比，0為全透明，1為全透明，如果需要設(shè)置為半透明或全透明顯示，只調(diào)整反射率還不行，還需要設(shè)置材質(zhì)的渲染模式為混合類型才能達(dá)到目的

反射率albedo數(shù)值越高，反射貼圖效果越小，漫反射貼圖效果越強(qiáng)，可根據(jù)實(shí)際的模型材質(zhì)效果調(diào)節(jié)，比如水面、鏡面、金屬面可調(diào)節(jié)不同的反射率達(dá)到需求。

//創(chuàng)建標(biāo)準(zhǔn)材質(zhì)
var material = new Laya.StandardMaterial();
//創(chuàng)建漫反射二維紋理貼圖
material.diffuseTexture = Laya.Texture2D.load("res/layabox.png");
//只有設(shè)置了渲染模式為透明混合類型才能達(dá)到透明效果
//設(shè)置材質(zhì)藍(lán)色染色及30%半透明
material.albedo=new Laya.Vector4(1,1,2,0.3);
//渲染模式(也可設(shè)置數(shù)值，5-13等為混合類型，可觀察其效果變化)
material.renderMode = Laya.StandardMaterial.RENDERMODE_DEPTHREAD_TRANSPARENTDOUBLEFACE;;
//為box模型賦材質(zhì)
box.meshRender.material = material;
  • 漫反射 diffuse
//添加方向光（燈光色會與材質(zhì)色融合，因此改燈光色為黑白灰色，且不能曝光過度）
var directionLight = scene.addChild(new Laya.DirectionLight());
//環(huán)境色
directionLight.ambientColor = new Laya.Vector3(0.5, 0.5, 0.5);
//高光 / 金屬色
directionLight.specularColor = new Laya.Vector3(0, 0, 0);
//漫反射色
directionLight.diffuseColor = new Laya.Vector3(1, 1, 1);
directionLight.direction = new Laya.Vector3(0.5, -1, 0);    
//創(chuàng)建標(biāo)準(zhǔn)材質(zhì)
var material = new Laya.StandardMaterial();
//創(chuàng)建漫反射顏色
material.diffuseColor=new Laya.Vector3(.5,.5,2);
//創(chuàng)建漫反射二維紋理貼圖
material.diffuseTexture = Laya.Texture2D.load("res/layabox.png");
//為box模型賦材質(zhì)
box.meshRender.material = material;
  • 高光 specular
//創(chuàng)建平行光 -------------------
var light = scene.addChild(new Laya.DirectionLight());
//修改燈光方向
light.direction = new Laya.Vector3(0.3, -1, 0);
//設(shè)置高光色為白色
light.specularColor = new Laya.Vector3(1,1,1);
//加載導(dǎo)出的卡車模型
this.role3D = Laya.Sprite3D.load("LayaScene_truck/truck.lh");
//模型與材質(zhì)加載完成事件監(jiān)聽
this.role3D.on(Laya.Event.HIERARCHY_LOADED,this,onLoadComplete);
scene.addChild(this.role3D);
this.scene.addChild(this.role3D);
/** 模型與材質(zhì)加載完成后回調(diào)***/        
function onLoadComplete()
{
  //獲取模型
  var meshSprite3D = this.role3D.getChildAt(0).getChildAt(0);
  //從模型上獲取共享材質(zhì)
  var sharedMaterial = meshSprite3D.meshRender.sharedMaterial;
  //修改材質(zhì)的高光顏色，讓高光處偏紅
  sharedMaterial.specularColor = new Laya.Vector4(1,0,0,1);
  //加載高光貼圖（與漫反射一致，也可單獨(dú)制作高光貼圖）
  sharedMaterial.specularTexture = sharedMaterial.diffuseTexture;
  //sharedMaterial.specularTexture = Laya.Texture2D.load("LayaScene_truck/Assets/texture/t0200.png");
}

-環(huán)境 ambient

//添加方向光（燈光色會與材質(zhì)色融合，因此改燈光色為黑白灰色，且不能曝光過度）
var directionLight = scene.addChild(new Laya.DirectionLight());
directionLight.ambientColor = new Laya.Vector3(0.5, 0.5, 0.5);
directionLight.specularColor = new Laya.Vector3(0, 0, 0);
directionLight.diffuseColor = new Laya.Vector3(1, 1, 1);
directionLight.direction = new Laya.Vector3(0.5, -1, 0);    
//創(chuàng)建標(biāo)準(zhǔn)材質(zhì)
var material = new Laya.StandardMaterial();
//創(chuàng)建漫反射二維紋理貼圖
material.diffuseTexture = Laya.Texture2D.load("res/layabox.png");
//設(shè)置環(huán)境色，提亮模型
material.ambientColor =new Laya.Vector3(2,2,2);
//為box模型賦材質(zhì)
box.meshRender.material = material;

-反射 reflect

//添加方向光
var directionLight = scene.addChild(new Laya.DirectionLight());
directionLight.ambientColor = new Laya.Vector3(0.5, 0.5, 0.5);
directionLight.specularColor = new Laya.Vector3(0.5, 0.5, 0.5);//為球體增加高光
directionLight.diffuseColor = new Laya.Vector3(1, 1, 1);
directionLight.direction = new Laya.Vector3(0.5, -1, 0);    
//添加自定義模型
var sphere = scene.addChild(new Laya.MeshSprite3D(new Laya.SphereMesh()));
sphere.transform.rotate(new Laya.Vector3(0,45,0),false,false);
//創(chuàng)建標(biāo)準(zhǔn)材質(zhì)
var material = new Laya.StandardMaterial();
//創(chuàng)建漫反射二維紋理貼圖
material.diffuseTexture = Laya.Texture2D.load("res/layabox.png");
//降低反射率，加強(qiáng)反射貼圖反射
material.albedo = new Laya.Vector4(0.2,0.2,0.2,0);
//設(shè)置渲染模式為雙面不透明(否者無法顯示反射貼圖)
material.renderMode = Laya.StandardMaterial.RENDERMODE_OPAQUEDOUBLEFACE;
//創(chuàng)建反射貼圖，用立方體全視角貼圖進(jìn)行賦值（類似于360全景包裹）
material.reflectTexture = Laya.TextureCube.load("skyBox/skyCube.ltc");
//為球型模型賦材質(zhì)
sphere.meshRender.material = material;
  • 法線凹凸貼圖

法線貼圖對模型數(shù)據(jù)有一定的要求，如果模型上沒有切線信息將無法產(chǎn)生法線凹凸的效果。例如LayaAir 3D引擎中自帶的各種Mesh網(wǎng)格類型BoxMesh、SphereMesh、CylinderMesh等是沒有切線信息的，即使使用了法線貼圖也不會在視圖中顯示出凹凸。

如果需要使用法線貼圖，且模型是通過LayaAir的unity插件中導(dǎo)出，在Mesh Setting網(wǎng)格設(shè)置時(shí)需要注意不能勾選“忽略切線”選項(xiàng)

如果需要使用法線貼圖，游戲場景中必須使用燈光，否則模型上也不會產(chǎn)生凹凸效果

//添加方向光
var directionLight = scene.addChild(new Laya.DirectionLight());
directionLight.ambientColor = new Laya.Vector3(0.5, 0.5, 0.5);
directionLight.specularColor = new Laya.Vector3(0.5, 0.5, 0.5);//為球體增加高光
directionLight.diffuseColor = new Laya.Vector3(1, 1, 1);
directionLight.direction = new Laya.Vector3(0.5, -1, 0);    
//創(chuàng)建unity中導(dǎo)出的模型
this.box = Laya.Sprite3D.load("layaScene_box/box.lh");
//模型與材質(zhì)加載完成事件監(jiān)聽
box.on(Laya.Event.HIERARCHY_LOADED,this,onLoadComplete);
//也可以代碼加載法線貼圖
//加載到場景中
scene.addChild(this.box);
/** 模型與材質(zhì)加載完成后回調(diào)***/        
function onLoadComplete()
{
  //也可以代碼加載法線貼圖
  //從模型中獲取meshSprite3D對像
  //var meshSprite3D = this.box.getChildAt(0);
  //獲取模型的材質(zhì)實(shí)例
  //var material = meshSprite3D.meshRender.material;
  //為材質(zhì)添加法線貼圖
  //material.normalTexture = Laya.Texture2D.load("layaScene_box/Assets/texture/layabox_normal.png");
}
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 111. [動畫系統(tǒng)]如何將其他類型的動畫轉(zhuǎn)換成關(guān)鍵幀動畫？ 動畫->點(diǎn)緩存->關(guān)鍵幀 112. [動畫]Unit...
    胤醚貔貅閱讀 13,524評論 3贊 88
  • 我們都知道，一個(gè)三維場景的畫面的好壞，百分之四十取決于模型，百分之六十取決于貼圖，可見貼圖在畫面中所占的重要性。在...
    自由的天空閱讀 12,924評論 0贊 12
  • 更新：【面試題含答案】http://bbs.9ria.com/thread-288394-1-1.html 高頻問...
    好怕怕閱讀 5,086評論 3贊 53
  • 在新一階段的寫作中，我寫下了這三個(gè)目標(biāo)：思考、踐行、改變。 都說輸出倒逼輸入，寫作的過程中，必然需要閱讀、聽書或?qū)W...
    ef0b06719d1c閱讀 262評論 0贊 3
  • 一瞬而逝的煙火 像大海中的水滴 在星空璀璨的銀河 可是它盛開時(shí) 卻綻放絢麗的花 高唱嘹亮的歌
    說劍師閱讀 453評論 0贊 4

友情鏈接更多精彩內(nèi)容