Quick Start: GanttView for WPF

This quick start section is intended to familiarize you with the GanttView control. You begin by creating a WPF application in Visual Studio, adding GanttView control to the MainWindow, and add tasks to GanttView in unbound mode through code.

Complete the steps given below to see how GanttView control appears on running the application

Step 1: Setting up the application
Step 2: Adding tasks to GanttView in unbound mode through code
Step 3: Running the application

Here is how a basic GanttView control appears with tasks displayed.

Step 1: Setting up the application

Create a WPF application in Visual Studio.
Drag and drop the C1GanttView control to the MainWindow

Edit the XAML code to include relevant namespaces and set some basic properties of the GanttView control.

XAML	Copy Code
<Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:c1="http://schemas.componentone.com/winfx/2006/xaml" xmlns:GanttView="clr-namespace:C1.GanttView;assembly=C1.WPF.GanttView.4" x:Class="QuickStart.MainWindow" Title="MainWindow" Height="350" Width="525"> <Grid> <c1:C1GanttView Name="gv"> <c1:C1GanttView.Columns> <GanttView:TaskPropertyColumn ID="682738157" Property="Mode"/> <GanttView:TaskPropertyColumn ID="200464275" Property="Name"/> <GanttView:TaskPropertyColumn ID="1932261525" Property="Duration" Visible="False"/> <GanttView:TaskPropertyColumn ID="2041428170" Property="DurationUnits" Visible="False"/> <GanttView:TaskPropertyColumn ID="877817002" Property="Start" Visible="False"/> <GanttView:TaskPropertyColumn ID="1833319410" Property="Finish" Visible="False"/> <GanttView:TaskPropertyColumn ID="204763723" Property="PercentComplete" Visible="False"/> <GanttView:TaskPropertyColumn ID="2112691121" Property="ConstraintType" Visible="False"/> <GanttView:TaskPropertyColumn ID="1026682979" Property="ConstraintDate" Visible="False"/> <GanttView:TaskPropertyColumn ID="46763901" Property="Predecessors" Visible="False"/> <GanttView:TaskPropertyColumn ID="1809421465" Property="Deadline" Visible="False"/> <GanttView:TaskPropertyColumn ID="1041667598" Property="Calendar" Visible="False"/> <GanttView:TaskPropertyColumn ID="223524084" Property="ResourceNames" Visible="False"/> <GanttView:TaskPropertyColumn ID="2142090402" Property="Notes" Visible="False"/> </c1:C1GanttView.Columns> </c1:C1GanttView> </Grid> </Window>

XAML

Copy Code

    <Window
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:c1="http://schemas.componentone.com/winfx/2006/xaml" 
        xmlns:GanttView="clr-namespace:C1.GanttView;assembly=C1.WPF.GanttView.4" 
        x:Class="QuickStart.MainWindow"
        Title="MainWindow" Height="350" Width="525">
    <Grid>

        <c1:C1GanttView Name="gv">
            <c1:C1GanttView.Columns>
                <GanttView:TaskPropertyColumn ID="682738157" Property="Mode"/>
                <GanttView:TaskPropertyColumn ID="200464275" Property="Name"/>
                <GanttView:TaskPropertyColumn ID="1932261525" Property="Duration" Visible="False"/>
                <GanttView:TaskPropertyColumn ID="2041428170" Property="DurationUnits" Visible="False"/>
                <GanttView:TaskPropertyColumn ID="877817002" Property="Start" Visible="False"/>
                <GanttView:TaskPropertyColumn ID="1833319410" Property="Finish" Visible="False"/>
                <GanttView:TaskPropertyColumn ID="204763723" Property="PercentComplete" Visible="False"/>
                <GanttView:TaskPropertyColumn ID="2112691121" Property="ConstraintType" Visible="False"/>
                <GanttView:TaskPropertyColumn ID="1026682979" Property="ConstraintDate" Visible="False"/>
                <GanttView:TaskPropertyColumn ID="46763901" Property="Predecessors" Visible="False"/>
                <GanttView:TaskPropertyColumn ID="1809421465" Property="Deadline" Visible="False"/>
                <GanttView:TaskPropertyColumn ID="1041667598" Property="Calendar" Visible="False"/>
                <GanttView:TaskPropertyColumn ID="223524084" Property="ResourceNames" Visible="False"/>
                <GanttView:TaskPropertyColumn ID="2142090402" Property="Notes" Visible="False"/>
            </c1:C1GanttView.Columns>
        </c1:C1GanttView>
        

    </Grid>
</Window>

Step 2: Adding tasks to GanttView in unbound mode through code

You can add tasks to the GanttView control in unbound mode. For this, you can define tasks in a delegate and add them to the Tasks collection of GanttView using the Add method.

Switch to the code view, that is MainWindow.xaml.cs file, and add the following import statements.
- Visual Basic
- C#
- Visual Basic
Imports C1.GanttView Imports C1.WPF.GanttView
- C#
using C1.GanttView; using C1.WPF.GanttView;
Switch to the MainWindow.xaml.cs and add the following code to subscribe the Loaded event of the C1GanttView class.
- Visual Basic
- C#
- Visual Basic
AddHandler gv.Loaded, AddressOf gv_Loaded
- C#
gv.Loaded += gv_Loaded;

Add the following code in the Loaded event for configuring tasks and adding them to the GanttView control.

Visual Basic
C#

Visual Basic

Private Sub gv_Loaded(sender As Object, e As RoutedEventArgs)
    'Configure tasks
    Dim t As New Task()
    t.Mode = TaskMode.Manual
    t.Name = "Requirement Gathering"
    t.Start = New DateTime(2016, 4, 5)
    t.Duration = 5
    t.PercentComplete = 0.5

    Dim t1 As New Task()
    t1.Mode = TaskMode.Manual
    t1.Name = "Analysis"
    t1.Start = New DateTime(2016, 4, 20)
    t1.Duration = 8
    t1.PercentComplete = 0

    Dim t2 As New Task()
    t2.Mode = TaskMode.Manual
    t2.Name = "Design"
    t2.Start = New DateTime(2016, 4, 8)
    t2.Duration = 4
    t2.PercentComplete = 0.6

    Dim t3 As New Task()
    t3.Mode = TaskMode.Manual
    t3.Name = "Development"
    t3.Start = New DateTime(2016, 5, 1)
    t3.Duration = 10
    t3.PercentComplete = 0.2

    Dim t4 As New Task()
    t4.Mode = TaskMode.Manual
    t4.Name = "Quality Assurance"
    t4.Start = New DateTime(2016, 4, 16)
    t4.Duration = 7
    t4.PercentComplete = 0.2

    Dim t5 As New Task()
    t5.Mode = TaskMode.Manual
    t5.Name = "Deployment and Release"
    t5.Start = New DateTime(2016, 3, 29)
    t5.Duration = 1
    t5.PercentComplete = 0.5

    Dim t6 As New Task()
    t6.Mode = TaskMode.Manual
    t6.Name = "Maintenance"
    t6.Start = New DateTime(2016, 5, 3)
    t6.Duration = 4
    t6.PercentComplete = 1

    Dim t7 As New Task()
    t7.Mode = TaskMode.Manual
    t7.Name = "Enhancements"
    t7.Start = New DateTime(2016, 5, 11)
    t7.Duration = 2
    t7.PercentComplete = 0.8

    'Add the tasks to the GanttView
    gv.Tasks.Add(t)
    gv.Tasks.Add(t1)
    gv.Tasks.Add(t2)
    gv.Tasks.Add(t3)
    gv.Tasks.Add(t4)
    gv.Tasks.Add(t5)
    gv.Tasks.Add(t6)
    gv.Tasks.Add(t7)
End Sub

void gv_Loaded(object sender, RoutedEventArgs e)
{
    //Configure tasks
    Task t = new Task();
    t.Mode = TaskMode.Manual;
    t.Name = "Requirement Gathering";
    t.Start = new DateTime(2016, 4, 5);
    t.Duration = 5;
    t.PercentComplete = 0.5;

    Task t1 = new Task();
    t1.Mode = TaskMode.Manual;
    t1.Name = "Analysis";
    t1.Start = new DateTime(2016, 4, 20);
    t1.Duration = 8;
    t1.PercentComplete = 0;

    Task t2 = new Task();
    t2.Mode = TaskMode.Manual;
    t2.Name = "Design";
    t2.Start = new DateTime(2016, 4, 8);
    t2.Duration = 4;
    t2.PercentComplete = 0.6;

    Task t3 = new Task();
    t3.Mode = TaskMode.Manual;
    t3.Name = "Development";
    t3.Start = new DateTime(2016, 5, 1);
    t3.Duration = 10;
    t3.PercentComplete = 0.2;

    Task t4 = new Task();
    t4.Mode = TaskMode.Manual;
    t4.Name = "Quality Assurance";
    t4.Start = new DateTime(2016, 4, 16);
    t4.Duration = 7;
    t4.PercentComplete = 0.2;

    Task t5 = new Task();
    t5.Mode = TaskMode.Manual;
    t5.Name = "Deployment and Release";
    t5.Start = new DateTime(2016, 3, 29);
    t5.Duration = 1;
    t5.PercentComplete = 0.5;

    Task t6 = new Task();
    t6.Mode = TaskMode.Manual;
    t6.Name = "Maintenance";
    t6.Start = new DateTime(2016, 5, 3);
    t6.Duration = 4;
    t6.PercentComplete = 1;

    Task t7 = new Task();
    t7.Mode = TaskMode.Manual;
    t7.Name = "Enhancements";
    t7.Start = new DateTime(2016, 5, 11);
    t7.Duration = 2;
    t7.PercentComplete = 0.8;

    //Add the tasks to the GanttView
    gv.Tasks.Add(t);
    gv.Tasks.Add(t1);
    gv.Tasks.Add(t2);
    gv.Tasks.Add(t3);
    gv.Tasks.Add(t4);
    gv.Tasks.Add(t5);
    gv.Tasks.Add(t6);
    gv.Tasks.Add(t7);
}

Step 3: Running the application

Press F5 to run the application and observe how task attributes get displayed in the control.