Screens on top of screens

Getting Started Newbie Questions
#1

This is probably pretty elementary but, my game starts up with a splash/menu screen. On that screen are several UI buttons that the players can click on before they start play. One example is the “High Score” screen. So I tap on the high score button, and then I do a new display group, add the background for the high scores, draw them and add a UI button to dismiss the score window.

The problem is that if I tap in the middle of the screen, where the menu buttons are hidden underneath the scores background, the taps pass on through to the screen underneath.

What am I missing to keep my taps from going past my scores screen?

local function scores()  
 highScores = display.newGroup()  
 local highScoresBg = display.newImage("scores\_bg.png")  
 highScoresBg.x = display.contentWidth / 2  
 highScoresBg.y = display.contentHeight / 2  
 highScores:insert(highScoresBg)  
 local highScoresBtn = ui.newButton{default="tap\_to\_continue.png", onRelease=scoresScreenCallback }  
 highScoresBtn.x = display.contentWidth / 2  
 highScoresBtn.y = display.contentHeight - 80  
 highScores:insert(highScoresBtn)  
 drawScores()  
end  
  
...  
  
function menu()  
 oldGameState = gameState;  
 gameState = "menu"  
  
 menuGroup = display.newGroup()  
 local menuScreenButton = ui.newButton{default="splash.png", onRelease=menuScreenCallback, x = display.contentWidth/2, y = display.contentHeight/2}  
 menuGroup:insert(menuScreenButton)  
  
 local playButton = ui.newButton{default="play\_btn.png", onRelease=play, x=display.contentWidth/2, y=249}  
 menuGroup:insert(playButton)  
  
 local settingsButton = ui.newButton{default="settings\_btn.png", onRelease=settings, x=display.contentWidth/2, y=297}  
 menuGroup:insert(settingsButton)  
  
 local creditButton = ui.newButton{default="credits\_btn.png", onRelease=credits, x=display.contentWidth/2, y=337}  
 menuGroup:insert(creditButton)  
  
 local scoresButton = ui.newButton{default="scores\_btn.png", onRelease=scores, x=display.contentWidth/2, y=387}  
 menuGroup:insert(scoresButton)  
  
 local helpButton = ui.newButton{default="help\_btn.png", onRelease=help, x=display.contentWidth/2, y=428}  
 menuGroup:insert(helpButton)  
  
end

I guess I could transition the menu off screen, but I’m not sure I want to do that.

Thanks
Rob
[import]uid: 19626 topic_id: 8924 reply_id: 308924[/import]

#2

Do you need the screen behind the high scores to be visible?

If not, you can just set the group behind the high scores screen to be invisible (isVisible = false) and it won’t register touch events. [import]uid: 52430 topic_id: 8924 reply_id: 32608[/import]

#3

If you do need to keep the screen behind the high score screen visible, which was the case in my game where I wanted to display a screen on top that was semi-transparent, you can add an even listener to to the highscore screen background that will gobble up all the touch events. This assumes your highScoresBg covers the entire screen or at least all the buttons on the screen below.

  
local function clickHighscoresBg( event )  
  
 return true  
  
end  
  
highScoresBg:addEventListener("touch", clickHighscoresBg)

This works well for me. [import]uid: 7863 topic_id: 8924 reply_id: 32919[/import]