关于cocostudio动态添加控件触摸响应无效的学习
time:2015/04/19
1. 描述
* 把studio制作的ui加载之后，动态添加事件（比如说，单点触摸），结果回调函数（eg：onTouchBegan等）根本没有响应！
* 另外，网上有朋友也碰到过这个问题，也在网上查到了类似的情况
* 但是，自己觉得按照3.0的cocos引擎的新渲染逻辑应该是可以设置的，而且这个问题也没有理解清楚，所以自己去看了下源码研究了一下，做一下记录，当然能帮到其他人理解就更好了。
2. 学习
（1）直接上代码看结果
/******说明******/
* layer: 一个基本的层
* layout: cocostudio制作的UI
* 层次关系： layer:addChild(layout)
* 动态添加一个按钮或者精灵
/******步骤******/
* 按钮和layout在一个层级，都加载layer上，没有位置上的重叠 ---> 结果没有影响，两遍都能响应触摸事件
* 按钮和layout在一个层级，都加载layer上，有位置上的重叠 --->结果依旧没有影响
* 按钮在layout之前addchild --->直接看不见了
* 按钮在layout之后addchild --->没有影响
* 按钮属于layout，layout:addChild()，没有位置上的重叠 --->结果没有影响
* 按钮属于layout，layout:addChild()，有位置上的重叠 --->结果没有影响
* 添加一个精灵，自己添加触摸事件 ---> 也没有影响
Sprite* sprite = Sprite::create("cocosui/green_edit.png"); bgd->addChild(sprite, 0); auto listener = EventListenerTouchOneByOne::create(); listener->onTouchBegan = CC_CALLBACK_2(UIButtonTest_Editor::onTouchBegan, this); listener->onTouchEnded = CC_CALLBACK_2(UIButtonTest_Editor::onTouchEnded, this); _eventDispatcher->addEventListenerWithSceneGraphPriority(listener, this);
（2）那为什么自己会有不响应的问题？
看自己的代码：
local function onTouchesBegan(touches,event)
print("onTouchesBegan ... ")
return true
end
local function onTouchesMoved(touches, event )
print("onTouchesMoved ... ")
end
local function onToucheEnd(touches,event)
print("onToucheEnd ... ")
end
local listener = cc.EventListenerTouchOneByOne:create()
listener:registerScriptHandler(onTouchesBegan,cc.Handler.EVENT_TOUCH_BEGAN)
listener:registerScriptHandler(onTouchesMoved,cc.Handler.EVENT_TOUCH_MOVED)
listener:registerScriptHandler(onToucheEnd,cc.Handler.EVENT_TOUCH_ENDED)
local eventDispatcher = self:getEventDispatcher()
eventDispatcher:addEventListenerWithSceneGraphPriority(listener, self)
小结：
*自己是在layer上直接添加了单点触摸的事件
*用的是addEventListenerWithSceneGraphPriority接口，那么就去看看源码是怎么处理的？
（3）源代码分析：FixedPriority
直接看源码，会发现下面这个函数：
void EventDispatcher::sortEventListeners(const EventListener::ListenerID& listenerID)
{
DirtyFlag dirtyFlag = DirtyFlag::NONE;
auto dirtyIter = _priorityDirtyFlagMap.find(listenerID);
if (dirtyIter != _priorityDirtyFlagMap.end())
{
dirtyFlag = dirtyIter->second;
}
if (dirtyFlag != DirtyFlag::NONE)
{
// Clear the dirty flag first, if `rootNode` is nullptr, then set its dirty flag of scene graph priority
dirtyIter->second = DirtyFlag::NONE;
if ((int)dirtyFlag & (int)DirtyFlag::FIXED_PRIORITY)
{ //自定义优先级排序
sortEventListenersOfFixedPriority(listenerID);
}
if ((int)dirtyFlag & (int)DirtyFlag::SCENE_GRAPH_PRIORITY)
{
auto rootNode = Director::getInstance()->getRunningScene();
if (rootNode)
{ //默认优先级为0的排序
sortEventListenersOfSceneGraphPriority(listenerID, rootNode);
}
else
{
dirtyIter->second = DirtyFlag::SCENE_GRAPH_PRIORITY;
}
}
}
}
小结1：
* 可以看到在cocos是有事件优先级的，其中addEventListenerWithFixedPriority可以自定义优先级，addEventListenerWithSceneGraphPriority的优先级默认为0
* 既然有优先级的区别，那么毋庸置疑，设置一下就可以了
测试1：
把自己代码中的最后一行改成下面：
eventDispatcher:addEventListenerWithFixedPriority(listener, 1)
结果1：依旧是没有响应
小结2：
*继续看代码，发现优先级是按照<0, 0, >0排序的（这里和节点的渲染顺序是一样的）
// After sort: priority < 0, > 0 std::sort(fixedListeners->begin(), fixedListeners->end(), [](const EventListener* l1, const EventListener* l2) { return l1->getFixedPriority() < l2->getFixedPriority(); });
* 所以把优先级改成小于0，应该就可以了
测试2：
eventDispatcher:addEventListenerWithFixedPriority(listener, -1)
结果2：
*果真！有响应了，自己的打印信息出来了，也就是自己的layer在layout之前接收到并且响应了触摸消息
小结：
* 事件有优先级区别，但是优先级越低，越先接收并且响应消息！所以，如果是cocostudio的ui接收到了触摸消息，对不起了，后面都不会响应了，因为被吞掉了 [_touchListener->setSwallowTouches(true);]
* 如果优先级都为0（即，SceneGraphPriority），顺序又是怎么处理的呢？
（4）源代码：SceneGraphPriority
首先，看源码的排序地方
void EventDispatcher::sortEventListenersOfSceneGraphPriority(const EventListener::ListenerID& listenerID, Node* rootNode) { auto listeners = getListeners(listenerID); if (listeners == nullptr) return; auto sceneGraphListeners = listeners->getSceneGraphPriorityListeners(); if (sceneGraphListeners == nullptr) return; // Reset priority index _nodePriorityIndex = 0; _nodePriorityMap.clear(); visitTarget(rootNode, true); // After sort: priority < 0, > 0 std::sort(sceneGraphListeners->begin(), sceneGraphListeners->end(), [this](const EventListener* l1, const EventListener* l2) { return _nodePriorityMap[l1->getAssociatedNode()] > _nodePriorityMap[l2->getAssociatedNode()]; }); //省略 }
*仔细看visitTarget中的函数，牵涉到了层级关系，zOrder，所以想：设置这个是不是就能达到事件优先级的大小的呢？
测试1：
self:setLocalZOrder(-1) self:setLocalZOrder(100) self:setGlobalZOrder(-1) self:setGlobalZOrder(1)
结果1：
* self:setLocalZOrder(-1) ---> 无影响
* self:setLocalZOrder(100) ---> 无影响
* self:setGlobalZOrder(-1) ---> 无影响
* self:setGlobalZOrder(1) ---> 有影响
* localZorder为什么没有影响
* 而设置GlobalZOrder是有影响的
小结1：
* SceneGraphPriority模式下，是按照>0, 0, <0的顺序去处理事件节点的（注释的地方有问题！！！）
visitTarget(rootNode, true);
// After sort: priority < 0, > 0
std::sort(sceneGraphListeners->begin(), sceneGraphListeners->end(), [this](const EventListener* l1, const EventListener* l2) {
return _nodePriorityMap[l1->getAssociatedNode()] > _nodePriorityMap[l2->getAssociatedNode()];
});
* 顺序是按照节点的globalZOrder这个值进行排序的，不管是不是child或者parent以及他们之间的所属关系
* 如果localZOrder的话，都一样的话就按照原来的顺序（即加入节点的顺序）；另外父节点和子节点的顺序是：子节点<0的所有点--->父节点--->子节点大于0 的所有点（所以在这里设置layer的localZOrder没有用，要设置layout的localZOrder）
3. 总结
（1）FixedPriority设置优先级的话，处理顺序有优先级之分: <0, 0, >0
（2）SceneGraphPriority模式下，是按照>0, 0, <0的顺序去处理事件节点的
4. 参考
[1] http://www.it165.net/pro/html/201405/13283.html
---------------------------------后续学习补充--------------------------------------
1. 关于cocstudio的panel添加触摸事件无效的研究
时间：2015/05/23
描述：在cocostudio的界面上添加了一个panel，想对这个panel添加触摸事件，代码如下：
local listener = cc.EventListenerTouchOneByOne:create(); listener:registerScriptHandler(onTouchBegan, cc.Handler.EVENT_TOUCH_BEGAN) listener:registerScriptHandler(onTouchBegan, cc.Handler.EVENT_TOUCH_ENDED) local eventDispatcher = self:getEventDispatcher() eventDispatcher:addEventListenerWithFixedPriority(listener, 1)
参考了之前的研究，这里使用了优先级的监听事件，结果不管是优先级为-1还是1都是不管用的，非常纳闷~
学习：
（1）registerScriptHandler
listener的注册函数，这个是专门为lua写的接口，可以看到这个函数是在lua_cocos2dx_manual.cpp中，并且是把回调函数放在了c++ 11的function类型中做处理的。
case ScriptHandlerMgr::HandlerType::EVENT_TOUCH_ENDED:
{
self->onTouchEnded = [=](Touch* touch, Event* event){
LuaEventTouchData touchData(touch, event);
BasicScriptData data((void*)self,(void*)&touchData);
LuaEngine::getInstance()->handleEvent(type, (void*)&data);
};
ScriptHandlerMgr::getInstance()->addObjectHandler((void*)self, handler, type);
}
break;
通过调试断点，看了下这个函数的地址（因为一直没有调用进来，所以看看后面是怎么处理的）。
（2）addEventListenerWithFixedPriority
通过这个接口加到列表中，没有问题。这里看代码可以看到开始是加到一个临时变量中，最后在updateListeners函数中再把listener加到真正处理的列表中的。
（3）dispatchTouchEvent
if (eventCode == EventTouch::EventCode::BEGAN) { if (listener->onTouchBegan) { isClaimed = listener->onTouchBegan(*touchesIter, event); if (isClaimed && listener->_isRegistered) { listener->_claimedTouches.push_back(*touchesIter); } } }
在这个函数位置进行处理的listener->onTouchBegan处理。
也就是在这个时候，我开始发现自己一直理解错了。因为panel本身也是接收触摸事件的，看代码可以发现所有的Widget本身就是做了触摸事件处理的！多此一举！！！
（4）小结
* addEventListenerWithFixedPriority依旧是有效的，设置为-1，就会优先执行，但是一定要注意：这个时候的回调函数的参数和onTouchBegan的回调函数参数是完全不一样的
// 1. addEventListenerWithFixedPriority的回调函数形式 bool Widget::onTouchBegan(Touch *touch, Event *unusedEvent) // 2.addTouchEventListerner的回调函数形式 typedef std::function<void(Ref*,Widget::TouchEventType)> ccWidgetTouchCallback;
* 所有的widget自己已经实现了触摸事件，所以不要多此一举！只有自己自定义的类，精灵、层等才需要自己去实现和添加。
* 除了触摸事件，还有FocusEvent，这个要具体去看看。
2. cocstudio中控件的响应
时间：2015/08/27
描述：cocostudio中控件有的可以点击，有的不可以点击，panel能遮挡，image和lable不遮挡，这些是为什么？
（1）cocostudio所有的控件都是继承widget，而widget都是实现了单点触摸，参见函数：
void Widget::setTouchEnabled(bool enable)
（2）所以，image和label都是可以监听触摸事件的，不过首先要设置一下，所以他们添加的时候要多设置一下上面的函数
local fnTouchImg = function(sender, eventType) if eventType == ccui.TouchEventType.ended then print("press image ... ") end end local img = node:getChildByName("Image_46") img:setTouchEnabled(true); img:addTouchEventListener(fnTouchImg)
（3）panel和button默认都是添加了触摸事件，而image和label没有，主要原因是cocostudio上面的【交互】是否勾选，然后在加载json文件的时候调用setTouchEnabled函数
//WidgetReader.cpp widget->setTag(DICTOOL->getIntValue_json(options, P_Tag)); widget->setActionTag(DICTOOL->getIntValue_json(options, P_ActionTag)); widget->setTouchEnabled(DICTOOL->getBooleanValue_json(options, P_TouchAble)); const char* name = DICTOOL->getStringValue_json(options, P_Name);
（4）总结：
* cocostudio下面所有控件（继承widget）都是有触摸响应事件的，直接用函数addTouchEventListener即可
* 对于没有反应的说明setTouchEnabled()是false
* 对于cocostudio来说，一般都是【交互】没有勾上的原因
