Blog

All Blog Posts  |  Next Post  |  Previous Post

Helping a customer with Custom Drawing in the FNC Gantt Chart

Wednesday, July 31, 2024

Efficient project management often necessitates detailed visual representations of tasks and their subtasks. One of our customers requested a feature to display subtasks within the parent task's drawing area when the parent task is collapsed. In response, we've developed a custom drawing routine that does exactly this. Here’s a deep dive into how you can implement and benefit from this feature.

TMS Software Delphi  Components


OnBeforeDrawGanttTimeLineItem

The only thing that you need to change is the OnBeforeDrawGanttTimeLineItem event.
Assign the event handler in the form initialization or via the Object Inspector.

  1.  Conditional Drawing:
    • First we'll check if a task has subtasks and if the parent task is collapsed ('not ADrawingParams.Expanded').
    • If both conditions are met, it proceeds to draw the subtasks within the parent task’s rectangle.
  2. Custom Rectangle Calculation:
    • For each subtask, the routine calculates the rectangle ('sr') that represents the subtask's timeline..
    • The rectangle’s boundaries are adjusted to fit within the parent task's rectangle using Max, Min, and InflateRectEx functions.
  3.  Visual Customization:
    • The subtask's fill color is taken from its appearance settings ('ATask.SubTasks[I].TaskAppearance.Fill.Color').
    • A dashed border is drawn around the subtask's rectangle to distinguish it from the default drawing.
    • The subtask’s name is drawn within its rectangle, providing a clear and readable representation.

You can adjust the drawing or appearance based on the design used in your application.

procedure TForm.MyGanttChartBeforeDrawGanttTimeLineItem(Sender: TObject; AGraphics: TTMSFNCGraphics; ATask: TTMSFNCGanttTask; var ADrawingParams: TTMSFNCGanttItemDrawingParams; var AAllow, ADefaultDraw: Boolean);
var
  I: Integer;
  sr: TRectF;
begin
  if (ATask.SubTasks.Count > 0) and not ADrawingParams.Expanded then  // Check if expanded or collapsed.
  begin
    ADefaultDraw := False;  // Don’t draw the default item

    for I := ATask.SubTasks.Count - 1 downto 0 do
    begin
      sr := MyGanttChart.GetTaskTimelineRect(ATask.SubTasks[I]);  // Get the item rect.
      if (sr.Left > 0) or (sr.Right > 0) then
      begin
        sr.Left := Max(ADrawingParams.DrawRect.Left, sr.Left);
        sr.Right := Min(ADrawingParams.DrawRect.Right, sr.Right);
        sr.Top := ADrawingParams.DrawRect.Top;
        sr.Bottom := ADrawingParams.DrawRect.Bottom;
        InflateRectEx(sr, -2, -2);

        AGraphics.Fill.Kind := gfkSolid;
        AGraphics.Fill.Color := ATask.SubTasks[I].TaskAppearance.Fill.Color;
        AGraphics.Stroke.Kind := gskDash;
        AGraphics.DrawRoundRectangle(sr, ADrawingParams.Rounding, ADrawingParams.Corners);

        InflateRectEx(sr, -2, -2);
        AGraphics.DrawText(sr, ATask.SubTasks[I].Name);
      end;
    end;
  end;
end;

Conclusion

Implementing this custom drawing routine enhances the versatility of the TMS FNC Gantt Chart, allowing you to present a more detailed and organized view of your project’s tasks and subtasks. This solution not only meets specific customer requests but also adds significant value to your project management toolkit.
And this is just one of many possibilities to customize and enhance the visuals of the TMS FNC Gantt Chart. You can find a demo in the designated folder after installation that goes further into the topic of appearance customization and there is this blogpost where the task list is customized.

Join Us at the TMS Training Days

Discover all these features and more at the TMS Training Days! I will be hosting a session showcasing the full potential of the TMS FNC Gantt Chart. Don't miss out on this opportunity to learn and engage with our latest tools.
For a deeper dive into the key features of the TMS FNC Gantt Chart and to learn about the roadmap for future developments, join us on Thursday, September 26th at the TMS Training Days session.

Get Started with TMS FNC Gantt Chart Today!

For more information, detailed documentation, and examples, visit the TMS Software website. Enhance your applications with powerful UI components designed to meet your needs.




Gjalt Vanhouwaert




This blog post has not received any comments yet.



Add a new comment

You will receive a confirmation mail with a link to validate your comment, please use a valid email address.
All fields are required.



All Blog Posts  |  Next Post  |  Previous Post