|
|
@@ -17,12 +17,12 @@ export default class Guide extends cc.Component {
|
|
|
node_bg: cc.Node = null;
|
|
|
@property({ type: cc.Node, displayName: "对话框" })
|
|
|
node_dialog: cc.Node = null;
|
|
|
- @property({ type: cc.Sprite, displayName: "手指" })
|
|
|
- node_finger: cc.Sprite = null;
|
|
|
+ @property({ type: cc.Node, displayName: "手指" })
|
|
|
+ node_finger: cc.Node = null;
|
|
|
@property({ type: cc.Sprite, displayName: "头像" })
|
|
|
node_head: cc.Sprite = null;
|
|
|
- @property({ type: cc.Sprite, displayName: "形象" })
|
|
|
- node_person: cc.Sprite = null;
|
|
|
+ @property({ type: sp.Skeleton, displayName: "形象" })
|
|
|
+ node_person: sp.Skeleton = null;
|
|
|
@property({ type: cc.RichText, displayName: "对话内容" })
|
|
|
rich_dialog: cc.RichText = null;
|
|
|
|
|
|
@@ -62,13 +62,15 @@ export default class Guide extends cc.Component {
|
|
|
this.close();
|
|
|
}
|
|
|
else {
|
|
|
+ this.node_finger.opacity = 255;
|
|
|
+ this.node_dialog.opacity = 255;
|
|
|
this.targetNode = null;
|
|
|
this.event_name = null;
|
|
|
+ let [x, y, w, h] = [null, null, null, null];
|
|
|
|
|
|
//点击全屏下一步,显示区域不显示,点击区域全屏
|
|
|
if (this.crtGuide.click_rect == "all") {
|
|
|
- this.node_display.width = 0;
|
|
|
- this.node_display.height = 0;
|
|
|
+ this.node_display.width = this.node_display.height = 0;
|
|
|
this.node_click.x = 0;
|
|
|
this.node_click.y = 0;
|
|
|
this.node_click.width = this.node.width;
|
|
|
@@ -77,17 +79,42 @@ export default class Guide extends cc.Component {
|
|
|
else if (this.crtGuide.click_rect.indexOf("event") != -1) {//点击区域下一步,并发送事件,显示区域读配置,点击区域=显示区域
|
|
|
this.event_name = "event_guide_" + this.crtGuide.id + "_" + this.crtStep;
|
|
|
let arr = this.crtGuide.display_rect.split(":");
|
|
|
- this.node_display.x = this.node_click.x = parseInt(arr[0]);
|
|
|
- this.node_display.y = this.node_click.y = parseInt(arr[1]);
|
|
|
- this.node_display.width = this.node_click.width = parseInt(arr[2]);
|
|
|
- this.node_display.height = this.node_click.height = parseInt(arr[3]);
|
|
|
+ x = parseInt(arr[0]);
|
|
|
+ y = parseInt(arr[1]);
|
|
|
+ w = parseInt(arr[2]);
|
|
|
+ h = parseInt(arr[3]);
|
|
|
+ this.node_click.x = x;
|
|
|
+ this.node_click.y = y;
|
|
|
+ this.node_click.width = w;
|
|
|
+ this.node_click.height = h;
|
|
|
}
|
|
|
else {//点击按钮下一步,显示区域为配置的node,点击区域=显示区域
|
|
|
this.targetNode = cc.find("Canvas/" + this.crtGuide.click_rect);
|
|
|
- this.node_display.width = this.targetNode.width;
|
|
|
- this.node_display.height = this.targetNode.height;
|
|
|
+ w = this.targetNode.width;
|
|
|
+ h = this.targetNode.height;
|
|
|
let pos = mk.game.getWorldPos(this.targetNode);
|
|
|
- this.node_display.setPosition(pos);
|
|
|
+ x = pos.x;
|
|
|
+ y = pos.y;
|
|
|
+
|
|
|
+ //穿透点击目标节点时增加一个事件触发下一步,触发后移除
|
|
|
+ this.node_click.width = this.node_click.height = 0;
|
|
|
+ let eventHandler = new cc.Component.EventHandler();
|
|
|
+ eventHandler.target = this.node;
|
|
|
+ eventHandler.component = "Guide";
|
|
|
+ eventHandler.handler = "clickNodeClick";
|
|
|
+ this.targetNode.getComponent(cc.Button).clickEvents.push(eventHandler);
|
|
|
+ }
|
|
|
+
|
|
|
+ //显示区域由大到小动画
|
|
|
+ if (x != null && y != null && w != null && h != null) {
|
|
|
+ cc.tween(this.node_display)
|
|
|
+ .to(0.3, { x: x, y: y, width: w, height: h }, {
|
|
|
+ onUpdate: () => {
|
|
|
+ this.node_bg.x = -this.node_display.x;
|
|
|
+ this.node_bg.y = -this.node_display.y;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .start();
|
|
|
}
|
|
|
|
|
|
//对话框位置
|
|
|
@@ -96,13 +123,13 @@ export default class Guide extends cc.Component {
|
|
|
let arr = this.crtGuide.dialog_pos.split(":");
|
|
|
let wedgit = this.node_dialog.getComponent(cc.Widget);
|
|
|
for (let i = 0; i < this.widgets.length; i++) {
|
|
|
- wedgit[this.widgets[i]] = arr[i] == "" ? null : arr[i];
|
|
|
+ wedgit[this.widgets[i]] = arr[i] == "" ? null : parseInt(arr[i]);
|
|
|
}
|
|
|
}
|
|
|
else {//显示区域偏移
|
|
|
- let arr = this.crtGuide.dialog_pos1.split(":");
|
|
|
- this.node_dialog.x = this.node_display.x + parseInt(arr[0]);
|
|
|
- this.node_dialog.y = this.node_display.y + parseInt(arr[1]);
|
|
|
+ let arr = this.crtGuide.dialog_pos1.split(",");
|
|
|
+ this.node_dialog.x = x + parseInt(arr[0]);
|
|
|
+ this.node_dialog.y = y + parseInt(arr[1]);
|
|
|
}
|
|
|
|
|
|
//对话文字对齐方式
|
|
|
@@ -110,13 +137,13 @@ export default class Guide extends cc.Component {
|
|
|
this.rich_dialog.horizontalAlign = a == '0' ? cc.macro.TextAlignment.LEFT : (a == '1' ? cc.macro.TextAlignment.CENTER : cc.macro.TextAlignment.RIGHT);
|
|
|
|
|
|
if (this.crtGuide.finger == "") {
|
|
|
- this.node_finger.node.active = false;
|
|
|
+ this.node_finger.active = false;
|
|
|
}
|
|
|
else {
|
|
|
- this.node_finger.node.active = true;
|
|
|
+ this.node_finger.active = true;
|
|
|
let arr = this.crtGuide.finger.split(":");
|
|
|
- this.node_finger.node.x = this.node_display.x + parseInt(arr[0]);
|
|
|
- this.node_finger.node.y = this.node_display.y + parseInt(arr[1]);
|
|
|
+ this.node_finger.x = x + parseInt(arr[0]);
|
|
|
+ this.node_finger.y = y + parseInt(arr[1]);
|
|
|
}
|
|
|
|
|
|
if (this.crtGuide.tr_form == 1) {
|
|
|
@@ -128,32 +155,41 @@ export default class Guide extends cc.Component {
|
|
|
this.node_person.node.active = true;
|
|
|
}
|
|
|
|
|
|
- this.node_bg.x = -this.node_display.x;
|
|
|
- this.node_bg.y = -this.node_display.y;
|
|
|
-
|
|
|
- this.rich_dialog.string = `<color=#000000>${this.crtGuide.dialog}</color>`;
|
|
|
+ this.rich_dialog.string = this.crtGuide.dialog;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
async clickNodeClick() {
|
|
|
+ cc.Tween.stopAllByTarget(this.node_display);
|
|
|
console.log("clickNodeClick");
|
|
|
if (this.targetNode) {
|
|
|
- this.targetNode.getComponent(cc.Button).clickEvents[0].emit([]);
|
|
|
+ this.targetNode.getComponent(cc.Button).clickEvents.pop();
|
|
|
}
|
|
|
if (this.event_name) {
|
|
|
//event_guide_1_2 (1_2为新手引导的id)
|
|
|
mk.event.emit(this.event_name);
|
|
|
}
|
|
|
+ this.reset();
|
|
|
if (this.crtGuide.lag_next > 0) {
|
|
|
await mk.time.WaitForSeconds(this.crtGuide.lag_next);
|
|
|
}
|
|
|
this.nextStep();
|
|
|
}
|
|
|
|
|
|
+ /** 等待状态 透明不可点击 */
|
|
|
+ private reset() {
|
|
|
+ this.node_display.width = this.node.width;
|
|
|
+ this.node_display.height = this.node.height;
|
|
|
+ this.node_bg.x = this.node_bg.y = 0;
|
|
|
+ this.node_click.width = 0
|
|
|
+ this.node_click.height = 0;
|
|
|
+ this.node_finger.opacity = 0;
|
|
|
+ this.node_dialog.opacity = 0;
|
|
|
+ }
|
|
|
+
|
|
|
|
|
|
private close() {
|
|
|
mk.guide.close();
|
|
|
this.node.destroy();
|
|
|
}
|
|
|
-
|
|
|
}
|