DevExpress.Wpf.Diagram 26.1.5

DevExpress WPF: Diagram Control

DevExpress.Wpf.Diagram implements the DevExpress WPF Diagram control. Use this control to add Microsoft Visio-inspired diagrams to your application. Build flowcharts, organizational charts, floor plans, and database diagrams in code or XAML. You can bind the control to a data source that defines the diagram structure. You can also allow users to modify or create their own diagrams using the included runtime diagram designer. Both the diagram control and the designer dialog adapt to the active DevExpress application theme.

dotnet add package DevExpress.Wpf.Diagram

Included Components

• DiagramControl: A diagram surface that displays shapes, connectors, containers, lists, and images.
• DiagramDesignerControl: A complete diagramming UI built around the diagram surface with a ribbon, a shapes panel, a properties panel, and a status bar.

Key Features

• Built-In Stencils: Quick shapes, basic shapes, flowchart shapes, SDL diagram shapes, arrow shapes, decorative shapes, software icons, and standard containers.
• Automatic Layout: Arrange items with tree, layered, circular, tip-over tree, mind map, and organizational chart layout algorithms.
• Data Binding: use DiagramDataBindingBehavior or DiagramOrgChartBehavior to generate a diagram or organizational chart based on collection data.
• End-User Capabilities: Edit text, pan and zoom, undo and redo, copy and paste, snap to grid, group elements, and more.
• Print and Export: Display a print preview and export a diagram to PDF, SVG, or an image.

Examples

Example 1: Display an End-User Diagram Designer

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:dxdiag="http://schemas.devexpress.com/winfx/2008/xaml/diagram">

    
    <dxdiag:DiagramDesignerControl SelectedStencils="BasicShapes, BasicFlowchartShapes" />
</Window>

The designer displays a ribbon, a shapes panel, and a properties panel. Users can build diagrams, save them, and print them without additional code.

Example 2: Build a Diagram in XAML

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:dxdiag="http://schemas.devexpress.com/winfx/2008/xaml/diagram">

    
    <dxdiag:DiagramControl>
        <dxdiag:DiagramShape x:Name="start" Shape="BasicFlowchartShapes.StartEnd"
                             Content="Start" Position="100,40" Width="140" Height="60" />
        <dxdiag:DiagramShape x:Name="approve" Shape="BasicFlowchartShapes.Decision"
                             Content="Approved?" Position="100,160" Width="140" Height="80" />

        
        <dxdiag:DiagramConnector BeginItem="{Binding ElementName=start}"
                                 EndItem="{Binding ElementName=approve}" />
    </dxdiag:DiagramControl>
</Window>

The diagram displays two flowchart shapes joined by a connector. The connector re-routes itself when a user moves either shape.

Evaluation Period, Pricing Options, and Licensing Terms

Whether you own a license or want to start a 30-day evaluation period, download and register your DevExpress license key. To obtain your key, log in to the DevExpress Download Manager. Use your existing DevExpress.com account or create a new account for free. For key registration instructions, see License Key for DevExpress Products.

If you purchase a license after evaluating a product, re-register your updated DevExpress license key to remove evaluation version warnings/messages.

This package is included in the following commercial subscriptions:

• DevExpress WPF Subscription
• DevExpress Reporting Subscription
• DevExpress DXperience Subscription
• DevExpress Universal Subscription

See DevExpress Subscriptions & Licensing for subscription comparison tables, purchasing FAQ, and licensing information.

Related Components/Packages

DevExpress.Wpf.Printing - DevExpress WPF printing library and document preview.

dotnet add package DevExpress.Wpf.Printing

DevExpress.Wpf - The complete DevExpress WPF Control suite.

dotnet add package DevExpress.Wpf

Demos

NOTE: Demo links below only work if you already have DevExpress WPF Demos installed on your machine. To install demos, download and run the DevExpress Unified Installer (evaluation or licensed version). Remember to select "Demo Applications" on the product selection screen.

• DevExpress WPF Diagram - Shapes
• DevExpress WPF Diagram - Organizational Chart
• DevExpress WPF Diagram - Floor Plan
• DevExpress WPF Diagram - Tree Layout
• DevExpress WPF Diagram - Database Diagram

Documentation

• Diagram Control
• Connectors
• Automatic Layout
• Printing and Exporting

Software Bill of Materials (SBOM)

To access SBOM files for DevExpress packages, please refer to the following article: Software Bill of Materials (SBOM) for DevExpress .NET assemblies/NuGet packages, JavaScript, VCL and other redistributable artifacts.

See Also: Information Security | Security - What You Need to Know

Useful Online Resources

• www.devexpress.com
• DevExpress Support Center
• DevExpress Blogs