Using WPF controls as nodes

The ControlNode class lets you use any WPF UIElement object as a diagram node. This allows you to use ready-made or custom WPF controls to display or edit the entities represented in your application's diagrams. The controls hosted in Diagramming for WPF nodes might be interactive and with embedded user interface. For example you might utilize calendars, grids, rich-text controls or html-pages as entity editors or viewers. You might also create your own custom control and integrate it seamlessly with Diagramming for WPF; as a result you can get as advanced entity-relationship diagram editor as your application needs.

Creating Controls Interactively

To let the user draw UIElement objects with the mouse, set Behavior to Custom. The type of controls to be created in the host nodes is specified by the CustomNodeType property of Diagram. If the following code executes, each node drawn by users would host a GridView instance, and nodes could be connected by drawing links between them:

C#

// Draw datagrid nodes and allow connecting them with links
diagramView.Behavior = Behavior.Custom;

// Default type of hosted controls is GridView
diagram.CustomNodeType = typeof(GridView);

Visual Basic

' Draw datagrid nodes and allow connecting them with links
diagramView.Behavior = Behavior.Custom

' Default type of hosted controls is GridView
diagram.CustomNodeType = GetType(GridView)

Adding a WPF Control Programmatically

To display a WPF UIElement-derived object in the diagram programmatically, add an instance of the class to the diagram's Nodes collection. This automatically creates a ControlNode for the UIElement object. You can as well instantiate the ControlNode explicitly and add it to Nodes. To get the ControlNode associated with an UIElement, use the DiagramItem attached property.