将UI界面上所有组件的属性、界面布局等逻辑与界面内容分离开,分离模式也是导出为json格式,但有所区别的是分离模式会将每一个页面独立导出,会产生多个j...
Laya 缩放功能的实现 在 laya 中实现滚轮对选中对象的缩放,涉及到以下两个模块: 事件 容器坐标 1. 事件 在 Laya 中, Event 是事件类型的集合。..._rootSp); // 在 mouse_down 事件后才绑定事件 private MouseDown(sp:Laya.Sprite, e:Laya.Event) { Laya.stage.on...(Laya.Event.MOUSE_MOVE, this, this.MouseMove, [sp]) Laya.stage.on(Laya.Event.MOUSE_UP, this, this.MouseUp...private MouseUp(sp:Laya.Sprite, e:Laya.Event) { Laya.stage.off(Laya.Event.MOUSE_MOVE, this, this.MouseMove...) Laya.stage.off(Laya.Event.MOUSE_UP, this, this.MouseUp) } 1.3 可点击区域的设置 容器要触发交互事件,必须设置可点击区域 /
nav=zh-js-1-0-0,不过这个里面说的hin多hin杂,在这里简单说重点: 项目运行配置文件(.laya文件夹)。...开发入门 舞台搭建与适配 开发目录下新建的main.js文件全部代码删除,然后不用管它,接下来: GameMain.js: export class GameMain { constructor.../base/GameMain.js' import {ResLoader} from './utils/ResLoader.js' import {MainBoard} from "....做完之后按f12发布,就会发布到src/ui下面的layaUI.max.all.js里面。...nav=zh-js-2-1-10。 这一入门部分也就告一段落,基本上可自己写出一个demo。下一篇准备讲讲使用laya的API以及其中遇到的巨坑。
如果你的AS项目是2.2.0 IDE版本之前创建的,需要打开.laya/compile.js ,搜一下asconfig.json;在其后增加配置参数outlaya=true;如下图所示。 ?...LayaAir 1.x引擎 包括的库为: laya.ani.min.js laya.core.min.js laya.d3.min.js laya.d3Plugin.min.js laya.device.min.js...laya.filter.min.js laya.html.min.js laya.particle.min.js laya.pathfinding.min.js laya.tiledmap.min.js...laya.ui.min.js laya.webgl.min.js laya.wxmini.min.js LayaAir 2.x引擎 包括的库为: laya.ani.js laya.core.js laya.d3....js laya.html.js laya.particle.js laya.ui.js laya.webgl.js //仅在LayaAir2.1.0之前的版本存在 laya.d3Plugin.js//
“laya.js.exe”为AS3代码编译器,用于将AS3代码编译为JS代码。 “playerglobal.swc”用于替换AS3原生编译器SDK,去除原生API语法提示。...1.4 安装Google Chrome浏览器 使用Laya.js.exe进行代码编译后,默认调用Chrome浏览器打开运行,因此,建议安装此浏览器进行项目调试。...第二节 配置FlashDevelop编译环境 要想使用AS3作为HTML5的开发语言,需要通过laya.js.exe编译器将AS3代码编译为JS代码才可以运行。...Entries”栏的右侧位置点击“...”操作区域,打开“字符串集合编辑器”窗口,输入宏指令: SaveAllModified RunProcessCaptured|D:\LayaBox\LayaAir\laya.js.exe...(Tips:”D:\LayaBox\LayaAir\laya.js.exe“应为laya.js.exe的实际所在路径) 步骤四:点击”确定“完成宏指令配置后,已经完成宏命令“LayaJsCompiler
--jsfile--Main--> js/GameMain.js"> 在index.html里,提供了很多Laya的类库,这些类库,最终会被打包成合并一个code.js....Laya的性能优化 8.1 性能监测工具 Laya已经内置了性能监测工具,只要初始化后执行Laya.Stat.show();就可以打开 constructor() { //TS或JS...而且我们发现laya把我们刚才写的代码,和Laya的核心库一起,都被打包成一个code.js了。 ? [ 微信开发者工具 ] 10....开发环境兼容 可是,作为微信环境下的游戏,因为code.js是laya自动生成的,我们开发还是必须在laya的开发环境下,但是laya并不支持微信的接口调试,那我们可以在Laya里判断开发环境吗?
最近在学习视频上学习小游戏的开发,下面介绍的篮球小游戏是用unity、laya和微信开发者工具开发的。本次文章将分享关于该小游戏项目的创建。...在下载laya开发工具的时候要把laya for unity插件一起下好。 ?...图2 (3)导入laya for unity 插件,将下载好的插件直接拖到unity的文件管理区域。 ?...图3 2创建laya项目 (1)创建layaAir空白项目,一般选择空白项目减少一些不必要的东西。 ? 图4 (2)在编辑模式中新建一个场景,按F9进行预览适配设置,固定高度设计宽度和高度。...导入3D微信小游戏需要的类库(laya.d3.js和laya.physics3D.js)。 ? 图5 ? 图6 ?
重装完系统后,打开Laya IDE,当我切换到场景编辑器的时候,弹出错误框让我备受煎熬。 我一遍心里骂娘一遍给Laya社区BBS发帖求助,也没有人回音。...在文件LayaAirIDE\resources\app\out\vs\layaEditor\h5\renders\uiviewer\editor.max.js 的88880行 if (!...WebGL.enable()){ alert("Laya3D init error,must support webGL!")...我把代码放到一个页面里面,失败,很显然这个貌似是electron的代码,于是我根据package.json中的入口js找到resources/app/out/main.js,把代码插入其中 init...基于Electron开发的软件会有想不到的坑,也因为可以修改软件代码来解决,js真是好用!
作者|王小强 来源|https://my.oschina.net/wxqdoit 本文以切入源码的方式讲解laya核心API的使用以及需要注意的点。...Node(节点)操作 大部分的laya UI组件都可以看做节点,可以看做web开发中,使用JavaScript对html节点进行操作。...destroy对象默认会把自己从父节点移除,并且清理自身引用关系,等待js自动垃圾回收机制回收。destroy后不能再使用。...*/ static MOUSE_OVER: string; 具体可以查看layaAir.d.ts laya.events模块,大概在17316行..........category=Core&class=laya.utils.Ease 缓动动画演示传送门:https://layaair.ldc.layabox.com/demo/?
版本初始化: //TS或JS版本初始化微信小游戏的适配 Laya.MiniAdpter.init(); //初始化引擎 Laya.init(1136,640); 小游戏创建篇 一、准备好开发环境 1、下载并安装.../libs/min/laya.core.min.js"); require("./libs/min/laya.wxmini.min.js"); require("..../libs/min/laya.webgl.min.js"); require("./libs/min/laya.ui.min.js"); require("..../libs/min/laya.wxmini.min.js"); require("./libs/min/laya.webgl.min.js"); require("..../libs/min/laya.ui.min.js"); require("./js/ui/layaUI.max.all.js"); require(".
(0,0); //TS与JS通用写法 Laya.Stat.show(0,0); //JS的面板调用写法 性能统计面板的参数 LayaAir引擎支持Canvas渲染模式与WebGL渲染模式...Laya.init(550, 400,Laya.WebGL); Laya.stage.scaleMode = Laya.Stage.SCALE_SHOWALL; Laya.Stat.show();...Laya.init(550, 400,Laya.WebGL); Laya.stage.scaleMode = Laya.Stage.SCALE_SHOWALL; Laya.Stat.show(); var...textBox = new Laya.Sprite(); // 5000个随机摆放的文本 var text; for (var i = 0; i < 8000; i++) { text = new Laya.Text...arr.length;这样能减少属性查询及计算开销 19、使用Text类的changeText方法更改文本,可以减少排版消耗,对于不需要更改排版信息的内容更改,建议使用此方法修改内容; 20、多学习js
IDE是引擎推荐编辑器,感觉跟VSCode很相似,包含整个游戏制作流程的便利功能,包括: 代码开发 UI编辑器 粒子编辑器 时间轴动画 场景编辑器 3D支持 脚本扩展 预设 APP打包 Flash发布 JS...= "#ffffff"; Laya.stage.addChild(txt); 利用Laya.init(width,height)创建舞台或者说画板,参数是舞台的宽高度,然后构建文本对象,设置对象属性...从文本创建我们可以看到,我们将舞台构建后,可以任意的想舞台上添加我们构建好的元素,让我在JS开发中有了一种面向对象开发的感觉。...(function() { var Sprite = Laya.Sprite; var Stage = Laya.Stage; var WebGL = Laya.WebGL;...在代码中通过laya.display.Animation类加载。 缓动动画:利用Laya.Tween去加载缓动动画,常用语游戏中道具放入背包,对话框弹出关闭等,提升游戏UI体验的重要因素之一。
对于小游戏而言目前常用的引擎有Cocos、Egret和Laya,小游戏相对于常规游戏app而言,测试内容和测试压力并没有减少。...然而目前针对小游戏的测试工具还未成熟,更还没有完善的自动化测试工具,于是我们开始针对常用的Laya引擎进行了自动化测试工具的开发。...小游戏一般使用JS、TS和AS,实际运行时是编译成JS运行,JavaScript函数劫持,也就是 hook技术。...关于性能抓取部分,Laya引擎给我们提供了便利,通过Laya.Stat.enable()函数可以开启性能统计,我们可以抓取到引擎的FPS、已加载的内存、drawCall、三角面数等相关性能参数,将这些性能参数保存在本地或者上传服务器均可
private MouseWheel(e: Laya.Event) { console.log("event"); let currentSp = e.target...as Laya.Sprite; let parentSp = currentSp.parent as Laya.Sprite; console.log("before scale...this.Zoom(currentSp, parentSp.mouseX, parentSp.mouseY, e.delta); } private Zoom(sp: Laya.Sprite
当然,LayaAir引擎也支持使用比较轻量的Cannon.js物理引擎的基础功能。...那或许Cannon.js可以考虑。...5.1 如何切换使用Cannon.js物理引擎库 如果想使用Cannon.js物理引擎库,要引入物理引擎库cannon.js以及LayaAir引擎封装的物理API库laya.cannonPhysics.js...引用了cannon.js与laya.cannonPhysics.js引擎库后,就可以直接使用Cannon.js物理引擎的API了。...毕竟Cannon.js物理引擎与Bullet物理引擎本身存在差异,以及对于Cannon.js的基础物理功能使用的定位,Bullet中有很多API,在Cannon.js中是没有的。
经过易用性、上手成本的考虑,最终决定用 laya 进行开发。...laya 写一份代码可同时支持安卓/IOS/H5/微信小游戏,更满足当前开发时间有限、平台暂未确定的情况,用 JavaScript/TypeScript 开发也更容易上手。...(注:并不是说 laya 就是最好的选择,日常开发还要考虑配套工具的完整性、平台迁移难度、社区活跃度等因素) 三、整体架构 接着是分析整个游戏的架构、确定技术选型等事项。...这里客户端选择了用 laya 引擎 js 语言去开发,服务端就选择了同一技术栈下的 nodejs 来开发,节约学习成本。...3.3 技术选型 最终决定: 客户端这边开发语言 js,引擎选择 laya,通信协议用 protobuf 服务端选择 nodejs,语言 js,同步方式用帧同步,协议pb PS: 之所以单独用一篇文章单独分析决定技术选型的过程
看了一下原文:https://medium.com/swlh/deploy-wiki-js-on-kubernetes-686cec78b29还是看原文吧!简单作一个wiki跑一下!...编写生成deployment配置文件 https://medium.com/swlh/deploy-wiki-js-on-kubernetes-686cec78b29这篇文章比较古老首先apiVersion...@iZ2zeasfsez3jz7eu7iuh2Z wiki# cat wiki.yaml apiVersion: apps/v1 kind: Deployment metadata: name: laya-wiki...template: metadata: labels: app: laya-wiki spec: containers: -...[root@iZ2zeasfsez3jz7eu7iuh2Z wiki]# kubectl apply -f wiki.yaml deployment.apps/laya-wiki created [root
坐标系基本概念 直角坐标系可分为左手坐标系与右手坐标系,cad 中用到的是右手坐标系, Laya2D 中用到的是左手坐标系, Laya3D 中使用右手坐标系。...在 Laya 中显示 cad 坐标对象 基本原则:不改变数据坐标,改变Laya 容器坐标。...保持根容器不变,变换子容器坐标原点位置 缩放子容器坐标比例 // 例如,我们 Laya 容器坐标系位置变换为屏幕左下角开始的右手坐标系 let drawingSp = new Laya.Sprite()...将 drawingSp 加入根容器 Laya.stage.addChild(rootSp); 通过上面的变换处理,将 drawingSp 中的坐标系改为原点为平面左下方的右手坐标系。...坐标系处理,对子容器 viewSp 处理 let viewSp = new Laya.sprite(); // sp 坐标移动到左下角,并给一定的偏移 viewSp.pos(xoffset, Laya.Browser.Height
01 废除Canvas API的兼容 LayaAir 2.1.0 beta版本开始废除了Canvas模式的支持,TS与JS版本的webgl库laya.webgl.js与滤镜laya.filter.js都合并到...laya.core.js内。
具体编写代码如下例所示: Stat.show(0,0); //AS3的面板调用写法 Laya.Stat.show(0,0); //TS与JS的面板调用写法...(asset)); Laya.loader.clearRes(asset); console.log(Laya.loader.getRes(asset)); }...下例绘制10000个文本: Laya.init(550, 400, Laya.WebGL); Laya.Stat.show(); var textBox = new Laya.Sprite(); var...Laya.timer.frameLoop执行频率依赖于帧频率,可通过Stat.FPS查看当前帧频。 2. Laya.timer.loop执行频率依赖于参数指定时间。...(sp); Laya.stage.on(Event.MOUSE_MOVE, this, function() { sp.pos(Laya.stage.mouseX, Laya.stage.mouseY
领取专属 10元无门槛券
手把手带您无忧上云