屏蔽触摸事件

在开发中，有时需要A Layer响应触摸，而B Layer不响应触摸，如果A Layer添加触摸事件监听，而B Layer不添加那么可以实现这个需求。但是如果A、B都需要响应触摸，但在某些时候只要求A响应B不响应，那么可以在A、B之间添加一个屏蔽了触摸事件的C Layer，这个Layer和A、B有同一个父节点，ZOrder在A之下B之上，那么A监听到了触摸之后，C屏蔽了触摸，B就监听不到触摸了。

使用Cocos（V2.3.2）新建了一个Cocos项目，然后使用Cocos Code IDE（Build:V1.2.0）导入，在src/app/views/目录下新建了一个Lua文件，代码如下：

local Pingbilayer = class("Pingbilayer",function()    return cc.LayerColor:create()end)function Pingbilayer:ctor(data,isTouming)    if data then         self.Rect = data.Rect    end      local sz = cc.c4f(0,0,0,146)    if isTouming then        sz = cc.c4f(0,0,0,0)    end    local _layer = cc.LayerColor:create(sz)    self:addChild(_layer,-1)       self:Pingbitouch()endfunction Pingbilayer:Pingbitouch()     local function onTouchBegan(touch, event)        print("--touch began--")        return true     end    local function onTouchEnded(touch, event)        print("--touch ended--")        local point = touch:getLocation()        if self.Rect then            if cc.rectContainsPoint(self.Rect,point) == false then                self:removeFromParent()             end         end    end     local listener = cc.EventListenerTouchOneByOne:create()    listener:registerScriptHandler(onTouchBegan,cc.Handler.EVENT_TOUCH_BEGAN)    listener:registerScriptHandler(onTouchEnded,cc.Handler.EVENT_TOUCH_ENDED)    listener:setSwallowTouches(true)    self:getEventDispatcher():addEventListenerWithSceneGraphPriority(listener,self)    local function onNodeEvent(event)        if event == "exit" then           self:getEventDispatcher():removeEventListener(listener)        end    end    self:registerScriptHandler(onNodeEvent)endreturn Pingbilayer

在创建这个屏幕层时传入了一个data参数，data中的Rect字段是一个矩形，如果在触摸结束时，触摸点在矩形外则将这个屏蔽层从父节点移除。在移除前将触摸监听移除。

在MainScene.lua中开启触摸

local MainScene = class("MainScene", cc.load("mvc").ViewBase)--MainScene.RESOURCE_FILENAME = "MainScene.csb"----function MainScene:onCreate()--    printf("resource node = %s", tostring(self:getResourceNode()))--endfunction MainScene:ctor()    self:enableNodeEvents()endfunction MainScene:onEnter()    local _size = cc.Director:getInstance():getWinSize()    local sp=cc.Sprite:create('res/HelloWorld.png')    self:addChild(sp)    sp:setPosition(_size.width/2,_size.height/2)    self:openTouch()endfunction MainScene:openTouch()    local listener = cc.EventListenerTouchOneByOne:create()    local function onTouchBegan( touch,event )        print("--touchBegan--")        return true      end    local function onTouchMoved( touch,event )        print("--touchMoved--")    end    local function onTouchEnded( touch,event )        print("--touchEnded--")    end    listener:registerScriptHandler(onTouchBegan,cc.Handler.EVENT_TOUCH_BEGAN)    listener:registerScriptHandler(onTouchMoved,cc.Handler.EVENT_TOUCH_MOVED)    listener:registerScriptHandler(onTouchEnded,cc.Handler.EVENT_TOUCH_ENDED)    self:getEventDispatcher():addEventListenerWithSceneGraphPriority(listener,self)    local function onNodeEvent(event)        if event == 'exit' then            self:getEventDispatcher():removeEventListener(listener)        end         end    self:registerScriptHandler(onNodeEvent)endreturn MainScene

运行之后

在onEnter里添加一个方法createUI

function MainScene:onEnter()    local _size = cc.Director:getInstance():getWinSize()    local sp=cc.Sprite:create('res/HelloWorld.png')    self:addChild(sp)    sp:setPosition(_size.width/2,_size.height/2)    self:createUI()    self:openTouch()endfunction MainScene:createUI()    local pb = require("app/views/Pingbilayer").new()    self:addChild(pb)end

createUI将屏蔽层添加上之后
可以看到屏蔽层响应了触摸并且屏蔽了触摸，MainScene没有响应触摸。

但是把屏蔽层的ZOrder改变之后，self:addChild(pb,-1)
不仅MainScene可以响应触摸，屏蔽层也可以，而且MainScene响应在前。

在createUI方法中添加一个九宫格精灵，并在创建屏蔽层时传入Rect

function MainScene:createUI()    local _size = cc.Director:getInstance():getWinSize()    local frame = ccui.Scale9Sprite:create('res/frame.png')    local size = frame:getContentSize()    frame:setCapInsets(cc.rect(31,31,size.width-62,size.height-62))    frame:setContentSize(200,200)    self:addChild(frame)    frame:setPosition(_size.width/2,_size.height/2)    local rect = frame:getBoundingBox()    local pb = require("app/views/Pingbilayer").new({Rect = rect})    self:addChild(pb)end

运行后
点击黄框之外的地方，屏蔽层会从父节点上移除