IDE
千万不要在src/ui下写任何js类, 它会莫名其妙的消失
src/ui目录是界面编辑器动态生成所需要的目录, 自己写的什么都不能放进去
打包时错误
把错误文本复制出来查看问题
在这里我的js删除了, 但是bin下的index.html并没有删除对应js导致的, 删了即可
打包文件大小
虽然整个打包目录很大, 但是真正需要的文件并不多
2d部分
屏幕尺寸
设备像素分辨率:Laya.Browser.clientWidth，Laya.Browser.clientHeight;
设备物理分辨率：Laya.Browser.width，Laya.Browser.height;
像素比：Laya.Browser.pixelRatio;
自适应屏幕并不好用
还要自己去对应window.outterWidth/Height去算, 然后缩放scaleX/Y和移动位置来调整
创建ui搭建
- 背景参考图虽然可选(不发布), 但是搭建快速尽量勾选
- 宽高一定要设置为参考值, 否则无法自适应屏幕
- 搭建好一定要发布
加载ui布局
-
发布的布局根据是否打包资源分别在不同的部分
- 不打包的文件会从 laya/assets/ 拷贝到 bin/ 目录
- 打包的文件从 laya/assets/
-
发布的场景变成js代码在 layaUI.max.all.js 中
- 所有场景名都在这一个文件内
在主代码下输入
Laya.stage.addChild(new MenuUI());
你会发现, 未压缩的背景会加载, 但是打包的图集中的元素和按钮没有加载成功, 这是因为atlas加载不是自动的, 需要这样写
Laya.loader.create("res/atlas/simbols.atlas",Laya.Handler.create(this,function(){
Laya.stage.addChild(new MenuUI());
}));
让场景永远悬浮logo
//创建二级容器
var SceneMajor = Laya.stage.addChild(new Laya.View());
//再加载logo
Laya.stage.addChild(new LogoUI());
//这样更改SceneMajor容器即可
按钮交互
- 设计器里面输入按钮变量名称 (var 设置为 btSth)
- 获取当前创建的UI对象
var logo = Laya.stage.addChild(new LogoUI());
- 获取按钮的变量
var btSth = logo.btSth;
- 给按钮增加点击事件
btSth.on('click', this, function(){
window.location.reload();
});
ui编辑器不支持texture透明
本来想设置个半透明背景
- 放上rect 设置大小后发现没有透明度选项
- 放上texture将100x100大小的图片放上去拉满全屏, 设置透明度, ui表现不错, 运行时不支持
- 只能做个png半透明背景, 然后直接放上去, 局限性很大, 但是还算管用
官方说套个容器设置容器透明度可以解决
3d部分
设置位置
box.transform.position = new Laya.Vector3(0,1,1);
正交相机
正确的写法
camera.orthographic = true;
camera.orthographicVerticalSize = 7;
错误的官方教程 (官方回复留言很理直气壮的贴了错误的代码)
camera.orthographicProjection = true;
创建简单建模注意
第二位居然是z.....但是后面移动的时候, 第二位参数居然是控制纵向的
new Laya.BoxMesh(1, 1, 1);
box.transform.position = new Laya.Vector3(0,1,0);
官方并不推荐用tween来修改位置点
但是依旧可以实现, 因为position在transform中是个数值变量, 它如果被临时赋给其他变量, 指向的只是这个position值, 而不是transform的变化量, 也就导致了无法直接对3d物体这样处理. 不过无妨, 只要知道原理就很简单实现效果
box.potOld = box.transform.position;
Laya.Tween.to(box.potOld,{
x:1
,y:2
,update:new Laya.Handler(box,function(){
this.transform.position = this.potOld;
})
}, ConstValue.animationTime,Laya.Ease.elasticOut,Laya.Handler.create(this, function(){
console.log("complete");
}),ConstValue.animationDelay);
设置个临变量, 整个过程tween只负责更改这个变量值, 而同步更新放在update中即可
阴影投影bug
当你选择好Laya并开始开发时候发现头痛的事情出现了, 阴影诡异的有时候有有时候没有, 这样导致的问题还挺大的, 怎么解决呢?
阴影和资源尺寸, 资源格式没太大关系, 和光源配置, 镜头也关系不大, 毕竟这些该处理的都处理了
结果发现阴影的投递跟创建物有关, 如果A想投到B上, A必须在B之后创建, 全部统一初始化创建避免了这个问题, 然而发现如果有多个B, 并动态删除, 那么动态阴影还是会有问题.......
也就是说, 如果你想整个过程顺利执行投影, 那么你对这群AB模块一个都不要动,创建完毕后就好好的摆他们的位置, 贴图, 不要做创建和删除的事情
代码
CylinderMesh如果创建奇数面圆面和柱面接合会对不上，发现是顶部圆面以外，其他位置都加了PI旋转了180，这样非对称的奇数面时会出现建模奇怪的问题