Customizing Gantt control's GanttGrid

[Jay]

Hi,

I want to do following with GanttControl:

1. Set AutoGenerateColumnsInfo = false
   I don't want any auto generated columns in GanttGrid.
2. As per screenshot below,
     
   1. I want to remove yellow highlighted column splitter (Don't want to allow resize) 
   2. Customize the left most column, which right now only shows 0, to have a checkbox or if not
      possible, remove/hide the column
   3. I also want to remove the month display, mark as red cross mark.
      In short, can we customize to match the UI shown in the screenshot below?
3. Define treeindex column
   As you can see in the screenshot above, the column where we see expander icon, by default + icon. It always takes first column (0 index) as
   expander column and in my case, first column is CheckBox column as shown in the screenshot below. 
   
   Thanks,
   Jay

[Sridevi Sivakumar]

Hi Jay,

Greetings from Syncfusion.

Query: I don't want any auto generated columns in GanttGrid.
We can remove the unnecessary column from the gantt grid columns collection in the gantt grid loaded event as per the below code snippet 

         private void GanttGrid_Loaded(object sender, RoutedEventArgs e) 

        { 

              foreach (var item in Gantt.GanttGrid.Columns) 

            { 

                if ((item as GridTreeColumn).HeaderText == "Progress (%)") 

                { 

                    Gantt.GanttGrid.Columns.Remove(item); 

                    return; 

                } 

            } 

        } 

Query: I want to remove yellow highlighted column splitter
We can remove the splitter as per below code snippet in the gantt grid model QueryCellInfo event. 

  private void Model_QueryCellInfo1(object sender, Syncfusion.Windows.Controls.Grid.GridQueryCellInfoEventArgs e) 

        { 

            //  to hide the border of the header 

            if (e.Cell.RowIndex == 0 && e.Cell.ColumnIndex == 1) 

            { 

                var lightpen = new Pen(e.Style.Background, 2); 

                e.Style.Borders.Right = lightpen; 

                e.Style.Borders.Left = lightpen; 

            } 

 

        } 

For more information to hide the splitters
https://www.syncfusion.com/kb/3450/how-to-customize-the-column-header-to-load-image-and-hide-border

Query: I also want to remove the month display, mark as red cross mark.
We can achieve it by setting the Gantt ScheduleType property to WeekWithDays  as per the below code snippet 

  <sync:GanttControl x:Name="Gantt" Grid.Row="1"  Loaded="GanttGrid_Loaded"  ScheduleType="WeekWithDays" 

                               ItemsSource="{Binding TaskCollection}" 

                               VisualStyle="Metro"> 

        </sync:GanttControl> 

Screenshot:


Please have a sample from below link 

https://www.syncfusion.com/downloads/support/directtrac/general/ze/GanttSample-2057295167

Query: Customize the left most column, which right now only shows 0, to have a checkbox or if not
possible, remove/hide the column
Query: Define treeindex column
As you can see in the screenshot above, the column where we see expander icon, by default + icon. It always takes first column (0 index) as
expander column and in my case, first column is CheckBox column as shown in the screenshot below. 

Currently, we are working on this, we will update the details on May 25, 2021.

Regards,
Sridevi S. 

 

[Sridevi Sivakumar]

Hi Jay, 

Query	Solution
Customize the left most column, which right now only shows 0, to have a checkbox or if not   possible, remove/hide the column	It is possible to hide this column by disabling the ShowRowHeader property as shown below.     Gantt.GanttGrid.Loaded += GanttGrid_Loaded;      private void GanttGrid_Loaded(object sender, RoutedEventArgs e)   {             Gantt.GanttGrid.ShowRowHeader = false;   }     Sample link :   https://www.syncfusion.com/downloads/support/directtrac/general/ze/GanttSample206752040532884130
Define treeindex column As you can see in the screenshot above, the column where we see expander icon, by default + icon. It always takes first column (0 index) as expander column and in my case, first column is CheckBox column as shown in the screenshot below.	It is not possible to add check box in the expander column of the grid and also the expander column will always be the first column in the grid.

 

Let us know if you need any further assistance.

Regards,
Sridevi S. 

[Jay]

Thank you very much for the sample. I have achieved earlier solution already but now I will try hiding the row header. 

[Ramya Soundar Rajan]

Hi Jay, 

 

Thanks for your response.

Can you please provide some pictorial information of your query for what did you mean as row header? Since we have provided solution to hide the GanttGrid’s RowHeader in our previous update.

Regards,
Ramya S.