From 673aa5b35ee493f84a7e0fe8efcfe93783ced636 Mon Sep 17 00:00:00 2001
From: leo <907600065@qq.com>
Date: Fri, 30 Nov 2018 15:08:59 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E5=96=84=E6=96=B0=E6=89=8B=E5=BC=95?=
 =?UTF-8?q?=E5=AF=BC=E7=9A=84demo?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 GuideDemo/README.md                    |  4 +-
 GuideDemo/assets/Scene/helloworld.fire |  6 +--
 GuideDemo/assets/Script/MarkTouch.js   | 70 +++++++++++++++++++++-----
 3 files changed, 61 insertions(+), 19 deletions(-)

diff --git a/GuideDemo/README.md b/GuideDemo/README.md
index 239e048..ce68dbb 100644
--- a/GuideDemo/README.md
+++ b/GuideDemo/README.md
@@ -1,2 +1,2 @@
-# Guide demo
-一个简单的选择性点击，可用于新手引导。
+# Guide Demo
+一个关于简单新手引导的demo
diff --git a/GuideDemo/assets/Scene/helloworld.fire b/GuideDemo/assets/Scene/helloworld.fire
index be4503d..6785fb5 100644
--- a/GuideDemo/assets/Scene/helloworld.fire
+++ b/GuideDemo/assets/Scene/helloworld.fire
@@ -1110,14 +1110,12 @@
       "__id__": 22
     },
     "_enabled": true,
+    "type": 2,
     "nodeTarget": {
       "__id__": 10
     },
-    "nodeMark": {
+    "nodeMask": {
       "__id__": 23
-    },
-    "nodeMarkBg": {
-      "__id__": 24
     }
   },
   {
diff --git a/GuideDemo/assets/Script/MarkTouch.js b/GuideDemo/assets/Script/MarkTouch.js
index e14ec1e..346c325 100644
--- a/GuideDemo/assets/Script/MarkTouch.js
+++ b/GuideDemo/assets/Script/MarkTouch.js
@@ -1,10 +1,18 @@
+//
+const Type = cc.Enum({
+  rect: 1,
+  circle: 2
+});
 cc.Class({
   extends: cc.Component,
 
   properties: {
+    type: {
+      default: Type.circle,
+      type: Type
+    },
     nodeTarget: cc.Node,
-    nodeMark: cc.Node,
-    nodeMarkBg: cc.Node
+    nodeMask: cc.Node,
   },
 
   onLoad() {
@@ -17,23 +25,62 @@ cc.Class({
   },
 
   init(data) {
+    this.mask = this.nodeMask.getComponent(cc.Mask);
+    this.setMode(this.type);
     this.setBoxBounding();
     this.node.on('touchstart', this.onTouchStart, this);
     this.initMarKPos(this.nodeTarget.convertToWorldSpaceAR(cc.v2(0, 0)));
   },
 
+  /**
+   * 设置样式
+   * @param {*} type 
+   */
+  setMode(type) {
+    if (type == Type.rect) {
+      this.mask.type = cc.Mask.Type.RECT;
+    } else if (type == Type.circle) {
+      this.mask.type = cc.Mask.Type.ELLIPSE;
+    }
+  },
+
+  /**
+   * 设置目标点
+   * @param {*} posWorld 
+   */
   initMarKPos(posWorld) {
     let parent = this.node.parent || this.node;
     let posLocal = parent.convertToNodeSpaceAR(posWorld);
-    this.nodeMark.setPosition(posLocal);
-    let size = this.getMaxLen(this.nodeTarget);
-    this.nodeMark.width = size;
-    this.nodeMark.height = size;
+    this.nodeMask.setPosition(posLocal);
+    let nodeMaskBg = this.nodeMask.getChildByName('bg');
+
     posLocal.x -= 0;
     posLocal.y -= 0;
-    this.nodeMarkBg.setPosition(cc.v2(-posLocal.x, -posLocal.y));
+    nodeMaskBg.setPosition(cc.v2(-posLocal.x, -posLocal.y));
+
+    if (this.type == Type.circle) {
+      let size = this.getMaxLen(this.nodeTarget);
+      this.nodeMask.width = size;
+      this.nodeMask.height = size;
+    } else {
+      let node = this.nodeTarget;
+      this.nodeMask.width = node.width;
+      this.nodeMask.height = node.height;
+    }
   },
 
+  /**
+   * 点中目标后
+   * 回调
+   */
+  onTouchEventFinish() {
+    this.node.active = false;
+  },
+
+  /**
+   * 取得最大长度
+   * @param {*} node 
+   */
   getMaxLen(node) {
     let size = node.width;
     if (size < node.height) {
@@ -57,20 +104,17 @@ cc.Class({
    */
   onTouchStart(event) {
     let touchPos = event.getLocation();
-    console.log('touchPos=', touchPos);
+    // console.log('touchPos=', touchPos);
     let retWorld = this.nodeTarget.getBoundingBoxToWorld();
     if (retWorld.contains(touchPos)) {
+      //触摸事件可向下传递
       this.node._touchListener.setSwallowTouches(false);
-      this.node.active = false;
+      this.onTouchEventFinish();
     } else {
       this.node._touchListener.setSwallowTouches(true);
     }
   },
 
-  update(dt) {
-
-  },
-
   offEvent() {
 
   },