transparent menu backgrounds « cocos2d for iPhone

cocos2d for iPhone » Programming » cocos2d support (graphics engine)

transparent menu backgrounds

(15 posts) (6 voices)

Started 2 years ago by lolcoder
Latest reply from lolcoder

Tags:

moveto
scene

lolcoder
Member

Hi,

I'm looking to create a menu for my game, for pausing/game over screens, and I want it to 'float' above my sprites.

I've tried creating a new scene with my menu layer, and adding it by doing a push scene. This however resets the background so I don't see the game paused under the menu.

I've also tried putting the menu layer in my main game play layer, and then making it hidden until I want to show the pause menu. I have a problem with that because the menu buttons remain active even if they're hidden, so I can accidentally return the main menu by tapping the button, even though it's not there.

Is there a good way to do this?? Can I make the buttons inactive so they don't do anything when tapped, or should I have a flag in that layer, and then simply check if the menu is active or not?

Thanks

Posted 2 years ago #
PhilM
Member

I do this by just having the menu as a layer (instead of a scene), with a ColorLayer of black set to an opacity between 120-200 to give a faded look, and the menu items added on top.

The menu layer is set to swallow all touches (using the new TouchDispatcher in 0.8), to stop any interactions with the underlying game while the menu is active. You could also do that in the old 0.7 touches by catching all occurrences.

To stop the menu working during normal game play, I just added showMenu & hideMenu methods that simply position the menu on/off screen, instead of disabling buttons etc. Possibly not the best way, but works fine for me...

Hope that helps.

Phil

Posted 2 years ago #
lolcoder
Member

thanks for the tips, phil.

i haven't tried out the 0.8 beta yet... i'm still using 0.7.1, actually. lol.

i'll have a look at the new touch dispatcher, though. for now, how do i catch occurrences of the touch? the items in my menu are actual cocos MenuItems, so they just have callback functions in my class. will a ccTouchesEnded for that layer get called first (so i can return kEventIgnored)??

Posted 2 years ago #
PhilM
Member

Sorry, probably confused you a bit there with the 0.8 touch stuff.

To clarify, in 0.7 you could probably just touch enable your menu layer, and just implement the regular ccTouchesBegan/Moved/Ended methods, returning kEventHandled to stop any touches reaching the game layer (as the menu items are on top, they can still be clicked and handled fine).

When the menus hidden, positioning it off screen (e.g. setPosition:ccp(500, 0)) might mean the touches make it through to the game layer as usual (haven't tried this). If not, you could add a check in your ccTouchesBegan/Moved/Ended methods to return kEventIgnored if the menus position is off screen, and kEventHandled if its on screen.

Not sure if I've explained that very well. Does it make sense to you?

Phil

Posted 2 years ago #
byers
Member

hi there, just reading through this thread and i like your ColorLayer idea. i'm not very familiar with opengl, so i'm a bit at a loss when i need to start creating the color value as a GLuint.

are you using any helper methods in the api that would convert an rgb to a gluint?

this is a bit off topic, i can start a new thread if that's more appropriate.

thanks

Posted 2 years ago #
PhilM
Member

I'm using:

ColorLayer *bgLayer = [ColorLayer layerWithColor: 0x000000ff];
[bgLayer setOpacity:200];
[self addChild:bgLayer z:-1];

Posted 2 years ago #
byers
Member

excellent, thank you.

Posted 2 years ago #
lolcoder
Member

hi phil,

thanks for the clarification... moving the menu would certainly work - but i wish there was a way to just disable the menu instead.

Posted 2 years ago #
PhilM
Member

@byers: no probs ; )

@lolcoder: according to the api (http://www.cocos2d-iphone.org/api-ref/0.7.3/) MenuItem has an isEnabled property that sounds like it might work, although you'd need to loop through each item to set it.

Phil

Posted 2 years ago #
cublah
Member

When creating the color layer and the menu layer, just make the layers invisible and make them visible when you need them. You can control the touches by putting 'if (self.visible==NO) return kEventIgnored;' in the touch functions.

That way you can keep the menu where you like but just hide it till you need it.

Hope that makes sense

Posted 2 years ago #
mille562
Member

You could create the menu layer and not add it to a parent. Then when you want it to show, add it to it's parent node. When you don't need it, remove it from it's parent node.

Posted 2 years ago #
mille562
Member

[edit: removing duplicate post]

Posted 2 years ago #
lolcoder
Member

phil - i thought i tried setting isenabled but had some issues - it was a little while ago and i had moved on to other parts of my game, so i forget why exactly i stopped trying to do that.

cublah - yeah, that's an option as well.

mille - i didn't think of that. but if i want to return to the game from the menu, i'll need some way of knowing that i'm done with that layer, but i can't use a callback, because that layer will still be active...

anyway, thanks for all the tips!

Posted 2 years ago #
jd
Member

You can definitely set MenuItems.isEnabled = NO which will make them non-clickable. See my post on Combining 3 lines to 1. I do it there.

If you want your Menu in the Layer but hidden and non-clickable, I think setting the z-order to a lower number than the rest of layer (even background) would shield them from clicks. Then change the z-order to highest number when ready. I think this would work.

Having the position off screen as mentioned prior should work too.

Posted 2 years ago #
lolcoder
Member

thanks jd - i think i was trying to do isEnabled on the whole layer, rather than each menu item. i'll have a look at it again.

Posted 2 years ago #

RSS feed for this topic

Reply

You must log in to post.