Page History

Essential Gantt for WPF is a MS Project-like Project Viewer with built-in grid, schedule and resource assignment constraints. It is designed to assist project managers in developing plans, assigning resources to the task, tracking task progress and so on. Some of the key features of Gantt control are: drag support for increasing and decreasing the Start and Finish Date of the Task, Drag and Drop support for the task within a row and automatic data synchronization between Grid and Chart. This page has information about the Gantt Control.

On this page:

Table of Contents

maxLevel	3
style	None

Image Added

Requirements

This control is available only for Windows WPF applications

Configuration

Image Removed

Go to Displays / Draw.
On the Components Panel, select Charts, then GanttChart.
Click or drag-and-drop it on the Drawing area to use it.
Double-click the
control
object to open the configuration window.

Image Added

Configuration

Image Removed

Description
Control

name: Provide a name for

Name	Defines the name used to identify the control

DataSource: This is the data context for the control, we can select data context from the below list of objects.

Image Removed

Visual Style: Essential Gantt enables

.
Data Source	Specifies the data source used to populate the Gantt chart.
Visual Style	Enables you to customize the appearance of the control.

This supports the following themes:

The available options for Visual Style are:

VS2010

Blend

Metro

Office2010Blue

Office2010Black

Office2010Silver

Metro

Property

Description

GridHeaderBackground

Changes the background color for Grid Header row.

GridHeaderForeground

Changes the foreground color for Grid Header row.

ScheduleBackground

Changes the background color for Schedule row.

ScheduleForeground

Changes the foreground color for Schedule row.

ProgressIndicatorBackground

Changes the background color for Progress bar.

ConnectorStroke

Changes the stroke color for connector.

TaskNodeBackground

Changes the background color for task node.

ShowChartLines

Changes the background color for Progress bar.

ShowNonWorkingHoursBackground

Indicates holidays with a background color.

Show Baseline

Baseline Table View will display the differences between the current progresses and the baseline of the project in the Gantt Grid

BaselineColor

Used to customize the baseline color. Default value is Orange.

Connector Stroke	Sets the color for the connector lines between tasks.
Schedule Background	Specifies the background color of the schedule area.
Schedule Foreground	Defines the text color for the schedule area.
Task Node Background	Sets the background color for the task nodes.
Grid Header Background	Specifies the background color of the grid header.
Grid Header Foreground	Defines the text color of the grid header.
Show Chart Lines	Toggles the visibility of lines between chart elements.
Show Non-Working Hours Background	Displays the background color for non-working hours.
Use Auto Update Hierarchy	Enables automatic updates for hierarchical task dependencies.
Show Baseline	Toggles the visibility of the project baseline on the chart.
Baseline Color	Sets the color for the baseline representation on the chart.
Baseline Thickness	Specifies the thickness of the baseline line.
Field Name	Selects the data field used for the specific column (e.g., TaskName, StartDateTime).
Column Name	Defines the custom name for the selected column.

With the instance below, it is possible to access all properties of Gantt Control.

Note

To configure the Gantt control in the CodeBehind, create an instance for Gantt Control:

T.Wpf.Controls.TGanttControl Gantt = this.CurrentDisplay.GetControl("controlname") as T.Wpf.Controls.TGanttControl;

BaselineStrokeThickness

Used to customize the baseline thickness. Default value is 3d

Below are the properties listed, which are not exposed in the Gantt Control configuration window but you can still make use of it through the CodeBehind.

Property	Description
Predecessor	Enables you to set the relationship between the tasks.
GanttTaskRelationship	Contains four relationships: StartToStart, StartToFinish, FinishToFinish, FinishToStart.
ValidationMode	Contains two modes: Manual & Auto (Default value is Manual).
UseAutoUpdateHierarchy	Enable or disable the auto update hierarchy support.
ToolTipTemplate	Gets or sets the TaskBarCollection Property of GanttControl.
CustomScheduleSource	Gets/Sets the custom schedule items Source of the Gantt.
CellDate	Gets/Sets the current schedule cell date in the datetime schedule.
CellToolTip	Gets/Sets the current schedule cell tool tip.
CellTimeUnit	Gets/Sets the current schedule row time unit — , like weeks, months and so on.
Content	Gets/Sets the current schedule cell content.
WeekBeginsOn	Gets or sets the starting day of a week in the project schedule. Default is Sunday.
FiscalYearBeginsOn	Gets or sets the starting month of a fiscal year. Default is January.
IsFYNumberingEnabled	Gets or sets the Fiscal Year Numbering. If this property is changed, it will be reflected in the schedule. By default, FY Numbering is set to false.
DefaultStartTime	Gets or sets the task starting time in a day. This is based on the GanttTime class of the Gantt control. Default is 9.00 AM.
DefaultEndTime	Gets or sets the task ending time in a day. This is based on the GanttTime class of the Gantt control. Default is 6.00 PM.
Weekends	Gets or sets the weekend days. Default value is Saturday, Sunday.
ShowWeekends	Enables or disables the weekend days in schedule. Default value is true.
ExcludeWeekends	Excludes or includes the weekend days in duration calculation. Default value is false.
ShowNonWorkingHoursBackground	Enables or disables the background for weekend days. Default value is true.
UseOnDemandSchedule	To get the expected performance you need to use dynamic schedule rendering.
BaseCellMaxLength	Splits the schedule cells by comparing the cell size with the API value on zooming-in
BaseCellMinLength	Merges schedule cells by comparing the cell size with the API value on zooming-out
ZoomFactor	Zooming takes place based on the ZoomFactor. The ZoomFactor should be greater than zero.
HighlightedItems	The items that are passed through this API will be highlighted in Gantt chart region. The items should be in linear form.
HighlightItemBrush	Specifies the color in which items should be highlight
CurrentDateLine	Gets the user-defined line for the DateTime indicator.
StickCurrentDateLineTo	Get/sets the StickCurrentDateLineTo property of the Gantt control. Default is Today.
Background	Gets/sets background color of strip line.
Content	Gets/sets the content of the strip line.
ContentTemplate	Gets/sets the content template of the strip line.
ContentTemplateSelector	Gets/sets the TemplateSelector of the strip line.
StartDate	Gets/sets the start date of the strip line.
EndDate	Gets/sets the end date of the strip line.
RepeatBehavior	Gets/sets the repeat behavior of the strip line.
RepeatFor	Gets/sets the intervals between the repeating strip lines.
RepeatUpto	Gets/sets DateTime value. The strip line will be repeated up to this value.
Style	Gets/sets the style for the strip line.
StyleSelector	Gets/sets the style selector of the strip line.
VerticalContentAlignment	Gets/sets the vertical alignment of the content present in the strip line.
HorizontalContentAlignment	Gets/sets the horizontal alignment of the content present in the strip line.
Type	Gets/sets the type of the strip line.
Position	Gets/sets the absolute position of the strip line for Absolute strip line type.
Height	Gets/sets the absolute height of the strip line for Absolute strip line type.
Width	Get/sets the absolute width of the strip line for Absolute strip line type.
ShowStripLines	Gets the user option to show the strip lines.
StripLines	Get/sets the collection of StripLineInfo from the user.

Note

To configure the Gantt control in the CodeBehind, create an instance for Gantt Control as shown below

T.Wpf.Controls.TGanttControl gant = this.CurrentDisplay

.

GetControl("controlname") as T.Wpf.Controls.TGanttControl;

With the instance above, it is possible to access all properties of Gantt Control as shown in the below screenshot

Image Removed

Column Mapping

Image AddedImage Removed

Click the Add button to add a column to the list.

To map user table column with default column, you need to configure the field and column name properties.

Select Field and map the user column with column name textbox

E.g.: In Field, we selected “TaskId” from the default column and I have mapped user column “ID” to the default “TaskId” column, as in the image above.

Note
In user table, input for ParentId,PrecedesserTaskId and PredecessorDependencyRelation columns should be empty string or NULL if there is no data.

Click OK to save the configuration.

Runtime

To view the data in the runtime as shown in the screenshot below, you need to configure DataSource in the Gantt Control configuration window. It can be a tag or a dataset

Image Removed

Samples configurations

Sample 1

Create a tag with a type of DataTable (E.g.: TestTable) as shown in the below screenshot

Image Removed

2. In CodeBehind DisplayOpening() method, create a datatable and assign it to ‘Tag.TestTable’ as shown in the screenshot below.

Image Removed

Code Block

title	Code snippet

public void DisplayOpening()
        {
            DataTable dt = new DataTable("TaskDetails");
            dt.Columns.Add("TaskId", typeof(int));
            dt.Columns.Add("TaskName", typeof(string));
            dt.Columns.Add("StartDate", typeof(DateTime));
            dt.Columns.Add("FinishDate", typeof(DateTime));
            dt.Columns.Add("Progress", typeof(Double));
            dt.Columns.Add("ParentId", typeof(string));
            dt.Columns.Add("PrecedesserTaskId", typeof(string));
            dt.Columns.Add("PredecessorDependencyRelation", typeof(string));
            dt.Columns.Add("Cost", typeof(int));
            dt.Columns.Add("BaseLineCost", typeof(int));
            dt.Columns.Add("BaseLineStart", typeof(DateTime));
            dt.Columns.Add("BaseLineFinish", typeof(DateTime));
            dt.Rows.Add(1, "Adam", new DateTime(2022, 2, 1), new DateTime(2022, 2, 4), 40d, "", "", "", 1000, 999, new DateTime(2022, 2, 1), new DateTime(2022, 2, 5));
            dt.Rows.Add(2, "Eve", new DateTime(2022, 2, 7), new DateTime(2022, 2, 9), 40d, 1, "", "", 1000, 800, new DateTime(2022, 2, 7), new DateTime(2022, 2, 12));
            dt.Rows.Add(2, "Kain", new DateTime(2022, 2, 7), new DateTime(2022, 2, 9), 40d, 1, "", "", 2000, 2600, new DateTime(2022, 2, 5), new DateTime(2022, 2, 11));
            dt.Rows.Add(10, "Hebel", new DateTime(2022, 2, 7), new DateTime(2022, 2, 16), 40d, 1, "", "", 1500, 1600, new DateTime(2022, 2, 6), new DateTime(2022, 2, 17));
            dt.Rows.Add(13, "Extraterrestrial", new DateTime(2022, 2, 7), new DateTime(2022, 2, 14), 40d, 10, 14, 1, 1800, 1600, new DateTime(2022, 2, 6), new DateTime(2022, 2, 13));
            @Tag.TestTable = dt;
        }

Note
In the screenshot above, columns ParentId, PrecedesserTaskId and PredecessorDependencyRelation are string type. Input for these columns should be empty string or NULL if there is no data.

3. In configuration window, Data Source is configured as ‘Tag.TestTable’.

Image Removed

In the example, the table columns are in sync with default table columns, so it is necessary to map the columns

4. Click Ok to save the configuration.

5. Click Run Test to start the test.

Image Removed

6. In Runtime, now it is possible to see the startup window as shown in the screenshot below.

Image Removed

Sample 2

1. Create a tag with a type of DataTable (E.g.: TestTable1) as shown in the screenshot below.

Image Removed

2. In code behind DisplayOpening() method, create a datatable and assign it to ‘Tag.TestTable1’ as shown in the below screenshot.

Image Removed

Code Block

title	Code Snippet

public void DisplayOpening()
        {
            DataTable dt1 = new DataTable("TaskDetails");
            dt1.Columns.Add("ID", typeof(int));
            dt1.Columns.Add("Name", typeof(string));
            dt1.Columns.Add("Start", typeof(DateTime));
            dt1.Columns.Add("Finish", typeof(DateTime));
            dt1.Columns.Add("Progress", typeof(Double));
            dt1.Columns.Add("PID", typeof(string));
            dt1.Rows.Add(1, "Adam", new DateTime(2022, 2, 1), new DateTime(2022, 2, 4), 40d, "");
            dt1.Rows.Add(2, "Eve", new DateTime(2022, 2, 7), new DateTime(2022, 2, 9), 40d, 1);
            dt1.Rows.Add(2, "Kain", new DateTime(2022, 2, 7), new DateTime(2022, 2, 9), 40d, 1);
            dt1.Rows.Add(10, "Hebel", new DateTime(2022, 2, 7), new DateTime(2022, 2, 16), 40d, 1);
            dt1.Rows.Add(13, "Extraterrestrial", new DateTime(2022, 2, 7), new DateTime(2022, 2, 14), 40d, 10);
            @Tag.TestTable1 = dt1;
        }

In the example, the table columns did not match with the default columns. In this case, it is necessary to map the columns in the configuration window.

Image Removed

Field Name represents default column, and Column Name represents user table column

3. In configuration window, datasource is configured as ‘Tag.TestTable1’

Image Removed

In screenshot above screenshot, columns are mapped with default columns.

4. Click Ok to save the configuration.

5. Click Run Test to start the test

Image Removed

6. In Runtime, now you can able to see the startup window as shown in the below screenshot

Image Removed

Sample 3

In this sample, the data source is a table from SQL server.

1. First, you need to establish connection with your database as shown in the screenshot below.

Image Removed

Info
Please watch our tutorials for more information related to database connectivity. <<<<. adding a link to the tutorials would be interesting >>>>

The screenshot below shows the table from SQL server

Image Removed

In the example, the database table columns did not match with the default columns. In this case, it is necessary to map the columns in the configuration window.

4. In configuration window, Data Source is configured as ‘Dataset.Table.Tasks’.

Image Removed

5. In the screenshot above, columns are mapped with default columns. Click Ok to save the configuration.

6. Click Run Test to start the test.

Image Removed

7. In Runtime, now you can able to see the startup window as shown in the below screenshot

Image Removed

Image Added

In this section:

Page Tree

root	@parent
spaces	V10

Space shortcuts

Page tree

Versions Compared

Old Version 9

New Version Current

Key

Requirements

Configuration

Go to Displays / Draw.
On the Components Panel, select Charts, then GanttChart.
Click or drag-and-drop it on the Drawing area to use it.
Double-click the
control
object to open the configuration window.