"onPress" on switch hides overlay

[hoffmann.michael86]

Hi,

I use a switch in a scene overlay which I use as checkbox as described here. 

I use an image in the background to detect taps on it to be able to close the overlay:

 -- alpha overlay local alphaOverlay = display.newRect(mainGroup, ssk.core.centerX, ssk.core.centerY, display.actualContentWidth, display.actualContentHeight) alphaOverlay:setFillColor(unpack(\_BLACK\_)) alphaOverlay.alpha = 0.4 local function backgroundTouchListener(event) composer.hideOverlay("fade", 200) return true end alphaOverlay:addEventListener("tap", backgroundTouchListener)

Button presses do not close the overlay because I use “return true” in the tap handler. This works fine:

 local function feedbackButtonHandler(event) doAnything() return true -- Prevents tap/touch propagation to underlying objects end feedbackButton = display.newImageRect(mainGroup, "scene/menu/img/button\_mail.png", buttonWidth, buttonHeight) feedbackButton.x, feedbackButton.y = overlayBackground.x, analyticsCheckbox.y + 50 feedbackButton:addEventListener("tap", feedbackButtonHandler)

Switch event handling:

 local checkboxSheet = graphics.newImageSheet("scene/settings/img/checkbox\_spritesheet.png", { width = 36, height = 36, numFrames = 2, sheetContentWidth = 73, sheetContentHeight = 36 }) local function onTutorialSwitchPress() doAnything() end tutorialCheckbox = widget.newSwitch( { style = "checkbox", width = 25, height = 25, onPress = onTutorialSwitchPress, sheet = checkboxSheet, frameOff = 1, frameOn = 2 } ) tutorialCheckbox.x, tutorialCheckbox.y = overlayBackground.x + width/4 , tutorialText.y tutorialCheckbox:setState({isOn = myData.settings.firstTimeUseTutorial}) mainGroup:insert(tutorialCheckbox)

But if the checkbox is pressed the overlay gets closed.

My question is if I can prevent tap/touch propagation to underlying objects on my checkbox?

[rob]

Can you share your switch event handling code?

Rob

[hoffmann.michael86]

@Rob Miracle: Done!

[rob]

Maybe try:

 local function onTutorialSwitchPress() doAnything() return true end

[hoffmann.michael86]

@rob

Maybe try:

 local function onTutorialSwitchPress() doAnything() return true end

This was the first thing I tried but unfortunately without success.

[anon63346430]

I would assume this is happening because the onPress event for the switch is not a “tap event” and therefore the “tap event” is still firing on the objects below the switch control.

Instead of using newSwitch, why not just have an image and switch between two images (and “on” image and an “off” image using a fill or the sam imagesheet you are using already) and a “tap event” to perform the switch.  This will then keep all our touch events the same type.

[rob]

It’s not quite that straight forward. It’s a touch event (that does properly return true to stop propagation), but the onRelease, onPress and onEvent handlers are called from the internal touch handler. onPress and onRelease behave like tap events, onEvent behaves more like a touch event in that it has a began and ended phase.

Do you by any chance have a tap handler on your background?

Rob 

[anon63346430]

He does Rob, thus my suggestion on making all events tap to stop the propagation.

How about adding a variable to control whether touch events can fire or not?

  local canTap = true     local function backgroundTouchListener(event)     if canTap then       composer.hideOverlay("fade", 200)     end     return true   end   alphaOverlay:addEventListener("tap", backgroundTouchListener)

then change the switch event to this (which will stop all other events firing for 100 ms)

  local function onTutorialSwitchPress(event)     doAnything()     canTap = false     timer.performWithDelay(100, function() canTap = true end)   end

[rob]

Can you share your switch event handling code?

Rob

[hoffmann.michael86]

@Rob Miracle: Done!

[rob]

Maybe try:

 local function onTutorialSwitchPress() doAnything() return true end

[hoffmann.michael86]

@rob

Maybe try:

 local function onTutorialSwitchPress() doAnything() return true end

This was the first thing I tried but unfortunately without success.

[anon63346430]

I would assume this is happening because the onPress event for the switch is not a “tap event” and therefore the “tap event” is still firing on the objects below the switch control.

Instead of using newSwitch, why not just have an image and switch between two images (and “on” image and an “off” image using a fill or the sam imagesheet you are using already) and a “tap event” to perform the switch.  This will then keep all our touch events the same type.

[rob]

It’s not quite that straight forward. It’s a touch event (that does properly return true to stop propagation), but the onRelease, onPress and onEvent handlers are called from the internal touch handler. onPress and onRelease behave like tap events, onEvent behaves more like a touch event in that it has a began and ended phase.

Do you by any chance have a tap handler on your background?

Rob 

[anon63346430]

He does Rob, thus my suggestion on making all events tap to stop the propagation.

How about adding a variable to control whether touch events can fire or not?

  local canTap = true     local function backgroundTouchListener(event)     if canTap then       composer.hideOverlay("fade", 200)     end     return true   end   alphaOverlay:addEventListener("tap", backgroundTouchListener)

then change the switch event to this (which will stop all other events firing for 100 ms)

  local function onTutorialSwitchPress(event)     doAnything()     canTap = false     timer.performWithDelay(100, function() canTap = true end)   end