TreeView

TsgcHTMLComponent_TreeView — render een inklapbare hiërarchische boom vanuit je eigen knooppunten of rechtstreeks vanuit een dataset, in Delphi, C++ Builder en .NET.

TsgcHTMLComponent_TreeView

Een boomcomponent dat een Bootstrap-list-group met inklapbare takken uitstuurt. Voeg knooppunten toe (elk met kinderen), stel de iconen en inspringing in en lees dan de HTML-eigenschap.

Componentklasse

TsgcHTMLComponent_TreeView

Rendert

Bootstrap 5 list-group inklapbare boom

Talen

Delphi, C++ Builder, .NET

Maak hem aan, voeg knooppunten toe, render hem

Voeg een knooppunt toe aan Nodes, voeg kindrijen toe aan zijn Children-lijst, stem IndentSize en de iconen af en lees dan HTML (of plaats het in een TsgcHTMLTemplate_Bootstrap-pagina).

uses
  sgcHTML_Enums, sgcHTML_Component_TreeView;

var
  oTree: TsgcHTMLComponent_TreeView;
  oNode: TsgcHTMLTreeNode;
begin
  oTree := TsgcHTMLComponent_TreeView.Create(nil);
  try
    oTree.TreeID := 'fileTree';
    oTree.ShowLines := True;
    oTree.Selectable := True;
    oTree.IndentSize := 24;

    oNode := oTree.Nodes.Add;
    oNode.Text := 'Documents';
    oNode.Expanded := True;
    oNode.Children.Add('Invoice.pdf');
    oNode.Children.Add('Report.docx');

    WebModule.Response := oTree.HTML;   // list-group tree
  finally
    oTree.Free;
  end;
end;

// Or build the tree straight from a self-referencing dataset:
oTree.LoadFromDataSet(qryFolders, 'ID', 'ParentID', 'Name');
// includes: sgcHTML_Enums.hpp, sgcHTML_Component_TreeView.hpp

TsgcHTMLComponent_TreeView *oTree = new TsgcHTMLComponent_TreeView(NULL);
try
{
  oTree->TreeID = "fileTree";
  oTree->ShowLines = true;
  oTree->Selectable = true;
  oTree->IndentSize = 24;

  TsgcHTMLTreeNode *oNode = oTree->Nodes->Add();
  oNode->Text = "Documents";
  oNode->Expanded = true;
  oNode->Children->Add("Invoice.pdf");
  oNode->Children->Add("Report.docx");

  String html = oTree->HTML;   // list-group tree
}
__finally
{
  delete oTree;
}
using esegece.sgcWebSockets;

var tree = new TsgcHTMLComponent_TreeView();
tree.TreeID = "fileTree";
tree.ShowLines = true;
tree.Selectable = true;
tree.IndentSize = 24;

var node = tree.Nodes.Add();
node.Text = "Documents";
node.Expanded = true;
node.Children.Add("Invoice.pdf");
node.Children.Add("Report.docx");

string html = tree.HTML;   // list-group tree

// Or build the tree straight from a self-referencing dataset:
tree.LoadFromDataSet(qryFolders, "ID", "ParentID", "Name");

Belangrijkste eigenschappen en methoden

De members die je het vaakst gebruikt.

Knooppunten

Nodes is de TsgcHTMLTreeNodes-verzameling; Nodes.Add retourneert een TsgcHTMLTreeNode met Text, Href, Icon, Expanded, Selected en NodeID.

Kinderen

De Children van elk knooppunt is een TStringList van bladrijen; niet-lege takken renderen automatisch een Bootstrap-collapse-toggle.

Datasetbinding

LoadFromDataSet(aDataSet, aIDField, aParentIDField, aTextField) bouwt de hele boom uit een zelfverwijzende query in twee passes.

Uiterlijk

ShowLines, LineColor / LineColorStyle en IndentSize bepalen de geleidelijnen en de nestingoffset; Selectable markeert de actieve rij.

Iconen

ExpandedIcon, CollapsedIcon en LeafIcon stellen de glyphs in voor open takken, gesloten takken en bladeren (HTML-entiteiten toegestaan).

Uitvoer

HTML retourneert de list-group-boommarkup en TreeID stelt de element-id in — serveer hem, of wijs hem toe aan de BodyContent van een paginatemplate.

Blijf ontdekken

Alle sgcHTML-componentenBlader door de volledige functiematrix van 60+ componenten.
Download gratis proefversieDe proefversie van 30 dagen bevat de 60.HTML-demoprojecten.
PrijzenSingle-, Team- en Site-licenties met volledige broncode.

Klaar om te beginnen?

Download de gratis proefversie en begin met het bouwen van web-UI's in Delphi, C++ Builder en .NET.