Prevent Touch Events Through Layered Scenes

Solar2D General Questions/Discussion
#1

Hi all,

I just went to look at a short tutorial in the corona tutorial section on this, but the link is broken.

I have a pop up like menu that displays some info and gives the player the ability to make a few changes, but touch events are passing through to the scrollview in the background which then is causing other things to pop up on the screen.

Basically, I need to ensure that when this pop up is up, the scrollview no longer receives touch events until the player dismisses the popup either by confirming a selection or closing it.

thanks [import]uid: 170004 topic_id: 35528 reply_id: 335528[/import]

#2

I was able to figure out how to mask and unmask the scrollview. [import]uid: 170004 topic_id: 35528 reply_id: 141205[/import]

#3

Make sure you “return true”. It works for normal event-listeners not sure about pop-ups. [import]uid: 75779 topic_id: 35528 reply_id: 141207[/import]

#4

I would also add that when you have a popup of some kind, it can be useful to put a full screen invisible rect behind it and have that return true for touches / taps, so that the user can touch outside the popup without accidentally triggering events behind the popup.

Or you could have the invisible rect close the popup if the user touches outside it’s bounds.

I always have the global function in main.lua so I can use it in multiple scenes:

function newTouchBlocker(visible)  
 function Block(e)  
 return true  
 end  
  
 local blocker = display.newRect(0, 0, display.contentWidth, display.contentHeight)  
  
 if not visible then  
 -- we don't need to see it so make it invisible  
 blocker.isVisible = false  
 else   
 --or you could always make it a semi-transparent color (e.g. for a pause screen)  
 block:setFillColor(0, 0, 0, 64)  
 end  
  
 -- we DO need to be able to touch it though  
 blocker.isHitTestable = true   
  
 --and we want to block both touches and taps  
 blocker:addEventListener("touch", touchBlocker)  
 blocker:addEventListener("tap", touchBlocker)  
  
 return blocker  
end

Then just before my popup items are created I would do:

[code]

–param sets whether it is visible or not
local block = newTouchBlocker( true )
local myPopupStuff = display.new…
[/code] [import]uid: 84115 topic_id: 35528 reply_id: 141229[/import]

#5

I was able to figure out how to mask and unmask the scrollview. [import]uid: 170004 topic_id: 35528 reply_id: 141205[/import]

#6

Make sure you “return true”. It works for normal event-listeners not sure about pop-ups. [import]uid: 75779 topic_id: 35528 reply_id: 141207[/import]

#7

I would also add that when you have a popup of some kind, it can be useful to put a full screen invisible rect behind it and have that return true for touches / taps, so that the user can touch outside the popup without accidentally triggering events behind the popup.

Or you could have the invisible rect close the popup if the user touches outside it’s bounds.

I always have the global function in main.lua so I can use it in multiple scenes:

function newTouchBlocker(visible)  
 function Block(e)  
 return true  
 end  
  
 local blocker = display.newRect(0, 0, display.contentWidth, display.contentHeight)  
  
 if not visible then  
 -- we don't need to see it so make it invisible  
 blocker.isVisible = false  
 else   
 --or you could always make it a semi-transparent color (e.g. for a pause screen)  
 block:setFillColor(0, 0, 0, 64)  
 end  
  
 -- we DO need to be able to touch it though  
 blocker.isHitTestable = true   
  
 --and we want to block both touches and taps  
 blocker:addEventListener("touch", touchBlocker)  
 blocker:addEventListener("tap", touchBlocker)  
  
 return blocker  
end

Then just before my popup items are created I would do:

[code]

–param sets whether it is visible or not
local block = newTouchBlocker( true )
local myPopupStuff = display.new…
[/code] [import]uid: 84115 topic_id: 35528 reply_id: 141229[/import]