Übersicht der Terminal UI (TUI) Entwicklung für WvdS FPC RAD Studio.

Terminal User Interface (TUI) ermöglicht grafische Oberflächen im Terminal:

• Textbasierte Darstellung - Zeichen statt Pixel
• Cross-Platform - Läuft auf Windows Terminal, WezTerm, iTerm2, Linux Console
• Ressourcenschonend - Ideal für Server, SSH, Container
• Barrierearm - Screenreader-kompatibel

Der WVDS TUI-Standard orientiert sich an Ratatui-Qualität oder besser:

┌─────────────────────────────────────────────────────────────┐
│  PXAML (Markup)                                             │
├─────────────────────────────────────────────────────────────┤
│  Control Model (TWvdS*) - Target-neutral                    │
├─────────────────────────────────────────────────────────────┤
│  TUI Renderer - Target-spezifisch                           │
├─────────────────────────────────────────────────────────────┤
│  Render Surface → CellBuffer → DiffEngine                   │
├─────────────────────────────────────────────────────────────┤
│  Terminal IO (ANSI Escape Sequences)                        │
└─────────────────────────────────────────────────────────────┘

Control-Models enthalten keine Terminal-spezifische Logik:

(* KORREKT - Target-neutral *)
TWvdSButton = class(TWvdSControl)
private
  FCaption: string;
  FOnClick: TNotifyEvent;
public
  property Caption: string read FCaption write SetCaption;
  property OnClick: TNotifyEvent read FOnClick write FOnClick;
end;
 
(* VERBOTEN - Terminal-spezifisch im Model *)
TWvdSButton = class(TWvdSControl)
  procedure WriteAnsiSequence;  (* VERBOTEN! *)
end;

Renderer zeichnen das Model in den CellBuffer:

TWvdSTUIButtonRenderer = class(TWvdSTUIRenderer)
public
  procedure Measure(AControl: TWvdSControl; AAvail: TSize): TSize; override;
  procedure Paint(AControl: TWvdSControl; ASurface: TRenderSurface); override;
  function HandleInput(AControl: TWvdSControl; AEvent: TInputEvent): Boolean; override;
end;

Jedes Control hat standardmäßig Anchoring aktiviert:

Anchors: Left, Top, Right, Bottom

Default: Left+Top (stabile Position)
Left+Right: Breite dehnt sich mit Parent
Top+Bottom: Höhe dehnt sich mit Parent
Alle vier: Rect dehnt sich in beide Richtungen

unit WvdS.UI.Controls.MyControl;
 
type
  TWvdSMyControl = class(TWvdSControl)
  private
    FValue: string;
  public
    property Value: string read FValue write SetValue;
  end;

unit WvdS.UI.TUI.Renderers.MyControl;
 
type
  TWvdSTUIMyControlRenderer = class(TWvdSTUIRenderer)
  public
    procedure Measure(AControl: TWvdSControl; AAvail: TSize): TSize; override;
    procedure Paint(AControl: TWvdSControl; ASurface: TRenderSurface); override;
  end;

{
  "id": "mycontrol",
  "renderers": {
    "tui": {
      "unit": "WvdS.UI.TUI.Renderers.MyControl",
      "class": "TWvdSTUIMyControlRenderer"
    }
  },
  "targetCaps": {
    "requires": ["keyboard"],
    "optional": ["mouse"]
  }
}

Jede TUI-Implementierung muss verifiziert werden:

[ ] Kein Flicker bei wiederholtem Repaint
[ ] Resize produziert stabiles Layout
[ ] TextEdit Caret ist stabil bei Wide/Combining Chars
[ ] Table/List rendert 10k Rows mit smooth Scroll
[ ] Images verhalten sich korrekt per TerminalCaps
[ ] Focus bleibt stabil durch Reflow

• TUI Engine
• TUI Controls
• TUI Layout
• Build-Targets
• Control-Entwicklung