• 微信公众号:美女很有趣。 工作之余,放松一下,关注即送10G+美女照片!

Laya2学习笔记

开发技术 开发技术 2周前 (05-02) 7次浏览

现在要进入laya1的网站用地址进入:https://ldc.layabox.com/
开发笔记
facebook小游戏
Facebook、Instagram、WhatsApp、Messenger这4个Apps同属Facebook公司旗下产品
https://www.jianshu.com/p/1fc08cacf433?utm_campaign=maleskine&utm_content=note&utm_medium=seo_notes&utm_source=recommendation
Laya2.x游戏引擎入门系列(二):UI界面开发
https://segmentfault.com/a/1190000022465022
https://www.bilibili.com/video/BV1p7411K7x5/?spm_id_from=333.788.recommend_more_video.7
layabox2.0基础视频学习
https://www.bilibili.com/video/BV1sb411G7gm?from=search&seid=11158853386930538822
laya2,vscode工作流配置
https://www.jianshu.com/p/e600b4a9763c
让Chrome启动时默认打开开发者工具以及手机模拟工具的参数或命令是什么?
https://www.zhihu.com/question/29831053
vscode里的launch.json里配置打开就是开发工具
“runtimeExecutable”: “C:/Program Files/Google/Chrome Dev/Application/chrome.exe”,
“runtimeArgs”: [
“–allow-file-access-from-files”,
“–disable-web-security”,
“–auto-open-devtools-for-tabs”
],
必须要先使用LayaAirIDE的编译(F8),编译生成运行代码后,才能使用VSCode里的F5断点调试。

**1.**
世界坐标系是左上角,图片,文本等锚点默认是左上角
场景的原点(锚点)也是左上角0,0处,原点和锚点是一个东西,原点以像素为单位,锚点是比例
节点的x,y坐标是相对于父节点的左上角的
都是设置锚点,只是两种方式而已
pivotX,pivotY:以像素为单位
scaleX,scaleY:以0,1为单位 左上角为0,0,右下角为1,1,中心点为0.5,0.5
父结点锚点的变化,孩子的位置还是相对于其左上角
属性面板的visiable是运行时可见不可见,层级面板的眼睛只是适用于层级那

**2.**
组件化开发,可以挂一个脚本到节点上,编辑器会new一个脚本实例到节点上
挂脚本的原则:
1.脚本控制哪个节点就挂哪个
2.如果是全局的管理类,就挂根节点
脚本生命周期://执行顺序 onAwake,onEnable,onStart,onUpdate,onLateUpdate
后两个一直执行,每帧都执行

**3.**
ES6新特性
export/import导出和导入 我们的代码模块
widget只是给定位的工具

**脚本生命周期.**
onAwake->onEnable->onStart->onUpdate->onDisable->onDestroy
被removechild,重新addChild之后只有onEnable,onDisable重新调用了。
onEnable:被addChild会被调用
onDisable:被removeChild会被调用
onAwake和onStart都是只执行一次

**4.** laya2的屏幕适配
场景下添加一个widget组件,左右上下都设置成0,舞台和场景就融合为一体,同宽高了

**5.** laya内嵌模式,加载模式,分离模式,文件模式(默认)
https://blog.csdn.net/qq_38721111/article/details/108367999
https://blog.csdn.net/qq_38721111/article/details/108367999
https://blog.csdn.net/weixin_41640571/article/details/110821564
1导出类型默认采用的是内嵌模式,该模式导出时会将页面的配置信息导出为项目代码文件。
2采用加载模式,会将所有页面的配置信息导出为json格式的一个文件。
3分离模式也是导出为json格式,但有所区别的是分离模式会将每一个页面独立导出,
会产生多个json文件。

1.内嵌模式,是会把页面描述信息写到类里面
2.加载模式,会把页面描述信息发布到UI.JSON里面,类里面就没有了,如果只是在IDE更改布局,修改属性,无需编译程序,到处新的ui.JSON,刷新即可看到效果,还可以自己加密这个ui.json
3.分离模式,是2的变种,是把每个页面的信息单独保持,使用也许单独加载,这样能保证,页面不被打开的时候,不去加载这个UI文件,从而节省内存

加载模式和分离模式需要自己预加载
Laya2.0新版做了自动加载优化,将来可能不需要自己加载,引擎自动去加载

现在我们知道了4种模式的区别。那么实际项目如何使用
内嵌模式:场景数据放在bundle.js里,占用了宝贵的初始包资源

加载模式:和白鹭的default.thm.json一样,将所有场景数据都放在里面一次性加载。场景数据不多时,可以考虑使用,毕竟只加载一次,减少了多场景多json的请求。
文件模式:不自动生成场景类,不太方便使用。
分离模式:将场景数据分成多个json,在使用时才去加载,减少了用户初次进入游戏的等待时间。

发布模式有文件模式,内嵌模式,加载模式,分离模式。 默认是文件模式。
这些模式的区别就是我的场景UI数据究竟放哪里。

**6.** 屏幕自适应之 widget组件
//舞台的宽高是一直充满屏幕的
onStageClick(e:Laya.Event):void{
console.log(e.stageX,e.stageY);
}
//场景的宽高是设计分辨率,想让它充满屏幕需要加一个widget组件
//不加的话,超过边界的点击无效
onClick(e:Laya.Event):void{
console.log(e.stageX,e.stageY);
}
**6.**
TS版本寻路算法
https://www.cnblogs.com/gamedaybyday/p/7778995.html

LayaAir之引入模块(module)编程方案
https://blog.csdn.net/weixin_34024034/article/details/91701945

1. import * as xxx from ‘xxx’ 会将 “xxx” 中所有 export 导出的内容组合成一个对象返回(或import * as obj from ‘xx’ 这种写法是把所有的输出包裹到obj对象里);
2. 那不带*as(即import xxx from ‘xxx’)
import * as xxx from ‘xxx’: 会将若干export导出的内容组合成一个对象返回;
import xxx from ‘xxx’:(export default Din)只会导出这个默认的对象作为一个对象

**Laya使用VSCODE调试****
彻底告别IDE切换
vscode F5不能直接打开h5网页调试问题
Laya踩坑003_所谓的vsCode调试/f5调试
https://www.jianshu.com/p/f596c0928a41
https://blog.csdn.net/u012336081/article/details/110994443
LayaAirIDE剥离VSCode后,不再支持IDE内断点调试,只能是Chrome调试器中断点。

F5 VSCODE调试开启
1、修改 .laya/compile.js
找到sourceMap: false 修改为 sourcemap: true
一共有两个sourcemap的地方,都要修改设置为true 。
2、修改 .vscode/launch.json
找到”sourceMaps”: false, 修改为 “sourceMaps”: true,
这里也有两处,一处是layaAir调试,一处是chrome调试。
3、修改 工程目录/tsconfig.json
在compilerOptions下增加 “sourceMap”:true
4、不过这样src下的每一个ts文件都会生成一个js和一个js.map文件,得排除它
点击VSCODE 左下角的设置搜索 file exclude 添加排除模式为:src/**/*.js,src/**/*.js.map

 


程序员灯塔
转载请注明原文链接:Laya2学习笔记
喜欢 (0)