Mouse click events for Rectangle or ellipse drawn from Drawingcontext in WPF

Question

5.00/5 (2 votes)

See more:

Hi,

How can we write Mouseleftclick or mouseRight click events for the shapes like rectangles,ellipse,pathgeometry etc. which are drawn from custom canvas OnRender method.

I have a custom canvas on the WPF window. on the canvas with the mouse events i have drawn shapes. Now i want to generate click events for the shapes.

code:

C#

protected override void OnRender(DrawingContext dc)
{
SolidColorBrush myBrush = new SolidColorBrush(Colors.Transparent);
Pen mypen=new Pen(Brushes.Black,1);			
Rect myrect=new Rect (0,0,this.Width,this.Height);  
dc.DrawRectangle(new SolidColorBrush(Colors.White),new Pen(Brushes.Black,1),myrect);
 
// Draw ellipse
  if(Shapetype=="Ellipse")
{                        dc.DrawEllipse(myBrush,mypen,Position,Shapewidth,Shapeheight); 
 }
// Draw Rectangle
    if(Shapetype=="Rectangle")
     {
    Rect rect1=new Rect(startPoint.X,startPoint.Y,Shapewidth,Shapeheight);  
      dc.DrawRectangle(myBrush,mypen,rect1);

     }
}

Here iam able to draw rectangle, ellipse on the canvas, how can i generate mouse click events when i click on rectangle or ellipse shapes rendered on canvas.

Any help with an example is much appreciated..!

Posted 20-Nov-11 20:14pm

KiranBabu M

Updated 21-Nov-11 19:48pm

v3

Add a Solution

Comments

Shmuel Zang 21-Nov-11 3:51am

5 for the question. Interesting issue.

2 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Shmuel Zang · Answer 1 · 2011-11-20T21:15:00

The mouse events are declared in the UIElement class. When we want interactive shapes in the UI we usually put elements that derive from Shape (e.g. Ellipse, Rectangle, Path etc...).

If you want an interactive shape, you can create a Shape and add it to the Children of the Canvas, as the following:

C#

Ellipse el = new Ellipse
{
    Width = 100,
    Height = 50,
    Fill = Brushes.Green
};
Canvas.SetTop(el, 30);
Canvas.SetLeft(el, 40);
myCanvas.Children.Add(el);

Then you can create the event-handler:

C#

void OnEllipseMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
    // ...
}

and, register to the shape's event:

C#

el.MouseLeftButtonDown += OnEllipseMouseLeftButtonDown;

If you want to handle events for shapes that is drawn using DrawingContext, you can store the details of the shapes (like bounding rectangle) and, use these details in the event-handlers of the Canvas's events, in order to find which shape is clicked.

Member 7920931 · Answer 2 · 2024-04-22T23:19:00

Get element clicked in a canvas.

C#

myCanvas.MouseLeftButtonDown += OnMouseLeftButtonDown;

private void OnMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
    var layer = (Canvas)sender;
    var element = layer.InputHitTest(Mouse.GetPosition(layer));
    if (element != null)
        MessageBox.Show(element.ToString());
}

Mouse click events for Rectangle or ellipse drawn from Drawingcontext in WPF

2 solutions

Solution 1

Solution 2

Add your solution here

Preview 0