TMS FNC UI Pack 7.1

Intro

One of the most powerful productivity features in spreadsheet applications is AutoFill: select a few cells, drag the small handle at the corner, and watch as the grid intelligently extends your data—whether it's a simple sequence like 1, 2, 3..., dates incrementing by day, or even custom lists like Monday, Tuesday, Wednesday...

In TMS FNC UI Pack 7.1 TTMSFNCDataGrid brings this same capability to your Delphi and web applications.

In this post, we'll explore how to:

• Enable and configure AutoFill behavior,

• Understand how the grid detects fill direction based on selection shape,

• Customize pattern recognition with custom lists and calculated values,

• Handle AutoFill events for complete control over the fill process.

All with cross-platform code that runs on VCL, FMX, and TMS WEB Core.

Basic AutoFill Setup

Let's start with a basic configuration that enables AutoFill along with cell range selection:

procedure TForm1.FormCreate(Sender: TObject);
begin
  TMSFNCDataGrid1.BeginUpdate;

  // Enable cell range selection
  TMSFNCDataGrid1.Options.Selection.Mode := gsmCellRange;

  // Enable AutoFill
  TMSFNCDataGrid1.Options.Selection.AutoFill := True;

  // Optional: Configure the AutoFill handle appearance
  TMSFNCDataGrid1.AutoFillAppearance.HandleSize := 8;
  TMSFNCDataGrid1.AutoFillAppearance.HandleFill.Color := gcSteelBlue;

  TMSFNCDataGrid1.EndUpdate;
end;

How AutoFill Detects Patterns

The grid automatically recognizes several types of patterns in your source data:

• Numeric sequences: 1, 2 becomes 1, 2, 3, 4, 5...

• Date sequences: consecutive dates continue incrementing by the detected interval

• Text with numbers: Item1, Item2 becomes Item1, Item2, Item3...

• Repeating patterns: A, B fills as A, B, A, B, A, B...

For example, if you select cells containing 10 and 20, then drag down, the grid will continue with 30, 40, 50... recognizing the step of 10.

Smart Direction Detection

One of the intelligent features of AutoFill is how it determines the fill direction. The grid considers the shape of your source selection when deciding whether to fill horizontally or vertically:

• Vertical source (taller than wide): prefers filling down or up

• Horizontal source (wider than tall): prefers filling right or left

• Square source: prefers vertical direction on ambiguous drags

This means if you select a column of values (vertical), dragging diagonally will prioritize extending the column rather than filling across rows—matching user expectations.

Using AutoFill Programmatically

You can also trigger AutoFill from code using the AutoFill method:

// Fill from source range (A1:A2) to target range (A1:A5)
TMSFNCDataGrid1.AutoFill(
  MakeCell(1, 1),  // Source start (column 1, row 1)
  MakeCell(1, 2),  // Source end (column 1, row 2)
  MakeCell(1, 1),  // Target start
  MakeCell(1, 5)   // Target end
);

This is useful for implementing toolbar buttons, keyboard shortcuts, or automated data entry workflows.

Custom Lists with OnAutoFillGetCustomList

For domain-specific sequences that the grid can't automatically detect, use the OnAutoFillGetCustomList event to define custom lists:

procedure TForm1.TMSFNCDataGrid1AutoFillGetCustomList(Sender: TObject;
  BaseValue: string; var Values: TArray<string>; var Handled: Boolean);
begin
    // Priority levels
  if MatchStr(BaseValue, ['Low', 'Medium', 'High', 'Critical']) then
  begin
    Values := ['Low', 'Medium', 'High', 'Critical'];
    Handled := True;
  end

  // Quarters
  else if MatchStr(BaseValue, ['Q1', 'Q2', 'Q3', 'Q4']) then
  begin
    Values := ['Q1', 'Q2', 'Q3', 'Q4'];
    Handled := True;
  end;
end;

Now when a user types "Q1" and drags the AutoFill handle, the grid will continue with "Q2", "Q3", and so on.

Advanced Control with OnAutoFillCalculateValue

For complete control over how values are calculated during fill operations, use the OnAutoFillCalculateValue event:

procedure TForm1.TMSFNCDataGrid1AutoFillCalculateValue(Sender: TObject;
  SourceCells: TTMSFNCDataGridCellCoordRange;
  SourceValues: TArray<TTMSFNCDataGridCellValue>;
  TargetCells: TTMSFNCDataGridCellCoordRange;
  FillIndex: Integer;
  Direction: TTMSFNCDataGridDataAutoFillDirection;
  var NewValue: TTMSFNCDataGridCellValue;
  var Handled: Boolean);
var
  BaseValue: Double;
begin
  // Example: Compound growth calculation for financial data
  if (SourceCells.StartCell.Column = 3) then // Column D is "Growth" column
  begin
    if Length(SourceValues) > 0 then
    begin
      BaseValue := SourceValues[0].AsExtended;
      NewValue := BaseValue * Power(1.05, FillIndex + 1); // 5% growth per row
      Handled := True;
    end;
  end;
end;

This event gives you access to:

• SourceCells: The range that was selected as the source

• SourceValues: The actual values in the source cells

• TargetCells: The range being filled

• FillIndex: Which cell in the target range is being calculated (0-based)

• Direction: The detected fill direction (gafdUp, gafdDown, gafdLeft, gafdRight)

  
  

Styling the AutoFill Handle

The AutoFill handle appearance can be fully customized through the CellAppearance property:

with TMSFNCDataGrid1.AutoFillAppearance do
begin
  HandleSize := 10;                    // Handle size in pixels
  HandleFill.Color := gcWhite;         // Fill color
  HandleFill.Kind := gfkSolid;         // Solid fill
  HandleStroke.Color := gcDodgerBlue;  // Border color
  HandleStroke.Width := 1;             // Border width
end;

The handle automatically repositions itself when at the right or bottom edge of the grid to ensure it remains fully visible and accessible.

Conclusion

AutoFill in TTMSFNCDataGrid brings spreadsheet-grade productivity to your applications. With intelligent pattern detection, smart direction inference based on selection shape, and comprehensive events for customization, you can create data entry experiences that feel natural and efficient.

Whether you're building a financial application that needs compound growth calculations, a scheduling tool with day/month sequences, or a data management interface with custom lists, AutoFill provides the foundation for intuitive, Excel-like functionality—fully cross-platform and ready to extend.