Analogue of tunneling events in UWP

Question

Hello,

I develop UWP app using C# and XAML.

What I need to do is:

1. Show Popup (IsLightDismissEnabled = false) by clicking on the button.
2. Hide this Popup (IsOpen = false) by clicking somewhere outside the Popup.
   In other words I need to implement the analogue of IsLightDismissEnabled, because default behavior is not suitable for me (Popup is closed when app minimized / overlap by other app)

The idea is to handle Tapped event of the page's root element. It works, but if page contains other elements and you subscribe to Tapped event of these elements - these handlers are fired too. Because initially Tapped event raises on the top of visual tree and then goes down towards root element.

In WPF there were tunneling events. For example you can subscribe to PreviewMouseDown event of the root page element and cancel it, and then event handlers for child elements will not be invoked. I want to do the same, but for UWP app. Is it possible?

XAML:

C#:

Answer 1

Finally based on above discussions if you have to set IsLightDismissEnabled = false and want to close popup by clicking somewhere outside you can:

1) Create follow XAML code:

<Page>
<Grid x:Name="OuterGrid">
<Grid x:Name="InnerGrid">
// all other content
</Grid>
</Grid>
</Page>

2) When popup is opened - set IsHitTestVisible = False for InnerGrid and subscribe to Tapped event of OuterGrid (and inside of event handler you need to close popup)

3) When popup is closed - set IsHitTestVisible = True for InnerGrid and unsubscribe from Tapped event of OuterGrid.

Answer 2

Hello,

Welcome to Microsoft Q&A!

I want to do the same, but for UWP app. Is it possible?

You could set the TappedRoutedEventArgs.handled property as true in the Tapped event. Then the event won't go down to its parent control. For example, if you have a root Gird and on that Grid, you have a rectangle. In the Tapped event of the rectangle, if you set the TappedRoutedEventArgs.handled as true, then the tapped event of the Grid won't be fired.

Like this:

private void Rectangle_Tapped(object sender, TappedRoutedEventArgs e)  
        {  
            e.Handled = true;  
            //do something  
        }  

Thank you.

---

If the response is helpful, please click "Accept Answer" and upvote it.
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.