Laya中runtime的用法

0、环境:2.x版本

1、runtime是什么

简单来说,如果创建了一个scene,加了runtime和没加runtime的区别就是:

  • 没加runtime,你new这个scene出来,不行代码操作,和你在IDE上看到的一样。
  • 加了runtime,你new出这个scene,实际上就已经可以有代码逻辑了。
  • 总而言之,就是加了runtime,运行时new出来的就是runtime指定的类(正常这个类继承了ui)

2、使用实例

情景

游戏里面有n种弹窗,比如有2种:
在这里插入图片描述
在这里插入图片描述

你想要:

  • 不用重复拼(替换资源时可以一键替换)
  • 能够将一些通用的展示内容配置化(或者说想要统一操作某个东西)
  • 一次代码修改给所有scene皮肤增加相同逻辑

需要做

  • 将这种做成组件【DialogUI,下面这个就代表组件】,别的地方使用直接拖过来用(不用重复拼)
  • 给【DialogUI】增加一个类【DialogCode】,这个类继承了你的UI,有n个【DialogUI】就继承n个,即有【DialogCode1~n】。前面提到了可能有n个逻辑类似的弹窗,这里就需要将这些通用逻辑抽到一个公共逻辑类【DialogCodeLogicComm】,每个【DialogCode】只需要在必要的生命周期那调用下【DialogCodeLogicComm】的必要接口即可。这里便是能够一次代码修改给所有scene皮肤增加相同逻辑。
  • 最后记得将【DialogCode1】拉到【DialogUI1】里,【DialogCode2】拉到【DialogUI2】里,依次类推。
  • 新增一个也很简单,创建个命名规范的【DialogUIx】,创建个【DialogCodex-这个类是极简的】,将【DialogCodex】拖入到【DialogUIx】的runtime即可,不用写之前的通用逻辑,通用逻辑在【DialogCodeLogicComm】类了。
  • 总结:不同的scene皮肤+runtime+runtime类内部带一个公共逻辑块类,实现多个样式一套逻辑。

3、script组件模式

也可以实现类似的功能,更多是一些通用的逻辑,可以用于ui(比如类似运行时控制器效果),也可以是非ui,关键还是看需求。

LayaAir 引擎中,矢量图的绘制主要通过 `Sprite` 对象的 `graphics` 属性来实现。`Graphics` 类提供了多种方法用于绘制基本的矢量图形,如圆形、矩形、扇形、线条等。以下是一些常见的矢量图使用方法。 ### 绘制基本形状 #### 绘制圆形 使用 `drawCircle` 方法可以绘制圆形。该方法的参数包括圆心坐标、半径填充颜色。 ```typescript let sp = new Laya.Sprite(); sp.graphics.drawCircle(100, 100, 50, "#FF0000"); // 绘制一个红色的圆形 Laya.stage.addChild(sp); ``` #### 绘制矩形 使用 `drawRect` 方法可以绘制矩形。参数包括左上角坐标、宽度、高度填充颜色。 ```typescript sp.graphics.drawRect(50, 50, 100, 100, "#00FF00"); // 绘制一个绿色的矩形 ``` #### 绘制扇形 使用 `drawPie` 方法可以绘制扇形。参数包括圆心坐标、半径、起始角度、结束角度、填充颜色等。 ```typescript sp.graphics.drawPie(200, 200, 100, 45, 135, "#0000FF"); // 绘制一个蓝色的扇形 ``` #### 绘制线条 使用 `drawLine` 方法可以绘制线条。参数包括起点坐标、终点坐标、线颜色线宽。 ```typescript sp.graphics.drawLine(0, 0, 100, 100, "#000000", 2); // 绘制一条黑色的斜线 ``` ### 矢量图形的清除与重绘 如果需要对已有的矢量图形进行更新,可以使用 `clear` 方法清除当前的绘制内容,然后重新绘制新的图形。 ```typescript sp.graphics.clear(); // 清除当前的图形 sp.graphics.drawCircle(150, 150, 60, "#FF00FF"); // 重新绘制一个新的圆形 ``` ### 使用矢量图实现动态效果 矢量图可以与 LayaAir 的定时器结合使用,实现动态效果。例如,可以通过 `Laya.timer.frameLoop` 实现基于帧率的动画。 ```typescript Laya.timer.frameLoop(1, this, () => { sp.rotation += 1; // 使绘制的图形持续旋转 }); ``` ### 复杂图形的组合 矢量图也支持组合多个图形来创建更复杂的图形。例如,可以绘制一个扇形矩形组合成一把扇子或类似工具的形状。 ```typescript // 绘制扇子的形状 function showPie() { sp.graphics.drawPie(150, 200, 120, 225, 315, "#f00", "#ff0", 3); } ``` ### 注意事项 - 矢量图的绘制操作是即时的,因此如果需要频繁更新图形内容,建议在 `clear` 之后重新调用绘制方法。 - 在绘制复杂图形时,注意绘制顺序,因为后绘制的内容会覆盖前面的内容。 通过上述方法,可以在 LayaAir 引擎中灵活使用矢量图来创建丰富的图形动画效果。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值