Handling touches

Dikkesnoek · July 2012

Hi there,

I still don't get touches work on the iPhone. I've checked the examples and the tips in this forum. In main, 6 blocks will be created on the screen. I've also created a separate block class. When I touch the screen anywhere I will move all the 6 blocks at once (I don't even have to touch one of the blocks). I like to move the blocks separately to different positions. Here are some code fragments:

 
------------
-- main.lua
------------
 
-- Create multiple blocks.
for i = 0, 5 do
	-- The block image.
	local blockSprite = Bitmap.new(Texture.new("3D_Block3.png"))
 
	-- Create new block.
	local block = Block.new(blockSprite)
 
        -- Place blocks in the bottom screen side by side.
	block:setPosition((i * 150) + 32, 540)
	stage:addChild(block)
end
 
------------
--block.lua
------------
 
Block = Core.class(Sprite)
 
function Block:init(sprite)
	-- Register touch events.	
	self:addEventListener(Event.TOUCHES_BEGIN, self.onTouchesBegin, self)
	self:addEventListener(Event.TOUCHES_MOVE, self.onTouchesMove, self)
	self:addEventListener(Event.TOUCHES_END, self.onTouchesEnd, self)
	self:addEventListener(Event.TOUCHES_CANCEL, self.onTouchesCancel, self)
 
	self:addChild(sprite)
end
 
-- If block is on focus, stop propagation of touch events
function Block:onTouchesBegin(event)
	if self.id == nil then
		self.id = event.touch.id
 
		print("BEGIN")			
 
		-- Get start postion.
		self.x0 = event.touch.x
		self.y0 = event.touch.y
	end
end
 
-- If block is on focus, stop propagation of touch events.
function Block:onTouchesMove(event)
	if self.id == event.touch.id then
 
		print("MOVE")
 
		-- Calculate delta value.
		local deltaX = event.touch.x - self.x0
		local deltaY = event.touch.y - self.y0
 
		-- Update new postion.
		self:setX(self:getX() + deltaX)
		self:setY(self:getY() + deltaX)
 
		-- Store the new postion.
		self.x0 = event.touch.x
		self.y0 = event.touch.y
	end
end
 
-- If block is on focus, stop propagation of touch events.
function Block:onTouchesEnd(event)
	if self.id - event.touch.id then
 
		print("END")
 
		self.id = nil
	end
end
 
-- If touches are cancelled, reset the state of the button.
function Block:onTouchesCancel(event)
	if self.focus then
		self.focus = false;
		self:updateVisualState(false)
		event:stopPropagation()
	end
end

Thanks again,

Marc

atilim · July 2012

Your handling of touch ids is totally correct. But you just need to do hit testing on onTouchesBegin:

function Block:onTouchesBegin(event)
	if self.id == nil and self:hitTestPoint(event.touch.x, event.touch.y) then
		self.id = event.touch.id
 
		print("BEGIN")			
 
		-- Get start postion.
		self.x0 = event.touch.x
		self.y0 = event.touch.y
	end
end

And there is a small bug on onTouchesMove. The line

self:setY(self:getY() + deltaX)

should be

self:setY(self:getY() + deltaY)

And on onTouchesEnd the line

if self.id - event.touch.id then

should be

if self.id == event.touch.id then

And finally you should implement onTouchesCancel same as onTouchesEnd

Dikkesnoek · July 2012

Thanks atilim, it works great! Also always dangerous to copy lines and change X to Y values. Can you tell me more about the "hitTestPoint". I've seen it before, what does it mean? Are there also differences between using touches (speed, sensitivity) on the Gideros Player or on the final compiled App?

Marc

talis · August 2012

@Dikkesnoek as far as i understand, hittest can be explained like this;
1-In your code each block is an object. So actually each of these blocks have some pointer like identifier in Gideros. (memory id like every person has only one tax code in real life, or Social security number in America vs..)
2-And each of these block also has event listener registered.
3-When you touch your screen Gideros studio should have to match your touch with the block's id. (which one you touched) and after it it should start to move that specific block.
4-If you will not do this matching this move will be common for or your blocks hence you have event listener registered for all your blocks.

Of course i am no pro but it seems to me my explanation is legit

ar2rsawseen · August 2012

@talis basically yeah

But from more techy point:
You may have multiple objects with assigned event listeners
When you touch the screen a touch event is dispatched to all of them (starting from the top ones and to the bottom)
Inside event listener you put hitTestPoint, to test was the area of current object touched. It basically checks if touch point is inside the object.
If it is then user touched this point and you know it, you may now do what you wanted to do.

If you do not use hitTestPoint then all code from all touch/mouse listeners will be executed for all objects you've assigned them to. There will be no telling, which object did the user touched.

Next thing to understand, that there also may be a situation, when there a couple object one on the other. So if hitTestPoint only checks x and y coordinates, then it can not determine which of the stacked objects was actually touched and execute code for all of them. This is true.

In this situation, event goes from the top visible objects to the other object under them. So if you check for a hitTestPoint and received the positive answer, it is a good practice to stop propagating event, so others under it won't receive same event (unless of course you want them to).

So basic model of using touch/mouse events could look like this:

someobject:addEventListener(Event.MOUSE_DOWN, function(e)
      if someobject:hitTestPoint(e.x, e.y) then
            --execute your code here
            e:stopPropagation()
      end
end)

talis · August 2012

@ar2rsawseen thanks for the detailed info. I always want to know what is going on in the background while somethings going on. So for me this explanation worths so much.$-) $-) $-)
But i also was close

Howdy, Stranger!

Categories

In this Discussion

Top Posters

Handling touches

Comments

Howdy, Stranger!

Quick Links

Categories

In this Discussion

Top Posters

Handling touches

Comments