Skip to main content

Overview

The TTreeLeftRightAlignChild class arranges child nodes horizontally to the right of their parent, with siblings distributed vertically and centered around the parent’s middle point.

Class Reference

TTreeLeftRightAlignChild

Positions children horizontally to the right of parent nodes, with vertical centering.
This class is defined in the TreeChildManagers unit.

Properties

HorizMargin
Integer
default:"32"
Horizontal spacing between parent and child nodes in pixels.
VertMargin
Integer
default:"8"
Vertical spacing between sibling nodes in pixels.
CrossMargin
Integer
default:"8"
Horizontal margin for the cross-box (expand/collapse control) in pixels.
ToShapeOffset
Integer
default:"-4"
Connection offset from the target shape in pixels.

Layout Behavior

The horizontal layout algorithm:
  1. X Position - Children are positioned HorizMargin pixels to the right of parent’s right edge
  2. Y Position - Siblings are centered vertically around parent’s Y center
  3. Spacing - Siblings separated by VertMargin pixels
  4. Connections - Horizontal connector with vertical distribution to children

Visual Description

                    ┌─ Child 1
Root ───────────────┤
                    └─ Child 2
With grandchildren:
                    ┌─ Child 1 ──┬─ Grandchild 1.1
                    │            └─ Grandchild 1.2
Root ───────────────┤
                    │            ┌─ Grandchild 2.1
                    └─ Child 2 ──┴─ Grandchild 2.2

Usage

Setting Horizontal Layout

uses TreeChildManagers;

// Replace default child manager
Tree1.GlobalFormat.ChildManager.Free;
Tree1.GlobalFormat.ChildManager := TTreeLeftRightAlignChild.Create;

Customizing Spacing

var
  Manager: TTreeLeftRightAlignChild;
begin
  Manager := TTreeLeftRightAlignChild.Create;
  Manager.HorizMargin := 50;   // Wider horizontal spacing
  Manager.VertMargin := 15;    // More space between siblings
  Manager.CrossMargin := 10;
  
  Tree1.GlobalFormat.ChildManager := Manager;
end;

Creating a Horizontal Tree

var
  Root: TTreeNodeShape;
begin
  // Set horizontal layout first
  Tree1.GlobalFormat.ChildManager.Free;
  Tree1.GlobalFormat.ChildManager := TTreeLeftRightAlignChild.Create;
  
  // Create nodes
  Root := Tree1.AddRoot('Start');
  Root.Expanded := True;
  
  // Children will be arranged horizontally
  Root.AddChild('Process 1');
  Root.AddChild('Process 2');
  Root.AddChild('Process 3');
end;

Connection Style

The horizontal layout draws connections with:
  • Main line - Horizontal from parent’s right edge
  • Branch point - Midpoint between parent and children
  • Vertical distribution - Lines extend vertically to each child
  • Entry point - Connects to left edge of child nodes

Connection Points

The layout automatically creates connection points:
  1. Start at parent’s right edge, vertically centered
  2. Extend horizontally by HorizMargin / 2
  3. Branch vertically to each child’s Y center
  4. Extend to child’s left edge with ToShapeOffset

Common Use Cases

Flowcharts

Create left-to-right process flows and workflow diagrams.

Timeline Views

Display chronological events expanding to the right.

State Machines

Show state transitions in a horizontal layout.

Process Maps

Map business processes with horizontal expansion.

Comparison with Explorer Layout

FeatureExplorerHorizontal
Child X PositionRight of parentRight of parent
Child Y PositionBelow previous siblingCentered around parent
Default HorizMargin1932
Default VertMargin18
Best ForHierarchiesFlows

Tips

For balanced trees, increase VertMargin to prevent overlapping when nodes have many children.
Nodes with greatly varying heights may cause layout issues. Consider using uniform node sizes for best results.

Build docs developers (and LLMs) love