Drehsteuerelemente

Hinweis

Dieses Entwurfshandbuch wurde für Windows 7 erstellt und wurde nicht für neuere Versionen von Windows aktualisiert. Ein Großteil der Anleitungen gilt immer noch grundsätzlich, aber die Präsentation und die Beispiele spiegeln nicht unsere aktuellen Entwurfsanleitungen wider.

Mit einem Drehsteuerelement können Benutzer auf Pfeilschaltflächen klicken, um den Wert im zugeordneten numerischen Textfeld inkrementell zu ändern. Der Begriff Spinbox bezieht sich auf die Kombination aus einem Textfeld und dem zugehörigen Drehsteuerelement.

Screenshot: Drehsteuerung und Textfeld

Eine typische Spinbox.

Benutzer bevorzugen häufig Drehsteuerungen, da sie Änderungen vornehmen können, ohne ihre Hände von der Maus zu bewegen. Wenn das Spin-Steuerelement mit einem Textfeld gekoppelt ist, können Benutzer Eingaben direkt in das Textfeld eingeben oder einfügen, sodass die Verwendung des Spin-Steuerelements optional ist.

Während Drehsteuerelemente für numerische Eingaben verwendet werden, muss die Eingabe keine reine ganze Zahl sein. Die Eingabe kann Dezimalzahlen sein und negative Vorzeichen, Trennzeichen (z. B. Doppelpunkte oder Bindestriche) und Einheitenmodifizierer aufweisen.

Hinweis

Richtlinien für Textfelder und Layout werden in separaten Artikeln vorgestellt.

 

Ist dies das richtige Steuerelement?

Orientieren Sie sich an folgenden Fragen:

  • Wird das Steuerelement für numerische Eingaben verwendet? Andernfalls verwenden Sie ein anderes Steuerelement, z. B. eine Dropdownliste oder einen Schieberegler, um aus einem festen Satz von Werten auszuwählen. Verwenden Sie Bildlaufleisten zum Scrollen.

  • Betrachten Benutzer den Wert als relative Menge, nicht als numerischen Wert? Wenn ja, verwenden Sie stattdessen einen Schieberegler. Verwenden Sie Spinboxen nur für genaue, bekannte numerische Werte. So denken Benutzer beispielsweise beim Festlegen der Audiolautstärke an "niedrig" oder "mittel", aber nicht an Werte wie "2" oder "5".

  • Ist das Steuerelement mit einem Textfeld gekoppelt? Verwenden Sie andernfalls nicht. Spin-Steuerelemente sollten nicht allein oder mit anderen Steuerelementtypen außer einem Textfeld verwendet werden.

    Falsch:

    Screenshot: Drehsteuerung, Grafik, kein Textfeld

    In diesem Beispiel wird ein Drehsteuerelement verwendet, um eine dynamische Grafik zu steuern.

  • Sind zusammenhängende Wertbereiche gültig? Verwenden Sie andernfalls eine Dropdownliste mit gültigen Werten.

    Screenshot der Dropdownliste

    In diesem Beispiel sind nicht alle Datenträgerlaufwerknummern gültig, sodass eine Dropdownliste die bessere Wahl ist.

  • Ist die Verwendung der Drehsteuerung praktisch? Die Verwendung eines Drehreglers ist praktisch für:

    • Geben Sie eine kleine Zahl ein, in der Regel unter 100.
    • Nehmen Sie kleine Änderungen an einem vorhandenen Oder Standardwert vor.

    Während Drehsteuerelemente für jede numerische Eingabe verwendet werden können, sind sie in anderen Situationen ineffizient.

  • Ist die Drehsteuerung hilfreich? Wird das Steuerelement in einem Kontext verwendet, in dem Benutzer wahrscheinlich ihre Maus verwenden? Andernfalls sollten Sie ein Spin-Steuerelement optional in Betracht ziehen.

  • Sind die Dropdownlisten der gleichgeordneten Steuerelemente? Wenn andere Dropdownlisten vorhanden sind, sollten Sie für die Konsistenz eine Dropdownliste verwenden.

    Screenshot des Dialogfelds mit Dropdownlisten

    In diesem Beispiel könnte ein Spinbox verwendet werden, aber für die Konsistenz wird eine Dropdownliste verwendet.

  • Sind Touch- oder Stiftbenutzer ein primäres Ziel? In diesem Fall sollten Sie stattdessen eine Dropdownliste verwenden. Die Pfeiltasten in einem Drehsteuerelement sind zu klein, um mit Toucheingabe oder Stift effizient verwendet zu werden.

Wenn ein Schieberegler oder eine Drehbox möglich ist, verwenden Sie eine Spinbox, wenn:

  • Der auf dem Bildschirm verfügbare Platz ist knapp.
  • Ein Benutzer wird wahrscheinlich die Verwendung der Tastatur bevorzugen.

Verwenden Sie in folgenden Fällen einen Schieberegler:

  • Benutzer profitieren von sofortigem Feedback.

Richtlinien

Allgemein

  • Verwenden Sie Drehsteuerungen, wenn sie praktisch und hilfreich sind. Weitere Informationen finden Sie unter Ist dies das richtige Steuerelement?

    • Ausnahme: Um mit anderen Textfeldern auf derselben Benutzeroberfläche konsistent zu sein, verwenden Sie Drehsteuerelemente, auch wenn sie nicht immer praktisch sind.

    Richtig:

    Screenshot der Drehsteuerungen für Monat, Tag, Jahr

    In diesem Beispiel wird ein Drehsteuerelement mit dem Year-Steuerelement zur Konsistenz verwendet, obwohl es nicht immer praktisch ist.

    Falsch:

    Screenshot des Ip-Adress-Spin-Steuerelements

    In diesem Beispiel ist das Drehsteuerelement nicht verwendbar.

  • Machen Sie immer ein Drehsteuerelement zum "Buddy" des Textfelds. Dadurch wird das Drehsteuerelement im Textfeld platziert.

    Richtig:

    Screenshot des Im Textfeld platzierten Drehsteuerelements

    Falsch:

    Screenshot des außerhalb des Textfelds platzierten Drehsteuerelements

    Im richtigen Beispiel wird das Drehsteuerelement im zugehörigen Textfeld platziert.

  • Deaktivieren Sie ein Drehsteuerelement, wenn das zugehörige Textfeld deaktiviert ist. Das Spin-Steuerelement ist eine zusätzliche Eingabemethode – niemals die einzige Eingabemethode.

Werte

  • Definieren Sie die obere Schaltfläche, um den Wert um eine Einheit zu erhöhen, und die untere Schaltfläche um eine Einheit zu verringern. In der Regel ist die Einheit eins, aber es sollte die kleinste allgemeine Wertänderung sein. Im Idealfall sollte das Drehsteuerelement alle gültigen Werte abdecken, und es sollte bequemer sein, als den Text einzugeben.

    Screenshot des Drehsteuerelements

    In diesem Beispiel ändert das Klicken auf ein Drehsteuerelement die Werte um .1, die kleinste allgemeine Änderung des Werts. Die Verwendung einer kleineren Einheit würde den Bereich der gültigen Werte abdecken, aber die Drehsteuerungen unbrauchbar machen.

  • Verwenden Sie das Drehsteuerelement, um die Eingabe auf gültige Werte zu beschränken. Die Verwendung eines Drehsteuerelements sollte niemals zu einem falschen Wert führen.

  • Starten Sie am Ende eines Bereichs mit gültigen Werten den Bereich neu. Die Metapher der Drehsteuerung ist, dass der Benutzer ein Rad von Werten dreht, daher dieses radähnliche Verhalten.

    • Ausnahme: Starten Sie den Bereich nicht neu, wenn der resultierende Wert sicher falsch ist.

      Screenshot des Drehsteuerelements

      In diesem Beispiel wird durch Klicken auf die Schaltfläche mit dem Pfeil nach unten der Bereich nicht neu gestartet (indem sie zum Höchstwert wechseln), da dieser Wert sicher falsch ist.

  • Verwenden Sie Text anstelle von speziellen numerischen Werten. Ermöglichen Sie Benutzern, diese speziellen Werte zu verwenden, anstatt sie kennen und eingeben zu müssen.

    Screenshot: Drehsteuerung

    In diesem Beispiel ist Never ein besonderer Wert, aber Benutzer können darauf zugreifen.

  • Wenn der Wert über Trennzeichen verfügt, sollte das zugeordnete Textfeld mehrere Eingabefokuspunkte aufweisen. Dadurch können die numerischen Segmente einzeln bearbeitet werden.

    Screenshot der Zeitdrehsteuerung, ausgewählte Minuten

    In diesem Beispiel wirkt sich das Drehsteuerelement auf die Werte für Stunden, Minuten, Sekunden und A.M./P.M. aus – je nachdem, welcher Fokus den Fokus hat.

  • Wenn der Wert Einheiten enthält, verwenden Sie das Drehsteuerelement, um diese Einheiten ebenfalls zu ändern.

    Screenshot des Time Spin-Steuerelements, ausgewählt

    In diesem Beispiel kann das Drehsteuerelement verwendet werden, um Einheiten zu ändern.

Bezeichnungen

  • Wenden Sie die Richtlinien für die Textfeldbeschriftung an, um das zugeordnete Textfeld zu beschriften. Drehsteuerelemente werden nie direkt bezeichnet.

Dokumentation

Wenn Sie auf Drehsteuerungen verweisen:

  • Verweisen Sie nicht auf Drehsteuerelemente in der Benutzerdokumentation. Verweisen Sie stattdessen auf die Bezeichnung des zugeordneten Textfelds.
  • Informationen zu Drehsteuerungen und Spinboxen finden Sie nur in der Programmierung und anderen technischen Dokumentationen.

Beispiel: Geben Sie im Feld Datum den Teil des Datums ein, das Sie ändern möchten, oder wählen Sie diesen aus.

Glossar