Komponenten

Date Pickers

Mit dem Date Picker können Nutzer einzelne Daten oder einen Datumsbereich auswählen. In diesem Guide erfahren Sie, wie diese Komponente eingesetzt wird.

Date Pickers
  • Anwendung
  • Beispiele
  • Verwandte Komponente
  • Download

Anwendung

Date Picker werden immer dann eingesetzt, wenn ein spezifisches Datum ausgewählt werden soll. Der Datumsbereich ist jedoch beschränkt, damit Nutzer nicht unnötig lange nach dem gewünschten Datum suchen müssen. Date Picker bieten sich beispielsweise für die Auswahl eines Datums der Paketzustellung an. Für die Angabe des Geburtsdatums sind sie weniger gut geeignet. Verwenden Sie für mobile Endgeräte den nativen Date Picker des jeweiligen Betriebssystems.

Im zugeklappten Zustand zeigt ein Date Picker entweder ein leeres Feld, ein Platzhaltertext, oder ein bereits gewähltes Datum. Um den Nutzer über die nötige Datumsformatierung zu informieren, kann ein Platzhaltertext mit der jeweiligen Formatierung genutzt werden.

Im aufgeklappten Zustand zeigt der Date Picker einen interaktiven Kalender in welchem Nutzer ein einzelnes Datum oder einen Zeitraum wählen kann. Die Auswahl wird in rot gekennzeichnet, das aktuelle Datum schwarz. Daten die nicht verfügbar sind sind ausgegraut. Zusätzliche Buttons können als Schnellauswahl verwendet werden um zu häufig genutzten Tagen zu springen.

 

Date Picker für die Auswahl eines einzelnen Datums.

Date Picker für die Auswahl mehrerer Daten.

Beispiele

Verwandte Komponente

Download

Wenn Sie ein Dokument herunterladen, akzeptieren Sie unsere Nutzungsbedingungen.

Sketch UI Library