Implementing a modal layer which disables touches to all lower layrs/menus/nodes

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

Implementing a modal layer which disables touches to all lower layrs/menus/nodes

(15 posts) (12 voices)

Started 1 year ago by glennpow
Latest reply from rombos

Tags:

glennpow
Member

I'm trying to implement a system so that my main CCLayer can have other "modal" layers stacked on top of it (similar to modal dialogs), which would disable touches from propagating down to any lower layer in the stack until the topmost layer is dismissed.

So far, I can think of a few ways to do this, but none are very appealing:

1. Either I have to keep track of the modal-stack-depth, and then make sure any touch delegate added to a modal layer uses a priority which will trump any delegates prioritized on the lower layers. This is, of course, very unclean and wouldn't work with the current CCMenu implementation (it would have to be subclassed to handle dynamic priorities).

2. Or I simply keep a list of all touch delegates added for each modal layer, and then add/remove them accordingly from the touch manager each time the modal stack changes. This is also a pain in the neck, and would probably require some poking around in the touch manager.

3. A final method would be of course to just write all my own components and make sure the modal CCLayer classes are the only nodes that receive touches (which they will then propagate to their custom child components). Then I could just add/remove the modal layers from the touch manager when the modal stack changes, which would be less of a headache.

Has anyone else tackled this problem? Or do most people just avoid having modal dialogs in their games? Well, any thoughts are welcome.

Posted 1 year ago #
Verisutha
Member
I did it just the other day for my dialog boxes..

Just be sure you call that "before" you create the menus for the dialog. If you don't you'll disable yourself.

I pass in the top layer to my dialog box, and then it will call and disable all the menus for that specific node. It will go through all subnodes and disable the menus (or enable, depending on the _enabled flag)

Hope this helps.
```
-(void)MenuStatus:(BOOL)_enable Node:(id)_node
{
	for (id result in ((CCNode *)_node).children) {
		if ([result isKindOfClass:[CCMenu class]]) {
			for (id result1 in ((CCMenu *)result).children) {
				if ([result1 isKindOfClass:[CCMenuItem class]]) {
					((CCMenuItem *)result1).isEnabled = _enable;
				}
			}
		}
		else
			[self MenuStatus:_enable Node:result];
	}
}
```
Posted 1 year ago #
glennpow
Member

Ya, I've been avoiding a solution that would have to do a full scene-graph traversal each time a modal dialog shows or hides. Thanks for the code though. I might have to go this route in the end.

Posted 1 year ago #
jd
Member

CCTouchDelegate - set priority low and swallow touches. CCMenu has -128 priority by default, so you want to have a value lower than that on your layer or window in the foreground.

Posted 1 year ago #
Freddy
Member
Nice, Verisutha's code solved my problem with stacking menus + layers + menus, to call that method I went like this:
```
//page was defined at the interface so I could disable menus in a layer
CCLayer *page;
//then when you need to disable that layer menus
[self MenuStatus:YES Node:page];
```
I still think it would be nice to have an extra property in CCLayer to disable everything at once if needed

In my case using a lower than -128 priority was not an option because that would block any menu, in my case I have menus in the disabled layer and also in the layer stacked on top.
Posted 11 months ago #
BenTidman
Member
You could also try using NSNotification (which is the route I'm going to try). Send a notification like "ToggleTouchEnabled" for the init of your modal dialog and subscribe to it in all your other layers that have menus (you could add this step to a parent class that all your layers inherit from like the AdvancedLayer class that I posted below). Then just add your selector function which toggles isTouchEnabled on that layer. This blocks all touches for the layer including menus. Your dialog could listen for the same notification and just do a check to see if the sender of the notification is the same object that's receiving before you disable it's menus.
```
@implementation AdvancedLayer

-(id)int{
    if( (self=[super init] )) {
        [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(toggleTouchEnabled:) name:@"ToggleTouchEnabled" object:nil];
    }

    return self;
}

-(void) toggleTouchEnabled:(NSNotification*)note {
    AdvancedLayer *sender = (AdvancedLayer*)[note object];
    if(sender != self)
    {
        self.isTouchEnabled = !self.isTouchEnabled;
    }
}

@end
```
Posted 10 months ago #
ishadow
Member

I use a CClayer with <CCTargetedTouchDelegate>. Then simply in
-(BOOL) CCTouchBegan....{
return YES;
}

All My touchable items have priority 0, so it seems that Z order takes control of touch priority, or at least it works this way.

Also, I have my own Button and other interface items classes and I added "BOOL active" property to each one of them. When button is not active, it does not process any touches. Useful for animating menu items and transitions.

Posted 10 months ago #

Mazyod
Member

Ok, so I also had my own dialog classes that must disable touches.. What I did was a Dialog superclass with the following init method:

-(id)init{
	if ((self = [super init])) {
		[[CCTouchDispatcher sharedDispatcher] addTargetedDelegate:self priority:kCCMenuTouchPriority swallowsTouches:YES];

		...

		[[[CCDirector sharedDirector] runningScene] addChild:self z:10];
	}
	return self;
}

Clean and simple... I think.

Posted 10 months ago #

sek117
Member

I have found Verisutha's and Freddy's approach simpler and easier and it works like charm! Thanks!

Posted 10 months ago #
krstn
Member

I once had to implement modal dialogs [I call them popups :)] as well.

I didn't wanted to go Mazyod road, as I wanted to have a popup and see what's behind the window. I also didn't wanted to show a non-cocos2d window as for me it seems very ugly. Since everything in my game is themed one way I wanted to have popups like this as well. Also - I have a lot of popups which ask about name, amount etc. Everything [accept for text fields (for messaging) and inputfields (for short strings)] is cocos2d.

I've tried fiddling with touches and taking control over it, but unfortunately it is often that I push a new scene and then open a popup. In this scenario, running scene is still pointing to the old one, instead of the new one. I couldn't get pass that.

So I ended up with Verisutha approach. All my scenes are subclasses of my custom CCScene implementation. So everything on screen is always a child of this class. In there I have a method which goes through my nodes and disables them. It's not only CCMenu. I've got scrolling lists, table views, custom labels and images [on touch there's a popup with description] and everything needs to be disabled.
Also... if you are implementing this, keep in mind that some items on scene might have been disabled beforehand! For example, I've got this custom menu, where by touching an item, it will disable itself and enable other items [I use it to categorize table views]. So if I open a popup where buttons A,B & D are disabled and C is enabled I want to have the same state after popup is closed. Another scenario: let's say you have a map. You click on one of the tiles and a big layer is shown with some information on it. When something like this happens I disable map/hud etc. But then on this layer I can touch an icon and a description popup will open up. It has to disable everything on this layer. After popup is closed, layer needs to be enabled but map remains disabled.

As you can see it's quite complicated [although it runs smooth even on my 2nd gen ipod touch].
If anyone figures out how to handle taking over touch when adding a "modal" layer and then another one on top of that, and how to handle scene changes in the middle of it I would really appreciate sharing it :)

Posted 5 months ago #
Blue Ether
Member

I use a pretty simple method for this. I didn't want to muck around with multiple Layers, so I create a special menu which I use for blocking out all the other menus. The menu has only one menu item. In my case, its a small black sprite scaled up to fill the entire screen (and then some, just to be sure). I can tweak its opacity as I see fit to cause the background to dim, but it can also be invisible. The menu's priority with the touch handler is set to be higher than everything else, and whatever appears on top of it gets a higher priority still. Whenever a popup dialog appears, I set this hidden menu to isEnabled and visible, and when I'm done I set these to false again. It's quite simple and I've never had any problems with it. If I want, I can even assign actions to take place when it is touched. Since the menu swallows all touches anywhere on the screen that didn't get taken by the items in the popup that I set to a higher priority, nothing else can be touched.

Posted 5 months ago #
krstn
Member

@Blue Ether you can use CCLayerColor to fill the whole screen - no need to play with sprites. It can handle alpha channel as well

Posted 5 months ago #
Blue Ether
Member

@krstn: CCLayerColor doesn't capture touches? Also, all of my interface elements are in a single SpriteBatchNode, so I need a CCSprite.

Posted 5 months ago #
zardon
Member

Is there any code samples that do this out of the box, I am unsure of what to feed Verisutha's approach and would like to see in it in context of some wider code. A simple CCMenu that gets disabled with a Modal view over the top will be fine

Posted 3 months ago #
rombos
Member

Look here in my blog for a sample that does exactly what you are looking for: http://wp.me/p1s9ex-2S
Regards, HJ

Posted 2 months ago #

RSS feed for this topic

Reply

You must log in to post.