How to have only the child callback be executed

How-to Discussions
1

I have the following but both callbacks are being executed how can I make only callback2 get executed:

<Panel>
  <Clicked Handler="{callback}" />
  <Panel>
    <Clicked Handler="{callback2}" />
  </Panel>
</Panel>
2

Hi Edwin.

Since you are not providing much information about your use-case, i’m not sure if my solution will work out for you (although i don’t see a reason why it shouldn’t).

The way you can solve this is to create a sibling relationship instead of a parent-child relationship:

<Panel><!-- surround them in another panel -->
	<Panel> <!-- place the second one on top since the draw order has changed as a result of them becoming siblings -->
		<Clicked Handler="{callback2}"/>
	</Panel>
	<Panel>
		<Clicked Handler="{callback1}"/>
	</Panel>
</Panel>

Here is a slightly more complicated example with some visual showing that it actually works:

<App>
	<Panel>
		<Panel Margin="50" Color="Red">
			<Clicked>
				<DebugAction Message="Bar2" />
			</Clicked>
		</Panel>
		<Panel Color="Green">
			<Clicked>
				<DebugAction Message="Foo1" />
			</Clicked>
		</Panel>

	</Panel>
</App>
3

I have not tried this yet, but I can’t believe I didn’t think about this, this actually might work. I always miss the small stuff. Yea I’m imagining right now how that would work thanks.