Laya3.0 入门教程

在这里插入图片描述
点击play箭头

点击右边的开发者工具
就会弹出 chrome的调试窗口
然后定位到你自己的ts文件直接在ts里断点即可不需要js文件

如何自动生成代码？
比如你打开一个新项目
里面显示的是当前场景
只需要点击
在这里插入图片描述
UI运行时 右边的框就可以了
他会自动弹窗提示你创建一个文本文件
然后在 onAwake 里写代码
好你需要场景里有一个按钮
拖一个进去
然后勾选

定义变量即可

这个时候你会发现代码里可以直接点出来了
如何代码加载并显示这个预制体dialog呢？
直接上代码

Laya.loader.load("Prefab2D1.lh").then(res => {
    
    
     let dialog: Laya.Dialog = res.create();
     dialog.open(); 
});

和以前比：优点
打开窗口后可以在层级窗口看到具体的显示层级非常方便调试
这一点和unity是一样的
在这里插入图片描述
并且可以实时更改

做过unity的同学都知道可以在脚本里声明属性然后在ide里拖拽进去
在这里插入图片描述
laya默认运行时是不支持这个属性的
但是

可以添加自定义脚本

在这里插入图片描述
代码如下

@regClass()
export class NewScript extends Laya.Script {
    
    
    @property(String)
    public textaaaaaaaaaa: string = "";

    @property(Laya.Button)
    public Btn!: Laya.Button;

在这里插入图片描述

图集

本地调试的时候是不会加载图集的
必须发布好以后才可以
在这里插入图片描述
导入进去的图片资源必须点击图片然后设置为精灵纹理
这样发布的时候才会自动打包

你也可以一次选中多个然后统一更改右边会提示你选中了多少个
记得点一下应用

关于动画
laya3.0的动画系统和unity是一样的
也是一个controller 上面添加动画文件
在这里插入图片描述
使用过unity的同学会非常方便

给没接触过unity的同学解释一下就是
你想象有一个角色
他有各种各样的动作
并且动作之间有各种逻辑
这一整套都被一个controller来管理
这个controller可以添加任意动画
在这里插入图片描述
直接添加组件Animator2d即可

如果你自己创建的脚本你想获得添加这个脚本的对象咋办？
使用
this.owner 即可

这个owner 可能是Laya.Sprite 也可能是Laya.Sprite3D
只需要在下面声明对应的即可
这样代码提示更准确
declare owner : Laya.Sprite3D;
declare owner: Laya.Sprite;

脚本有几个区别要注意
1
在这里插入图片描述
UI运行时的脚本继承的是谁呢？
是创建的这个显示对象的
比如你是场景里的
那么继承的就是Laya.Scene
如果你是预制体那么继承的就是最顶层的默认是box
这个不是脚本和 unity 是不一样的

而如果添加组件继承的
是 Laya.Script
这俩是不一样的
Laya.Script 更像 unity 里的 MonoBehaviour

好
如果你看到了这里
并且用过egret引擎
那么一定会想我有没有办法多个皮肤公用一个类并且类里有导出的属性呢？
也就是说 ui运行时希望动态赋值
有！
这个代码的前提是已经预加载了预制体

public static createPrefabByClass<T>(url: string, classRef: any): T {
    
    
        let p: Laya.PrefabImpl = Laya.loader.getRes(url);
        Laya.ClassUtils.regClass(classRef.name, classRef);
        p.data._$runtime = classRef.name;
        return <T>p.create();
}

当然了
类里的属性需要自己手写

laya只有hbox 和 vbox 用来排版
但是如果你想排列成类似list的但是又不想用list 怎么办？
在这里插入图片描述
看到这上面了吗？
这些就是
但是需要选中你需要排版的对象
而不是父类
而且点眼睛隐藏是不行的重启ide会失效
必须点visible才可以

但是
这个特性并不是按照显示顺序来的！

图集

猜你喜欢