FluentUI: TreeView – Demo-Übersicht
Zurück: FluentUI: Komponenten-Referenzen
Der Baum im Überblick: Navigationsform, Auswahl mit Kästchen, Verschieben per Drag & Drop und das Einklappen auf Symbole – und die Abgrenzung zur Tree List.
Status: vollständig [Live] – Navigations-Grundform plus
Selection/Checkboxes, Drag&Drop-Verschieben und Icon-Kollaps
(Vollausbau 2026-07-14). Quelle: widgets::tree() in
helper/widgets.php + scripts/treeview.js. Referenz: DevExpress
ASPxTreeList im reinen Baum-Modus / klassisches ASPxTreeView-Konzept.
Wichtige Abgrenzung
tree() ist im Default ein Navigationsbaum: jeder Knoten mit
href ist ein <a>-Link auf eine andere Seite (Erstkonsument:
Objektbaum in wksqliteds Sidebar). Die Auswahl-Modi (selection)
erweitern dieses Fundament additiv – die Navigations-Grundform bleibt der
unveränderte Default.
Demo-Kategorien
| Kategorie | Status |
|---|---|
| Grundlagen | [Live] – tree(), Navigationsbaum |
| Selection / Checkboxes | [Live] |
| Drag & Drop | [Live] |
| Adaptivity | [Live] |
| Accessibility | [Live] – native Semantik + role=tree-Set bei aktiver Selection |
Verwandte Themen
- Tree List – Baum mit Spalten (DataGrid+TreeView kombiniert)
- NavBar – gruppierte Navigation als Alternative zum Baum
- FluentUI: Basis-Widget-Katalog – Einordnung in Stufe 1 (Zeile „List/Tree“)
- FluentUI: Öffentliche Helper-API – vollständiger Methodenvertrag