Recibiendo notificación de cuándo hacemos clic fuera del elemento que tiene el ratón

Suena rarísimo, pero si quieres que cuando el elemento que ha capturado el ratón reciba una notificación de cuándo el usuario pulsa fuera del mismo, aquí tienes un buen post de las locuras que te esperan:

Muhammad Shujaat Siddiqi

Exploring the world of software engineering…

This post is about a very specific problem about mouse capturing. There are certain situations in which we need to be notified when mouse is clicked outside the bounds of an element. As all of you know that this is classical mouse capturing situation used for various tasks including Drag & Drop. When we search around for a solution for this then we find out an attached event Mouse.PreviewMouseDownOutsideCapturedElement. This is documented in msdn as follows:

“Occurs when the primary mouse button is pressed outside the element that is capturing mouse events.”

<Window x:Class="WpfApplication3.Window1"



        Title="Window1" Height="483" Width="553"      

Mouse.PreviewMouseDownOutsideCapturedElement="Window_PreviewMouseDownOutsideCapturedElement" >


        <StackPanel Height="33">

            <TextBox Name="textBox1" />


        <StackPanel  >           

            <Button Content="Button" Height="32" HorizontalAlignment="Left"

                    Margin="126,209,0,0" Name="button1" VerticalAlignment="Top"

                    Width="297" Click="button1_Click" />




This definitely does what it is supposed to do. In order to get this to work we must have a captured element. Let’s capture mouse on textBox1. So, clicking a mouse outside textBox1 (captured element) should result in causing this handler to get called.

public partial class Window1 : Window


    public Window1()





    private void Window_PreviewMouseDownOutsideCapturedElement(object sender, MouseButtonEventArgs e)





    private void button1_Click(object sender, RoutedEventArgs e)






Let’s run this. We have the display as presented in XAML. It has a TextBox and a Button. When we click the button textBox1 captures the mouse using static Capture method on Mouse. We have subscribed PreviewMouseDownOutsideCapturedElement event in XAML. We could have easily done that in code behind as well. Obviously we would need AddHandler… mechanism for registering with an attached event. This is similar to XAML attached properties. When implemented in WPF, they work as Dependency properties. Similarly Attached events from XAML are implemented as routed events in WPF.

Now the issue is that this event gets fired even when we click inside textBox1. This seems awkwardly strange as this is purely not expected behavior when we read the msdn description. Now we know the behavior. How can we fix this? We just need to find out where the mouse was clicked and we should be good to go. You might be wondering we can get around that we can do that either through the sender parameter or Source / OriginalSource from MouseButtonEventArgs. But the strange thing is that sender is always the element on which the event is registered. So if were registering it on textBox1, it would be textBox1. Currently this would always be the Window object no matter where we click on the Window after capturing the mouse by clicking the button. On top of that, Source and OriginalSource are always the captured element. The other properties which could inform us if the mouse is directly over the textBox1 are always true.

The only way to fix it seems to be to do it ourselves. We can find out the position of mouse. If the position of mouse is within the bounds of captured element then we can just ignore this. Otherwise, we can execute the same logic as we were supposed to execute. We might need to register the event again.


private void Window_PreviewMouseDownOutsideCapturedElement(object sender, MouseButtonEventArgs e)


    bool isClickedWithin =  IsMouseClickWithin(this.textBox1, e.MouseDevice.GetPosition(this.textBox1));




        //execute some logic




private bool IsMouseClickWithin(FrameworkElement element, Point point)


    return (element.ActualWidth > point.X && element.ActualHeight > point.Y) || point.X < 0 || point.Y < 0;



In the above example, it is checking if the mouse position is within the actual bounds of textBox1. IsMouseClickWithin returns true for this. It returns false otherwise.

En definitiva, más cutre imposible, pero dice que funciona. Vamos a probarlo.



Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de

Estás comentando usando tu cuenta de Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s