How to get the node item (target) of a right-click contextMenu?

Hi,

How do I get the target of the right-click, not the menu item, but the object actually right-clicked? Can you please show me an example? - I am trying to retrieve the Data object of a right-clicked ShapeNode

Many thanks,

Klaus

Hello Klaus

Sorry for the late reply. To help answer this question, I need to know if you have attached an event handler to listen to the right click of a node? If so, how have you set it up? and is it sucessfully being called when you right click on a shape node?

Cheers

-Jason

Hi Jason

I have added a Context Menu to the Diagram.Surface in XAML. In the MenuItem I am passing a CommandParameter to the event. Once I catch the event, I am trying to get from the underlying object (Diagram.Surface) the node.

I have tried:

<ms:DiagramSurface.ContextMenu>
<ContextMenu>
<MenuItem Header="Custom Item" 
          Click="MenuItem_Click" 
          CommandParameter="{Binding RelativeSource={RelativeSource Self}, Path=Parent}"/>
</ms:DiagramSurface.ContextMenu>

private void MenuItem_Click(object sender, RoutedEventArgs e) {
MenuItem mi = sender as MenuItem;
if (mi != null) {
ContextMenu cm = mi.CommandParameter as ContextMenu;
if (cm != null) {
var g = cm.PlacementTarget as DiagramSurface 
...

Many thanks

Hello Klaus

I would recommend calling the FindMouseOverNodeElement method on the DiagramSurface. This will return the DiagramNodeElement object that the mouse is currently over. Let us know how it goes.

-Jason

Hi Jason

Can it be that the FindMouseOverNodeElement is missing in the evaluation software? I only see the FindMouseOverElement which returns a DiagramElement.

Thanks

Hi Jason

I installed now the latest Wpf.Diagram from the nightly builds and I did find the FindMouseOverNodeElement. But I am still not sure how I can identify the node from the DiagramNodeElement. I simply want to get a name/id so that I can display additional information about the node in a Dialog window...

var dgnode = dg.FindMouseOverNodeElement();
DataNode node = dgnode.Node as DataNode; // returns null
// string name = node.Data.ToString();

Thank you

Klaus

Hello Klaus

The code you have posted looks correct. I assume that here you are using DataNode from star diagrams. But the node you right clicked on may not be a DataNode, it could be a DiagramNode (shape node). Rather than casting to a DataNode, you could just use the interface type IDiagramNode like this:

var dgnode = dg.FindMouseOverNodeElement();
IDiagramNode node = dgnode.Node;

From this you can get the Data property. Note that the data property is usually what the user has typed into the node, unless you have set the Data property yourself in code. You may want to create a custom node implementation that has a name/id property.

Let me know if you have more questions or if you need help with implementing custom elements.

-Jason

Hi Jason

Thanks. That worked, I got the Data property from it. The only problem I find with this approach is that the user must be exactly over the node for it to work. If I add several menu items, the lower menu items do not work. Is there another way?

Also, currently the context menu is displayed anywhere on the Diagram. I would prefer it to appear only if there is a Node under it. Can the context menu be attached to the nodes and connections only?

Cheers

Klaus

Hello Klaus, thanks for the feedback.

We'll look into providing a convenient way to attach ContextMenus to nodes and connections rather than the whole DiagramSurface soon and get back to you when it's ready.

Regards

-Jason

Hello Jason

Instead of FindMouseOverNodeElement I could get the Node from the SelectedItem instead. Like that the mouse doesn't have to be exactly over the node for it to work.

For the ContextMenu to work only under Nodes & Connections, I added a handler to the ContextMenuOpening Event which will change the Visibility to Hidden when the SelectedItem is null.

I had a look at the CustomNodeType Sample. The sample node derives from 'DiagramNode'. Can you show me a custom node which fully implements the IDiagramNode?

Many thanks Klaus

Hello Klaus

One thing to note about using the SelectedItem is that there are a few selection modes. If you know that the selection mode you are currently using is the only selection mode you will ever use, then there is no problem here. But if you plan to use the other selection modes, then using the SelectedItem property won't always work. The selection modes available are Single, Multiple and Extended and can be changed using the SelectionMode property on the DiagramSurface. If you think you will need to use a selection mode that affects your context menu logic, then let us know and we'll find a solution for you.

As for creating custom node implementations, we don't have a sample showing how to implement IDiagramNode, but we do have the CustomDiagramType sample which shows how to implement the DiagramNodeBase<TConnectionPoint> abstract class which is the next level in the class hierarchy. It is recommended to create custom nodes by extending the DiagramNode class, though it is still possible to implement from the interface. Are there any particular details that you need help with implementing for a custom node?

-Jason