quickcocos2dx 学习系列之十三 触摸.docx
《quickcocos2dx 学习系列之十三 触摸.docx》由会员分享，可在线阅读，更多相关《quickcocos2dx 学习系列之十三 触摸.docx（21页珍藏版）》请在冰豆网上搜索。
quickcocos2dx学习系列之十三触摸
quick-cocos2d-x学习系列之十三触摸
现在智能机基本都是触摸屏，除了键盘爱好者们耍键盘。
我们要通过这小小的触摸屏上完成整个游戏逻辑的控制，需要对这巴掌大地方进行详细控制了。
1.单点触摸测试
创建精灵函数
functioncreateTouchableSprite（p）
localsprite=display.newScale9Sprite（p.image）
sprite:
setContentSize（p.size）
localcs=sprite:
getContentSize（）
locallabel=cc.ui.UILabel.new（{
UILabelType=2,
text=p.label,
color=p.labelColor}）
label:
align（display.CENTER）
label:
setPosition（cs.width/2,label:
getContentSize（）.height）
sprite:
addChild（label）
sprite.label=label
returnsprite
end
划BOX框
functiondrawBoundingBox（parent,target,color）
localcbb=target:
getCascadeBoundingBox（）
localleft,bottom,width,height=cbb.origin.x,cbb.origin.y,cbb.size.width,cbb.size.height
localpoints={
{left,bottom},
{left+width,bottom},
{left+width,bottom+height},
{left,bottom+height},
{left,bottom},
}
localbox=display.newPolygon（points,{borderColor=color}）
parent:
addChild（box,1000）
end
1.1响应触摸事件
调用该函数：
self.sprite=createTouchableSprite（{
image="WhiteButton.png",
size=cc.size（500,300）,
label="TOUCHME!
",
labelColor=cc.c3b（255,0,0）}）
:
pos（display.cx,display.cy）
:
addTo（self）
drawBoundingBox（self,self.sprite,cc.c4f（0,1.0,0,1.0））
--启用触摸
self.sprite:
setTouchEnabled（true）
self.sprite:
addNodeEventListener（cc.NODE_TOUCH_EVENT,function（event）
--event.name是触摸事件的状态：
began,moved,ended,cancelled
--event.x,event.y是触摸点当前位置
--event.prevX,event.prevY是触摸点之前的位置
locallabel=string.format（"sprite:
%sx,y:
%0.2f,%0.2f",event.name,event.x,event.y）
self.sprite.label:
setString（label）
--返回true表示要响应该触摸事件，并继续接收该触摸事件的状态变化
returntrue
end）
单点触摸是最直接的使用方式了。
1.2事件穿透和事件捕获
--创建底层触摸层
self.parentButton=createTouchableSprite（{
image="WhiteButton.png",
size=cc.size（600,500）,
label="TOUCHME!
",
labelColor=cc.c3b（255,0,0）}）
:
pos（display.cx,display.cy）
:
addTo（self）
self.parentButton.name="parentButton"
drawBoundingBox（self,self.parentButton,cc.c4f（0,1.0,0,1.0））
self.parentButton:
setTouchEnabled（true）
--给该触摸层增加监听
self.parentButton:
addNodeEventListener（cc.NODE_TOUCH_EVENT,function（event）
locallabel=string.format（"parentButton:
%sx,y:
%0.2f,%0.2f",event.name,event.x,event.y）
self.parentButton.label:
setString（label）
returntrue
end）
--在底层创建button1,button1响应触摸后，会吞噬掉触摸事件
self.button1=createTouchableSprite（{
image="GreenButton.png",
size=cc.size（400,160）,
label="TOUCHME!
"}）
:
pos（300,400）
:
addTo（self.parentButton）
cc.ui.UILabel.new（{text="SWALLOW=YES\n事件在当前对象处理后被吞噬",size=24}）
:
align（display.CENTER,200,90）
:
addTo（self.button1）
drawBoundingBox（self,self.button1,cc.c4f（1.0,0,0,1.0））
self.button1:
setTouchEnabled（true）
self.button1:
setTouchSwallowEnabled（true）--是否吞噬事件，默认值为true
self.button1:
addNodeEventListener（cc.NODE_TOUCH_EVENT,function（event）
locallabel=string.format（"button1:
%sx,y:
%0.2f,%0.2f",event.name,event.x,event.y）
self.button1.label:
setString（label）
returntrue
end）
--在底层创建button2,响应触摸后，不会吞噬掉触摸事件
self.button2=createTouchableSprite（{
image="PinkButton.png",
size=cc.size（400,160）,
label="TOUCHME!
"}）
:
pos（300,200）
:
addTo（self.parentButton）
cc.ui.UILabel.new（{text="SWALLOW=NO\n事件会传递到下层对象",size=24}）
:
align（display.CENTER,200,90）
:
addTo（self.button2）
drawBoundingBox（self,self.button2,cc.c4f（0,0,1.0,1.0））
self.button2:
setTouchEnabled（true）
self.button2:
setTouchSwallowEnabled（false）--当不吞噬事件时，触摸事件会从上层对象往下层对象传递，称为“穿透”
self.button2:
addNodeEventListener（cc.NODE_TOUCH_EVENT,function（event）
locallabel=string.format（"button1:
%sx,y:
%0.2f,%0.2f",event.name,event.x,event.y）
self.button2.label:
setString（label）
returntrue
end）
事件穿透通过函数setTouchSwallowEnabled来实现。
如下函数设置是否捕捉触摸
self.parentButton:
setTouchCaptureEnabled（button:
isButtonSelected（））
1.3在事件捕获阶段决定是否接受事件
--这个标志变量用于在触摸事件捕获阶段决定是否接受事件
self.isTouchCaptureEnabled_=true
--parentButton是button1的父节点
self.parentButton=createTouchableSprite（{
image="WhiteButton.png",
size=cc.size（600,500）,
label="TOUCHME!
",
labelColor=cc.c3b（255,0,0）}）
:
pos（display.cx,display.cy）
:
addTo（self）
drawBoundingBox（self,self.parentButton,cc.c4f（0,1.0,0,1.0））
self.parentButton.label2=cc.ui.UILabel.new（{text="",size=24,color=cc.c3b（0,0,255）}）
:
align（display.CENTER,300,60）
:
addTo（self.parentButton）
self.parentButton:
setTouchEnabled（true）
self.parentButton:
addNodeEventListener（cc.NODE_TOUCH_EVENT,function（event）
locallabel=string.format（"parentButton:
%sx,y:
%0.2f,%0.2f",event.name,event.x,event.y）
self.parentButton.label:
setString（label）
printf（"%s%s[TARGETING]","parentButton",event.name）
ifevent.name=="ended"orevent.name=="cancelled"then
print（"-----------------------------"）
else
print（""）
end
returntrue
end）
--可以动态捕获触摸事件，并在捕获触摸事件开始时决定是否接受此次事件
self.parentButton:
addNodeEventListener（cc.NODE_TOUCH_CAPTURE_EVENT,function（event）
ifevent.name=="began"then
print（"-----------------------------"）
end
locallabel=string.format（"parentButtonCAPTURE:
%sx,y:
%0.2f,%0.2f",event.name,event.x,event.y）
self.parentButton.label2:
setString（label）
printf（"%s%s[CAPTURING]","parentButton",event.name）
ifevent.name=="began"orevent.name=="moved"then
returnself.isTouchCaptureEnabled_
end
end）
--button1响应触摸后，会吞噬掉触摸事件
self.button1=createTouchableSprite（{
image="GreenButton.png",
size=cc.size（400,160）,
label="TOUCHME!
"}）
:
pos（300,400）
:
addTo（self.parentButton）
cc.ui.UILabel.new（{text="SWALLOW=YES\n事件在当前对象处理后被吞噬",size=24}）
:
align（display.CENTER,200,90）
:
addTo（self.button1）
drawBoundingBox（self,self.button1,cc.c4f（1.0,0,0,1.0））
self.button1:
setTouchEnabled（true）
self.button1:
setTouchSwallowEnabled（true）--是否吞噬事件，默认值为true
self.button1:
addNodeEventListener（cc.NODE_TOUCH_EVENT,function（event）
locallabel=string.format（"button1:
%sx,y:
%0.2f,%0.2f",event.name,event.x,event.y）
self.button1.label:
setString（label）
printf（"%s%s[TARGETING]","button1",event.name）
ifevent.name=="ended"orevent.name=="cancelled"then
print（"-----------------------------"）
else
print（""）
end
returntrue
end）
--button2响应触摸后，不会吞噬掉触摸事件
self.button2=createTouchableSprite（{
image="PinkButton.png",
size=cc.size（400,160）,
label="TOUCHME!
"}）
:
pos（300,200）
:
addTo（self.parentButton）
cc.ui.UILabel.new（{text="SWALLOW=NO\n事件会传递到下层对象",size=24}）
:
align（display.CENTER,200,90）
:
addTo（self.button2）
drawBoundingBox（self,self.button2,cc.c4f（0,0,1.0,1.0））
self.button2:
setTouchEnabled（true）
self.button2:
setTouchSwallowEnabled（false）--当不吞噬事件时，触摸事件会从上层对象往下层对象传递，称为“穿透”
self.button2:
addNodeEventListener（cc.NODE_TOUCH_EVENT,function（event）
locallabel=string.format（"button1:
%sx,y:
%0.2f,%0.2f",event.name,event.x,event.y）
self.button2.label:
setString（label）
printf（"%s%s[TARGETING]","button2",event.name）
returntrue
end）
--即便父对象在捕获阶段阻止响应事件，但子对象仍然可以捕获到事件，只是不会触发事件
self.button2:
addNodeEventListener（cc.NODE_TOUCH_CAPTURE_EVENT,function（event）
printf（"%s%s[CAPTURING]","button2",event.name）
returntrue
end）
--放置一个开关按钮在屏幕上
locallabels={}
labels[true]="父对象【可以】捕获触摸事件"
labels[false]="父对象【不能】捕获触摸事件"
localimages={on="CheckBoxButton2On.png",off="CheckBoxButton2Off.png"}
self.captureEnabledButton=cc.ui.UICheckBoxButton.new（images）
:
setButtonLabel（cc.ui.UILabel.new（{text=labels[true],size=24}））
:
setButtonLabelOffset（40,0）
:
setButtonSelected（true）
:
onButtonStateChanged（function（event）
localbutton=event.target
button:
setButtonLabelString（labels[button:
isButtonSelected（）]）
end）
:
onButtonClicked（function（event）
localbutton=event.target
self.isTouchCaptureEnabled_=button:
isButtonSelected（）
end）
:
pos（display.cx-160,display.top-80）
:
addTo（self）
cc.ui.UILabel.new（{
text="事件处理流程：
\n1.【捕获】阶段：
从父到子\n2.【目标】阶段\n3.【传递】阶段：
尝试传递给下层对象",
size=24}）
:
align（display.CENTER_TOP,display.cx,display.top-120）
:
addTo（self）
其中NODE_TOUCH_EVENT和NODE_TOUCH_CAPTURE_EVENT表示两种事件。
在NODE_TOUCH_CAPTURE_EVENT的处理函数中返回真假，然后决定是否调用NODE_TOUCH_EVENT的处理函数。
1.4容器的触摸区域由子对象决定
创建一个node，在node上增加几个精灵，精灵的局域决定的触摸的范围。
--touchableNode是启用触摸的Node
self.touchableNode=display.newNode（）
self.touchableNode:
setPosition（display.cx,display.cy）
self:
addChild（self.touchableNode）
--在touchableNode中加入一些sprite
localcount=math.random（3,8）
localimages={"WhiteButton.png","BlueButton.png","GreenButton.png","PinkButton.png"}
fori=1,countdo
localsprite=display.newScale9Sprite（images[math.random（1,4）]）
sprite:
setContentSize（cc.size（math.random（100,200）,math.random（100,200）））
sprite:
setPosition（math.random（-200,200）,math.random（-200,200））
self.touchableNode:
addChild（sprite）
end
self.stateLabel=cc.ui.UILabel.new（{text=""}）
self.stateLabel:
align（display.CENTER,display.cx,display.top-100）
self:
addChild（self.stateLabel）
--启用触摸
self.touchableNode:
setTouchEnabled（true）
--添加触摸事件处理函数
self.touchableNode:
addNodeEventListener（cc.NODE_TOUCH_EVENT,function（event）
locallabel=string.format（"touchableNode:
%sx,y:
%0.2f,%0.2f",event.name,event.x,event.y）
self.stateLabel:
setString（label）
returntrue
end）
drawBoundingBox（self,self.touchableNode,cc.c4f（0,1.0,0,1.0））
2.多点触摸
2.1响应触摸事件
--createTouchableSprite（）定义在includes/functions.lua中
self.sprite=createTouchableSprite（{
image="WhiteButton.png",
size=cc.size（500,600）,
label="TOUCHME!
",
labelColor=cc.c3b（255,0,0）}）
:
pos（display.cx,display.cy）
:
addTo（self）
drawBoundingBox（self,self.sprite,cc.c4f（0,1.0,0,1.0））
locallabelPoints=cc.ui.UILabel.new（{text="",size=24}）
:
align（display.CENTER_TOP
升级会员 