MouseDown for Ellipse不起作用

Question

I have a problem. I have an Ellipse: ellipse1 that is inside of a Canvas: canvas1. When I click on ellipse1, it's fill is changed from White to PaleVioletRed. When I click on another part of canvas1 the ellipse will be moved there. This works.

When I click again on ellipse1 its fill color doesn't change.

What's wrong?...

I have this XAML code for ellipse1:

<Ellipse Height="35" HorizontalAlignment="Left" Name="ellipse1" Stroke="Black" VerticalAlignment="Top" Width="70" Fill="White" StrokeThickness="3" Canvas.Left="71" Canvas.Top="70" MouseDown="pion_alb1_md"/>

This is C# part:

private void pion_alb1_md(object sender, EventArgs e)
{
    if (ellipse1.Fill == Brushes.White)
    {
        ellipse1.Fill = Brushes.PaleVioletRed;
    }
    else
    {
        ellipse1.Fill = Brushes.White;
    }
}

This is XAML code for canvas1:

<Canvas Name="piese_canvas" MouseDown="mouse_down_canvas_piese" Background="#43FCFFEB">
.......
</Canvas>

...and here is the C# part for canvas1:

private void mouse_down_canvas_piese(object sender, EventArgs e)
{
    if (ellipse1.Fill == Brushes.PaleVioletRed)
    {            
        Point c = Mouse.GetPosition(piese_canvas);

        if ((c.X > 81) && (c.Y < 311) && (c.X <160) && (c.Y >191))
        {
            Canvas.SetLeft(ellipse1, 72);
            Canvas.SetTop(ellipse1, 241);
            ellipse1.Fill = Brushes.White;
            Canvas.SetLeft(ellipse5, -12);
            Canvas.SetTop(ellipse5, 241);
        }
    }
}

Answer 1

Change the ellipse mouse down handle like below. If you don't set e.Handled = true the mouse event will also be handled by the canvas and mouse_down_canvas_piese will be called immediately afterwards. And since after moving the ellipse nearly completely lies in the "active area", Fill will be reset to White .

You could have found this out by debugging. Also note that your ellipse will never move to another position, since the new Top and Left values are hardcoded to 241 and 72.

private void pion_alb1_md(object sender, RoutedEventArgs e)
{
    if (ellipse1.Fill == Brushes.White)
    {
        ellipse1.Fill = Brushes.PaleVioletRed;
    }
    else
    {
        ellipse1.Fill = Brushes.White;
    }
    e.Handled = true;
}

Answer 2

I've copied your code into a new project, and it works differently to your description.

When I click on the ellipse, it changes colour. When I click on the canvas, the line if ((cX > 81) && (cY < 311) && (cX < 160) && (cY > 191)) returns false so the ellipse never moves. This is probably because all I have on the window is a canvas holding an ellipse, and the canvas doesn't have a location set.

So I can't recreate your problem. Can you provide more information about what is in the canvas, or in the window?

EDIT:

OK, I see the problem now. Try adding breakpoints to both of your methods. Any clicks on the ellipse are also handled by the canvas (part of WPFs routed events). When the ellipse has moved, any clicks on it are inside the bounds of the canvas's special zone, and so it is changed to PaleVioletRed (because the ellipse was clicked on) and then immediately changed to White (because the canvas was clicked in the right place).

Try changing your ellipse click handler to:

private void pion_alb1_md(object sender, RoutedEventArgs e)
{
    if (ellipse1.Fill == Brushes.White)
    {
        ellipse1.Fill = Brushes.PaleVioletRed;
    }
    else
    {
        ellipse1.Fill = Brushes.White;
    }
    e.Handled = true;
}

The key points are:

• EventArgs is now RoutedEventArgs. This exposes the IsHandled property...
• e.IsHandled = true. This stops other event handlers (such as the canvas click handler) from firing.