Mousedown event firing twice (WPF)

Question

I am currently trying to capture a mousedown from an image on a simple grid. I have no problems with the event firing, it is just that it fires twice. And because clicking it twice will eventually have a different state (it will show an expanded image), going straight to second click is causing problems.

My current code is as follows:

XAML

<Window x:Class="WpfApplication.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid Background="Transparent" x:Name="MainContent" MouseDown="Generic_MouseDown">
        <Image Source="http://www.blogcdn.com/www.engadget.com/media/2011/05/welcome-kansas-city-google-high-speed-internet.jpg" Height="100" Width="100" MouseDown="Generic_MouseDown"/>
    </Grid>
</Window>

Code:

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }

    private void Generic_MouseDown(object sender, MouseButtonEventArgs e)
    {
        if (((FrameworkElement)e.Source).GetType() == typeof(System.Windows.Controls.Image))
        {
            Console.Out.WriteLine("image clicked");
        }
        else
        {
            Console.Out.WriteLine("grid clicked");
        }

    }
}

So when I click the image, it fires mousedown twice.

Thanks!

score 16 · Answer 1 · edited May 17 '11 at 18:49

16

private void Generic_MouseDown(object sender, MouseButtonEventArgs e)
{
    if (((FrameworkElement)e.Source).GetType()   
           == typeof(System.Windows.Controls.Image))
    {
        Debug.WriteLine("image clicked");
        e.Handled = true;
    }
    else
    {
        Debug.WriteLine("grid clicked");
    }

}

You need to set the Handled property to true.

edited May 17 '11 at 18:49

Robert Harvey

178,213
47
333
501

answered May 17 '11 at 17:57

Mike Diaz

2,045
4
32
55

1

Wow, that was easier than I thought! Thanks a lot! :) – Angelus May 17 '11 at 18:03
After over an hour searching and debugging, I finally found this! – Evils Aug 16 '13 at 13:29
While this works, it might be worth to consider registering the event just once like in @Ahmed Ghoneim answer. – sa.he Feb 10 '20 at 09:52

score 6 · Answer 2 · answered May 17 '11 at 17:55

You would need to set e.Handled to true to prevent the event from bubbling up from the Image to the Grid.

Effectively, what is happening is the event is raised on the Image, then if it's not handled it is raised on the Grid, and so on up the visual tree.

score 2 · Answer 3 · answered May 17 '11 at 23:11

This is your XAML & you added [ MouseDown="Generic_MouseDown" ] Twice to Grid & Image

<Window x:Class="WpfApplication.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            Title="MainWindow" Height="350" Width="525">
        <Grid Background="Transparent" x:Name="MainContent" MouseDown="Generic_MouseDown">
            <Image Source="http://www.blogcdn.com/www.engadget.com/media/2011/05/welcome-kansas-city-google-high-speed-internet.jpg" Height="100" Width="100" MouseDown="Generic_MouseDown"/>
        </Grid>
    </Window>

Make It Like that ONE [ MouseDown="Generic_MouseDown" ] in Grid

<Window x:Class="WpfApplication.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            Title="MainWindow" Height="350" Width="525">
        <Grid Background="Transparent" x:Name="MainContent" MouseDown="Generic_MouseDown">
            <Image Source="http://www.blogcdn.com/www.engadget.com/media/2011/05/welcome-kansas-city-google-high-speed-internet.jpg" Height="100" Width="100" />
        </Grid>
    </Window>

OR

Make It Like that ONE [ MouseDown="Generic_MouseDown" ] in Image

<Window x:Class="WpfApplication.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            Title="MainWindow" Height="350" Width="525">
        <Grid Background="Transparent" x:Name="MainContent">
            <Image Source="http://www.blogcdn.com/www.engadget.com/media/2011/05/welcome-kansas-city-google-high-speed-internet.jpg" Height="100" Width="100" MouseDown="Generic_MouseDown"/>
        </Grid>
    </Window>

Mousedown event firing twice (WPF)

3 Answers3