淘宝小程序游戏迁移Laya引擎

1. 目录结构

bin —— 当前项目的输出文件
laya —— 存放UI项目
- assets —— 图片，音频资源目录
- pages —— .scene 场景文件 key-value 格式
libs —— 项目库目录
release —— 发布目录
src —— 源代码目录
- Main.ts —— 项目入口
- GameConfig.ts —— 引擎配置
- script —— 游戏控制脚本目录

2. 接入淘宝小程序

淘宝官方文档：接入LayaAir引擎

步骤：

下载LayaAir IDE

发布时选择“淘宝创意互动”

用淘宝小程序IDE打开

3. 分步分解开发流程

官方文档

3.1 Laya引擎运行过程

项目入口Main.ts，初始化引擎

加载scene

生成节点树

实例化节点组件，挂载脚本

调用各种脚本方法

3.2 开发流程

配置引擎

新建场景

往场景中添加节点

新建控制脚本

节点挂载控制脚本

3.3 新建场景的方式

用IDE的方式
点击编辑模式 => 右键点击Scenes => 新建 => 页面/场景

代码方式
a：在laya/pages目录下，编写.scene文件
b：参考API文档 Laya.display.Scene，在Main.ts中加入Scene类实例

3.4 添加节点

用IDE的方式
进入编辑模式，直接将左侧的节点模板拖入scene中，这种方式适合添加静态节点，添加的节点会写在laya/pages目录下，你添加节点的那个scene文件里面

代码方式
a：在控制脚本中,用addChild( )添加
Laya.stage.addChild(new Laya.Sprite());
b：在laya/pages目录下，对应scene文件下，手动写配置

3.5 新建控制脚本

用IDE的方式
点击编辑模式 => 右键点击Scripts => 新建脚本文件

代码方式
新建一个脚本文件，继承Laya.Script类
在GameConfig.ts中注册这个脚本类

// GameControl.tsexport default class GameControl extends Laya.Script {constructor() {super();}// 初始化的时候执行，仅执行一次onAwake(): void {}onEnable(): void {}onDisable(): void {}
}// GameConfig.tsexport default class GameConfig{static width:number=750;static height:number=1334;static scaleMode:string="fixedauto";static screenMode:string="none";static alignV:string="top";static alignH:string="left";static startScene:any="1.scene";static sceneRoot:string="";static debug:boolean=false;static stat:boolean=false;static physicsDebug:boolean=false;static exportSceneToJson:boolean=true;constructor(){}static init(){var reg: Function = Laya.ClassUtils.regClass;// 在这里注册reg("script/GameControl.ts",GameControl);}
}
GameConfig.init();

3.6 节点挂载控制脚本

IDE方式
选择一个场景 => 左下角点层级 => 选择需要添加脚本的节点 => 右下角点添加 => code

代码方式

this.owner.addChild(new Script());

3.7 对于节点树的操作

对于某个被挂载的脚本来说 this.owener 就是它所挂载节点
this.owener.scene 就是这个节点所在的场景
this.owener.perant 节点的父节点
this.owener.scene.getChildByName() 取该节点所在场景的某个子节点
this.owener.scene.getChildren() 该节点所在场景的所有子节点，返回数组

淘宝小程序游戏迁移Laya引擎相关推荐

淘宝小程序还可以这么玩！私域互动实践总结
简介:小程序创意互动项目,作为淘宝购物小程序全面提升消费体验和满足商家个性化运营的重点项目之一,从 2020 年 3 月底正式 KO 到今年双11,已经经历了多次迭代.在购物小程序技术.产品.运营团队 ...
淘宝小程序体验优化：数据分析和优化实践
作者:莫绪旻(向屿) 淘宝小程序已经走过若干个双十一,淘宝开放业务有序铺开.体验优化是个老生常谈的话题,如何让小程序跑得又稳又快,成了我们最大的挑战之一. 写在前面如何定义好的体验过去我们定义这个 ...
淘宝小程序（商家应用）开发提前需要了解的一些概念
规定:淘宝小程序即淘宝商家应用.下文中只称作淘宝小程序,二者概念一致. 一:概念和业务场景概念: 因为淘宝小程序是从支付宝小程序迁移过来的.用的同一套框架.所以你需要先通读一遍商家应用文档(淘宝小程 ...
哔哩哔哩淘宝小程序盲盒抽奖实践
目录背景名词解释整体业务流程技术实现调用链路云开发( Serverless ) 云开发的限制编写云函数怎么拿到授权查询轻店铺用户订单轻店铺云网关数字签名网关网关技术选型 Vert ...
超详细淘宝小程序的接入开发步骤
本文是向大家介绍的关于工作中遇到的如何对接淘宝小程序开发的步骤,它能够帮助大家省略在和淘宝侧对接沟通过程中的一些繁琐问题,便捷大家直接快速开展工作~~ 一.步骤演示 1.首先我们打开淘宝开放平台,进入 ...
淘宝小程序的坑（持续更新）
1. 淘宝小程序 ui 组件更新缓慢(基本不更新) form组件 onFormChange 当formItem field 没有值的时候返回对应的name 为空 tab 返回的index 会加上 ...
“淘宝小程序“ 九宫格抽奖功能
淘宝小程序的九宫格抽奖功能,同理功能代码可根据指定小程序规则调整事件,此逻辑可适配所有小程序功能开发. 效果图: index.axml  <view cl ...
淘宝小程序九宫格抽奖
淘宝小程序的九宫格抽奖功能,同理功能代码可根据指定小程序规则调整事件,此逻辑可适配所有小程序功能开发. 效果图: index.axml  <view cl ...
淘宝小程序表单组件checkbox的默认样式修改
场景每款产品都会有自己的定制化UI,这两天遇到的问题就是设计稿的复选框样式问题.自己试了很多种方法都没成功,百度查找资料或者相关代码,检索出来的都是与微信小程序相关的. 无奈之下,我在淘宝开放平台提 ...

淘宝小程序游戏迁移Laya引擎

淘宝小程序游戏迁移Laya引擎

1. 目录结构

2. 接入淘宝小程序

3. 分步分解开发流程

3.1 Laya引擎运行过程

3.2 开发流程

3.3 新建场景的方式

3.4 添加节点

3.5 新建控制脚本

3.6 节点挂载控制脚本

3.7 对于节点树的操作

淘宝小程序游戏迁移Laya引擎相关推荐

最新文章

热门文章