Prinzipien Grundlagen Barrierefreiheit Design System Guidelines Deutsch Français Italiano English Unsere Gestaltungsprinzipien Nutzerzentriert Wiedererkennbar Inklusiv Reduziert Ganzheitlich Selbsterklärend Aufgabenorientiert Passend SBB Markenportal Logo Digitale Uhr Nutzungsrechte Basis-Farben Funktionale Farben Off-Brand Farben Icons Fahrplan-Icons Piktogramme Über Barrierefreiheit Über diesen Guide Kontakt Weitere Informationen Product Owner User Research Interaction Design Visual Design Development Content Design Testing Was ist ein Design System?​ Designing Coding FAQ Hilfe Prozess Contribution Kontakt Übersicht Basis Komponenten Übersicht Releases Design Tokens Komponenten Übersicht Basis Informationen Übersicht Basis Komponenten Sinn & Zweck Community Assets Anleitung Power-Apps Digitale Werbebanner SAP App Icons Tree

Übersicht

Was macht die Komponente?

  • Zeigt hierarchisch strukturierte Daten in einer Baumstruktur an.

Wann soll die Komponente eingesetzt werden?

  • Zur Darstellung und Auswahl von Elementen in hierarchischer Struktur.

Regeln

  • Beim Einsatz eines Trees als Navigationselement ist es sinnvoll, nicht zu viele Hierarchiestufen eizusetzen (Empfehlung max. 3).
  • Beim Einsatz eines Trees zur Darstellung von Datenstrukturen (z.B. ein Dossier, analog Filebrowser) ist es abhängig vom Anwendungsfall wieviele Hierarchiestufen benötigt werden.
  • Das Icon als Ergänzung zum Text ist optional.
Zustände und Varianten

Zustände

Die Komponente hat folgende Zustände:

  • Collapsed
  • Expanded
  • Default
  • Hover
  • Selected

Varianten

Standard

Darstellung eines Trees

Selektierbar

Darstellung eines Trees Variante selektierbar

Beispielanwendung

Darstellung eines Beispiels eines Trees

Spezifikationen

Design

Impressum Kontakt Datenschutz Cookie Einstellungen