點擊任意位置關閉（CocosCreator）

推薦閱讀：

•  我的CSDN
•  我的博客園
•  QQ群：704621321
•  我的個人博客

      今天，接觸到一個新功能，當彈出某個彈框時，需要點擊除彈框的剩余任意位置，來關閉該彈框，例如：當紅框內容顯示時，點擊紅框外任意位置可關閉紅框。

      剛開始做這個功能時，第一想法：
      判斷點擊的UI不是該彈框UI，改功能只需要一個if語句就能實現，這時候我發現有兩個困難點,1:如何判斷點擊的UI是否是目標彈框；2：使用該方法，需要為除彈框外的整個UI界面添加監聽事件，由於開始搭建UI的時候沒有考慮這種情況，所以要為除彈框外的整個UI界面添加監聽事件就特別繁雜。

      為此，我果斷放棄了這種方法，我又尋找到另一種方法：可不可以添加一個屏幕大小的透明Button，當彈框彈出來時，顯示Button，為Button添加一個監聽事件：關閉彈框。但是我又發現問題，以前用U3D的事件，點擊事件具有穿透效果，當彈框彈出來時，Button也顯示，這樣會造成點擊彈框上某UI，也會觸發Button的監聽事件。

      當然，這只是根據自己的開發經驗推測的，由於暫時沒想到其他方法，我還是嘗試了一下，發現cocos並不存在事件的穿透。所以，在你走頭無路的時候，需要用於嘗試，有時候，你和成功只差一步：動手實踐。

接下來。講講我的實現過程吧
1.在彈框的上面一個層級，新建一個透明Button，命名為：anyPos
2.為anyPos添加監聽事件

		// 查找btn
        var findBtn = function (str, prt, call, bAudio = true) {
            var obj = cc.find(str, prt);
            obj.on("click", function () {
                if (bAudio) { gm.HallAudio.playClick(); }
                call();
            }, this);
            return obj;
        };

		
		//任意位置按鈕
        uiRoot.anyPos = findBtn("anyPos", obj3, function () {
            self.uiRoot.myBox.active = false;//隱藏彈框
            self.uiRoot.anyPos.active = false;//隱藏anyPos
        })
        //默認anyPos為隱藏的
        self.uiRoot.anyPos.active = false;

3.顯示彈框時

//打開彈框
    openMyBox() {
        var self = this;
        
    self.uiRoot.myBox.active = true;
    self.uiRoot.anyPos.active = true;
    }

其實該功能挺簡單的，代碼幾行就是實現了，也不難理解。