Stepper vs. Schieberegler
Ein Stepper ändert eine Zahl in festen Schritten. Ein Slider wählt einen Ort entlang eines Bereichs.
Verwenden Sie einen Stepper für kleine, genaue Änderungen. Verwenden Sie einen Schieberegler, wenn ungefähre Position wichtiger ist als das Eingeben einer genauen Zahl. Zeigen Sie immer den Wert an und unterstützen Sie die Tastatur.
Sieh, was jedes Muster macht
Probieren Sie jedes Beispiel. Lesen Sie dann über den Job, für den es gemacht ist.
macOS Stepper
Ein macOS Stepper hat eine Taste zum Addieren und eine zum Abziehen. Es ändert einen Wert mit festen Grenzen um einen festgelegten Schritt.
Ein Layout-Inspektor ändert das Raster von vier auf fünf Spalten. Der Nutzer muss keine Zahl tippen.
- Verwenden Sie es, wenn
- Verwenden Sie es für eine Zahl mit klaren Grenzen und kleinen Schritten. Es funktioniert am besten, wenn die Leute ein oder zwei Schritte auf einmal ändern.
- Nutze es nicht, wenn
- Vermeide breite oder stufenlose Bereiche und große, schnelle Sprünge. Füge ein Zahlenfeld hinzu, wenn Leute exakte Werte eingeben oder vergleichen müssen.
- In Code verwendeter Name
AppKit NSStepper / SwiftUI Stepper
macOS Slider
Ein macOS Slider hat eine Spur und einen beweglichen Regler. Es wählt einen Wert innerhalb fester Grenzen, entweder frei oder in festen Schritten, und kann Markierungen zeigen.
Ein Audio-Editor bewegt die Lautstärke von leise bis voll. VoiceOver sagt die Zahl auch an.
- Verwenden Sie es, wenn
- Verwenden Sie es, wenn das Durchziehen über einen Bereich und das sofortige Sehen des Ergebnisses hilft. Unterstützen Sie einen fließenden Bereich oder klare Schritte mit Markierungen und Tastaturtasten.
- Nutze es nicht, wenn
- Nutze es nicht für Kategorien, unbegrenzte Bereiche oder sicherheitskritische Genauigkeit. Füge ein passendes Zahlenfeld hinzu, wenn Leute einen genauen Wert wiederholen müssen.
- In Code verwendeter Name
AppKit NSSlider / SwiftUI Slider
Schneller Vergleich
| UI-Muster | Am besten für | Nicht für | In Code verwendeter Name |
|---|---|---|---|
| macOS SteppermacOS Stepper | Verwenden Sie es für eine Zahl mit klaren Grenzen und kleinen Schritten. Es funktioniert am besten, wenn die Leute ein oder zwei Schritte auf einmal ändern. | Vermeide breite oder stufenlose Bereiche und große, schnelle Sprünge. Füge ein Zahlenfeld hinzu, wenn Leute exakte Werte eingeben oder vergleichen müssen. | AppKit NSStepper / SwiftUI Stepper |
| macOS SlidermacOS Slider | Verwenden Sie es, wenn das Durchziehen über einen Bereich und das sofortige Sehen des Ergebnisses hilft. Unterstützen Sie einen fließenden Bereich oder klare Schritte mit Markierungen und Tastaturtasten. | Nutze es nicht für Kategorien, unbegrenzte Bereiche oder sicherheitskritische Genauigkeit. Füge ein passendes Zahlenfeld hinzu, wenn Leute einen genauen Wert wiederholen müssen. | AppKit NSSlider / SwiftUI Slider |
Vor dem Ausliefern
- 01
Schreibe auf, was die Person tun muss.
- 02
Testen Sie Tastatur, Fokus, Berührung, Zoom, Laden, leere und Fehlerzustände.
- 03
Sicherstellen, dass Leute dieselben Informationen ohne Hover oder Bewegung erhalten können.
- 04
Testen Sie mit echtem Inhalt auf kleinen und großen Bildschirmen.
Vergleichsanfrage zum Kopieren
Kopiere das, wenn dein Team Hilfe bei der Wahl zwischen den Mustern braucht.
Wähle das beste Muster aus macOS Stepper (macOS Stepper), macOS Slider (macOS Slider) für unseren echten Nutzerfluss. Nutze diese Regel: Ein Stepper ändert eine Zahl in festen Schritten. Ein Slider wählt einen Ort entlang eines Bereichs. Schreibe die Aufgabe, die Inhaltsmenge und die Kosten eines Abbruchs auf. Prüfe Tastatur, Touch, Laden, Fehler und das Verhalten bei reduzierter Bewegung. Erkläre deine Wahl und baue dann die kleinste zugängliche Version mit dem Design-System des Projekts.