Event listeners overlapping

Getting Started Newbie Questions
#1

I have a function to create a box where the user clicks, and when the user clicks on that same box I want it to be removed from the display. My problem is the box gets removed and then created again because the two events are happening one after another.

I have the createBox function bound to the “tap” event on the background and the “tap” event on the box bound to an anonymous function that removes the box.

I’m pretty new to corona, suggestions on how to best handle this is much appreciated!

local width = 100 local physics = require("physics") physics.start() uiGroup = display.newGroup() background = display.newRect(uiGroup, display.contentCenterX, display.contentCenterY, display.contentWidth, display.actualContentHeight) background:setFillColor(1,0,0) background.alpha = 1 background.isHitTestable = true background:toBack() local function createBox(event)     little\_rect = display.newRect(uiGroup, event.x, event.y, width/4, width/4)     physics.addBody(little\_rect, "static")     print("created box")     little\_rect:addEventListener("tap", function(event)         print("removed box")         display.remove(little\_rect)     end) end background:addEventListener("tap", createBox)
#2

With touch listeners, you often want to include this line of code at the very end of your function:

return true

By including this bit, the touch listener will block the touch event from interacting with other objects below it (i.e. you stop the touch event propagation, which seems to currently be occurring).

Also, you don’t need to include this bit “background.isHitTestable = true” if an object is visible. That is only needed if you have an object that is invisible, but you still want to be able to touch it.
 

#3

The other issue is all the boxes are created with the same global variable little_rect. When a box is tapped, the last box gets removed instead of the one that’s being tapped on. Change the line to this will fix it:

local little_rect = display.newRect(uiGroup, event.x, event.y, width/4, width/4)

BTW, you should also change other variables to local variables unless you really need them to be global.

Dave

#4

Thank you all, your comments have been very helpful and I’ve solved my issue!  :slight_smile:

#5

With touch listeners, you often want to include this line of code at the very end of your function:

return true

By including this bit, the touch listener will block the touch event from interacting with other objects below it (i.e. you stop the touch event propagation, which seems to currently be occurring).

Also, you don’t need to include this bit “background.isHitTestable = true” if an object is visible. That is only needed if you have an object that is invisible, but you still want to be able to touch it.
 

#6

The other issue is all the boxes are created with the same global variable little_rect. When a box is tapped, the last box gets removed instead of the one that’s being tapped on. Change the line to this will fix it:

local little_rect = display.newRect(uiGroup, event.x, event.y, width/4, width/4)

BTW, you should also change other variables to local variables unless you really need them to be global.

Dave

#7

Thank you all, your comments have been very helpful and I’ve solved my issue!  :slight_smile: