refactor(新手引导): 调整引导组件交互与UI实现

- 重构触发逻辑,将触摸事件改为按钮点击触发
- 更新引导预制体,添加弹窗与确认按钮UI
- 调整UI配置文件的边框参数适配新布局
- 简化组件事件管理与代码逻辑
This commit is contained in:
pan
2026-06-12 09:23:03 +08:00
parent 531343c0d7
commit 167c6b485a
4 changed files with 3877 additions and 2756 deletions

View File

@@ -18,7 +18,9 @@ export class GuideComp extends CCComp {
/** 手势图标节点 */
@property(Node)
hand: Node = null!
/** 手势图标节点 */
@property(Node)
clickNode: Node = null!
/** 引导编号 ID */
@property({ type: CCInteger })
guide_id: number = 0
@@ -62,24 +64,13 @@ export class GuideComp extends CCComp {
}
});
}
// 监听手势节点点击事件
if (this.hand) {
this.hand.on(NodeEventType.TOUCH_START, this.onTouchStart, this);
this.hand.on(NodeEventType.TOUCH_END, this.onGuideClick, this);
} else {
// 兜底:如果没有绑定手势节点,则监听自身节点
this.node.on(NodeEventType.TOUCH_START, this.onTouchStart, this);
this.node.on(NodeEventType.TOUCH_END, this.onGuideClick, this);
}
}
private onTouchStart(event: EventTouch) {
// 允许事件穿透,确保底层的实际功能按钮能正常接收到 TOUCH_START 事件
event.preventSwallow = true;
}
private onGuideClick(event: EventTouch) {
/**
* 完成当前引导操作
* (现在通过编辑器绑定 Button 组件或代码显式调用触发)
*/
public onGuideClick() {
// 记录该引导 ID 已完成
if (!smc.finish_guides.includes(this.guide_id)) {
smc.finish_guides.push(this.guide_id);
@@ -89,9 +80,6 @@ export class GuideComp extends CCComp {
// oops.storage.set("finish_guides", smc.finish_guides);
}
// 允许事件穿透,确保底层的实际功能按钮能正常接收到点击事件
event.preventSwallow = true;
// 完成后隐藏并销毁引导节点
this.node.active = false;
this.node.destroy();
@@ -99,14 +87,6 @@ export class GuideComp extends CCComp {
/** 组件销毁时解绑所有事件,防止残留回调 */
onDestroy() {
if (this.hand && this.hand.isValid) {
this.hand.off(NodeEventType.TOUCH_START, this.onTouchStart, this);
this.hand.off(NodeEventType.TOUCH_END, this.onGuideClick, this);
}
if (this.node && this.node.isValid) {
this.node.off(NodeEventType.TOUCH_START, this.onTouchStart, this);
this.node.off(NodeEventType.TOUCH_END, this.onGuideClick, this);
}
}
/** 外部初始化入口(由 MissionGuideComp 调用) */