优化新手引导

assets/resources/module/guide/guide.prefab

@@ -324,8 +324,8 @@
     ],
     "_spriteFrame": null,
     "_type": 0,
-    "_segments": 64,
-    "_N$alphaThreshold": 0.1,
+    "_segments": 3100,
+    "_N$alphaThreshold": 0,
     "_N$inverted": true,
     "_id": ""
   },
@@ -1164,7 +1164,7 @@
     "asset": {
       "__uuid__": "5f53c125-7a14-4ca0-986a-0e0d2d665268"
     },
-    "fileId": "61shDUdxBJl4Wej3Bami/Z",
+    "fileId": "5aaltp/CNENrilqsipfFxS",
     "sync": false
   },
   {

assets/scene/MainScene.fire

@@ -764,6 +764,9 @@
       "__id__": 2
     },
     "_enabled": true,
+    "node_guide": {
+      "__id__": 13
+    },
     "_id": "6fbJRZsUhE4p90rFOw/XX3"
   },
   {

assets/script/Main.ts

@@ -2,7 +2,10 @@ const { ccclass, property } = cc._decorator;
 
 @ccclass
 export default class Main extends cc.Component {
+    @property(cc.Node)
+    node_guide:cc.Node = null;
     start() {
         mk.ui.openPanel("module/login/login");
+        mk.guide.ui = this.node_guide;
     }
 }

assets/script/before/GamePlay.ts

@@ -174,16 +174,19 @@ export default class GamePlay extends cc.Component {
     }
 
     private clickGuide(data: string) {
-        if (data == "1_2") {//点击即可消除哦！
+        if (data == "1_3") {//点击即可消除哦！
             this.cellItemDic[0][0] && this.cellItemDic[0][0].onClick();
             this.cellItemDic[0][1] && this.cellItemDic[0][1].onClick();
         }
-        else if (data == "1_3") {//再点击一次增加大量进度哦
-            this.cellItemDic[1][0] && this.cellItemDic[1][0].onClick();
+        else if (data == "1_4") {//再点击一次增加大量进度哦
+            this.cellItemDic[0][1] && this.cellItemDic[0][1].onClick();
+            this.cellItemDic[0][2] && this.cellItemDic[0][2].onClick();
+            this.cellItemDic[0][3] && this.cellItemDic[0][3].onClick();
+            this.cellItemDic[0][4] && this.cellItemDic[0][4].onClick();
+        }
+        else if (data == "1_6") {//再点击一次增加大量进度哦
             this.cellItemDic[1][1] && this.cellItemDic[1][1].onClick();
             this.cellItemDic[1][2] && this.cellItemDic[1][2].onClick();
-            this.cellItemDic[1][3] && this.cellItemDic[1][3].onClick();
-            this.cellItemDic[1][4] && this.cellItemDic[1][4].onClick();
         }
     }
 

assets/script/game/module/guide/Guide.ts

@@ -37,7 +37,7 @@ export default class Guide extends cc.Component {
     private widgets: string[] = ['top', 'bottom', 'left', 'right', 'verticalCenter', 'horizontalCenter'];
 
     onLoad() {
-
+        // this.initTouch();
     }
 
     start() {
@@ -66,27 +66,36 @@ export default class Guide extends cc.Component {
             this.node_dialog.opacity = 255;
             this.targetNode = null;
             this.event_data = null;
+            this.ifThrough = true;
             let [x, y, w, h] = [null, null, null, null];
 
-            //点击全屏下一步，显示区域不显示，点击区域全屏
-            if (this.crtGuide.click_rect == "all") {
-                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;
-                this.node_click.height = this.node.height;
-            }
-            else if (this.crtGuide.click_rect.indexOf("event") != -1) {//点击区域下一步，并发送事件，显示区域读配置，点击区域=显示区域
-                this.event_data = this.crtGuide.id + "_" + this.crtStep;
-                let arr = this.crtGuide.display_rect.split(":");
-                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;
+            //点击全屏下一步，显示区域不显示 || 点击区域下一步，并发送事件，显示区域读配置   
+            if (this.crtGuide.click_rect == "all" || this.crtGuide.click_rect.indexOf("event") != -1) {
+                //显示区域： display_rect为""表示全屏
+                if (this.crtGuide.display_rect.length == 0) {
+                    this.node_display.width = this.node_display.height = 0;
+                }
+                else {
+                    let arr = this.crtGuide.display_rect.split(":");
+                    x = parseInt(arr[0]);
+                    y = parseInt(arr[1]);
+                    w = parseInt(arr[2]);
+                    h = parseInt(arr[3]);
+                }
+                if (this.crtGuide.click_rect == "all") {
+                    this.node_click.x = 0;
+                    this.node_click.y = 0;
+                    this.node_click.width = this.node.width;
+                    this.node_click.height = this.node.height;
+                    this.ifThrough = false;
+                }
+                else {
+                    this.event_data = this.crtGuide.id + "_" + (this.crtStep + 1);
+                    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);
@@ -200,4 +209,66 @@ export default class Guide extends cc.Component {
         mk.guide.close();
         this.node.destroy();
     }
+
+
+
+    ///////////////// 自定义触摸监听 /////////////////
+    private _eventManager = cc["internal"]["eventManager"];
+    private _touchListener: any;
+    private ifThrough: boolean;
+    private initTouch() {
+        const EventListener = cc["EventListener"];
+        this._touchListener = EventListener.create({
+            event: EventListener.TOUCH_ONE_BY_ONE,
+            swallowTouches: false,//是否吞噬touch事件
+            owner: this.node_click,
+            mask: null,
+            onTouchBegan: this.onTouchStart.bind(this),
+            onTouchMoved: null,
+            onTouchEnded: this.onTouchEnded.bind(this),
+            onTouchCancelled: null,
+        });
+        this._eventManager.addListener(this._touchListener, this.node_click);
+    }
+
+    private onTouchStart(touch: cc.Touch, event: cc.Event.EventTouch): boolean {
+        // cc.log("touch start");
+        //此处必须返回true（表示接触到了节点）,否则TOUCH_MOVE,TOUCH_END,TOUCH_CANCEL不触发。
+        if (this.ifThrough) {
+            const point_world_pos = touch.getLocation();
+            let localPoint = this.node.parent.convertToNodeSpaceAR(new cc.Vec2(point_world_pos.x, point_world_pos.y));
+            // let localPoint = mk.game.localConvertWorldPointARCenter()
+            let result = this.pointInPoly(localPoint, this.node_click);
+            return result;
+        }
+        else {
+            return false;
+        }
+    }
+    /**
+    * 点是否在节点宽高范围内
+    * @param point 点击的点
+    * @param node 
+    * @returns 
+    */
+    private pointInPoly(point: cc.Vec2 | cc.Vec3, node: cc.Node) {
+        const self_node_pos = node.getPosition();
+        if (point.x >= (self_node_pos.x - (this.node_click.width / 2)) &&
+            point.x <= (self_node_pos.x + (this.node_click.width / 2)) &&
+            point.y >= (self_node_pos.y - (this.node_click.height / 2)) &&
+            point.y <= (self_node_pos.y + (this.node_click.height / 2))) {
+            return true;
+        }
+        return false;
+    }
+
+    private onTouchEnded(touch: cc.Touch, event: cc.Event.EventTouch): void {
+        // cc.log("touch end");
+        this.clickNodeClick();
+    }
+
+    protected onDestroy(): void {
+        // super.onDestroy();
+        this._eventManager.removeListener(this._touchListener, this.node_click);
+    }
 }

assets/script/mk/system/GuideSystem.ts

@@ -1,4 +1,5 @@
 import { GameProp } from "../../game/data/GameData";
+import { OpenActionType } from "./UISystem";
 
 
 /**
@@ -7,6 +8,7 @@ import { GameProp } from "../../game/data/GameData";
 export default class GuideSystem {
 
     private crtGuideID: number;
+    public ui:cc.Node;
 
     public open(id) {
         this.crtGuideID = gData.gameData.getProp(GameProp.guideID);
@@ -25,7 +27,7 @@ export default class GuideSystem {
         }
         gData.guideData.crtID = id;
         this.crtGuideID = id;
-        mk.ui.openPanel("module/guide/guide");
+        mk.ui.openPanel("module/guide/guide",OpenActionType.normal,this.ui);
         this.setGuideID(this.crtGuideID++);
     }
 

assets/script/mk/system/UISystem.ts

@@ -33,7 +33,7 @@ export default class UISystem extends cc.Component {
      * @param panelUrl  界面名称全路径
      * @param openAction 打开之后的操(需不需要关闭其他界面)
      */
-    openPanel(panelUrl: string, openAction: OpenActionType = OpenActionType.normal): Promise<any> {
+    openPanel(panelUrl: string, openAction: OpenActionType = OpenActionType.normal, parent: cc.Node = null): Promise<any> {
         let arr = panelUrl.split("/");
         let panelName = arr[arr.length - 1];
 
@@ -63,7 +63,12 @@ export default class UISystem extends cc.Component {
                         return;
                     }
 
-                    self.panelParent.addChild(node_panel);
+                    if(parent){
+                        node_panel.parent = parent;
+                    }
+                    else{
+                        self.panelParent.addChild(node_panel);
+                    }
 
                     switch (openAction) {
                         case OpenActionType.normal:

assets/script/mk/utils/GameUtil.ts

@@ -49,4 +49,13 @@ export default class GameUtil {
         }
         return new cc.Vec2(originX, originY);
     }
+
+    /** node的坐标改为全局坐标 中间为原点 */
+    public localConvertWorldPointARCenter(node: cc.Node) {
+        let o1 = cc.view.getVisibleSize();
+        let o2 = node.convertToWorldSpaceAR(cc.v2(0, 0));
+        o2.x = o2.x - o1.width / 2;
+        o2.y = o2.y - o1.height / 2;
+        return o2;
+    }
 }