Skip to main content Skip to footer

How to Create a Flowchart in Your C# .NET Spreadsheet Application

Quick Start Guide
What You Will Need

Visual Studio - This example using VS2022

.NET 6+ WinForms Application

NuGet Package: GrapeCity.Spread.WinForms

Controls Referenced

Spread.NET - .NET/C# Spreadsheet Component

Online Documentation | Demos

Tutorial Concept Allow users to create Flowchart in your C# .NET Spreadsheet Application using a .NET spreadsheet WinForms component.

Flowcharts simplify complex processes using shapes and symbols, making them easier to understand across various industries. They are invaluable in finance for simplifying financial processes, in manufacturing for visualizing workflows, and for corporate executives to streamline decision-making.

Maintaining flowcharts can be challenging, but with a .NET spreadsheet component like Spread.NET for WinForms, developers can integrate a familiar ribbon toolbar, allowing users to create and customize flowcharts easily within a .NET spreadsheet interface. This includes adding shapes, connecting, grouping, and saving the created flowchart to a Microsoft Excel XLSX file.

Steps to Enable Flowchart Creation in .NET WinForms Spreadsheet Apps:

  1. Create a .NET/C# Spreadsheet WinForms Application with a Ribbon Bar Control
  2. Enable the Enhanced Shape Engine
  3. Add Shapes to the .NET Spreadsheet
  4. Add Text Labels to the Flowchart Shapes
  5. Connect the .NET Flowchart Shapes
  6. Customize the Shapes with the .NET Ribbon Bar Control
  7. Group the .NET Flowchart Shapes
  8. Save the .NET Flowchart to Excel (.xlsx)

Start Using Spread.NET Today! Download a Free Trial

Create a .NET/C# Spreadsheet WinForms Application with a Ribbon Bar Control

To get started, we need to create a .NET WinForms application, then add the .NET spreadsheet component, Spread.NET WinForms, and the WinForms Ribbon Bar control. Go to our Getting Starting with a .NET Spreadsheet Ribbon Bar Control blog for in-depth steps on creating this application. 

After following the above-linked getting started blog steps, the WinForms spreadsheet app will look like this:

Create app

Enable the Enhanced Shape Engine

When the Spread instance's EhancedShapeEngine property is set to True, the Ribbon Control allows users to interact seamlessly with all Excel-compatible shapes, notes, and comments. 

EnhancedShapeEngine: False EnhancedShapeEngine: True
Engine false Engine true

Developers can easily enable this property in Visual Studio using the Project Properties window by selecting the Spread instance (fpSpread1) first, expanding Features, and then changing EnhancedShapeEngine to True.

Shape engine property

Add Shapes to the .NET Spreadsheet

During the .NET app's runtime, end-users can add enhanced Excel-like shapes to the .NET spreadsheet to create the flowchart. Spread.NET includes commonly used flowchart shapes, as highlighted below.

Add shapes

For this blog's example, add five Flowchart: Alternative Process shapes for the processes and two Flowchart: Connector shapes to the beginning and end of the flowchart. Once you add these shapes, the spreadsheet should look like this:

Shapes

Add Text Labels to the Flowchart Shapes

To add text to the flowchart shapes, double-click the shape and type the desired title text. For this demo, we’ll use: FR Y14A, Update Global Drivers, Adjustments, Business Line Input, and Adjustment Review. Press Enter to format text onto new lines for readability.

Shapes and text

Next, let's apply some formatting to the text within the shapes. Save time by applying the same text style to multiple shapes at once. To select multiple shapes, hold Shift and click on each shape. In this example, we will adjust the size, alignment, and font color of both the shapes and text using the Home tab.

SPNET Add text

Connect the .NET Flowchart Shapes

Let's organize the order of the flowchart shapes and add the process connectors. Use the Elbow Arrow and Line Arrow shapes as connectors. The shapes' connection points appear when drawing. Connect the shapes immediately or hover over the connector's grab handle, then click and drag the endpoint to the first shape's border. Anchor the connector to a green point.

Connect shapes

Customize the Shapes with the .NET Ribbon Bar Control

Spread allows users to apply styled themes and custom styling to shapes using the Shape Format tab. 

Ribbon

For this example, we have applied themed styles to the shapes and changed the color of the connectors.

Themed styles

Group the .NET Flowchart Shapes

Grouping flowchart shapes keeps related elements together and prevents accidental changes. Group shapes using Spread’s Ribbon Toolbar control or the spreadsheet's context menu.

  1. Using Toolbar: Hold Shift, select shapes, go to the Shape Format tab, and click Group Objects.
  2. Using Context Menu: Hold Shift, select shapes, right-click, and choose Group.

Group shapes

Grouping can be used to add text to connector lines. Users can add a shape, remove its background and outline color, add the text, and group it with the associated connector.

Grouping

Save the C# .NET Flowchart to Excel (.xlsx)

End-users can export the created .NET flowchart to an Excel (XLSX) file or import existing Excel flowcharts using the .NET Ribbon toolbar's File tab.

Export

And just like that, you have created a .NET 6.0+ WinForms App where end-users can easily create, design, and save their flowcharts easily and quickly, all using a familiar spreadsheet UI.

Ready to Get Started? Download a 30-Day Free Trial of Spread.NET Today!


Learn More About C# .NET Spreadsheet Components

This article only scratches the surface of the full capabilities of Spread.NET, the .NET spreadsheet component. Review the documentation to see some of the many available features, and download our demo explorer to see the features in action and interact with the sample code. Integrating a spreadsheet component into your applications allows you to customize your user's experience and provide them with familiar spreadsheet functionality without referring them to an external program. To learn more about Spread.NET and the new features added in the latest release, check out our releases page.

comments powered by Disqus