スピンコントロール

[アーティクル]
06/13/2023

Note

この設計ガイドは Windows 7 用に作成されており、新しいバージョンの Windows では更新されていません。ガイダンスの多くは原則として適用されますが、プレゼンテーションと例には現在の設計ガイダンスは反映されていません。

スピンコントロールを使用すると、ユーザーは矢印ボタンをクリックして、関連付けられている数値テキストボックス内の値を段階的に変更できます。 "スピンボックス" という用語は、テキストボックスとそれに関連付けられているスピンコントロールの組み合わせを指します。

スピンコントロールとテキストボックスのスクリーンショット

一般的なスピンボックス。

多くの場合、ユーザーはマウスから手を動かさずに変更を加えることができるため、スピンコントロールを好みます。スピンコントロールがテキストボックスとペアになっている場合、ユーザーはテキストボックスに入力を直接入力または貼り付けることができるため、スピンコントロールの使用は省略可能です。

スピンコントロールは数値入力に使用されますが、入力は純粋な整数である必要はありません。入力には 10 進数を指定でき、負の符号、区切り記号 (コロンやハイフンなど)、および単位修飾子を使用できます。

Note

テキストボックスとレイアウトに関連するガイドラインは、別の記事で示されています。

これは適切なコントロールですか?

それを判断するには、以下の質問を考えます。

コントロールは数値入力に使用されますか? そうでない場合は、ドロップダウンリストやスライダーなどの別のコントロールを使用して、固定された値のセットから選択します。スクロールにはスクロールバーを使用します。
ユーザーは、値を数値ではなく相対数量と考えますか? その場合は、代わりにスライダーを使用します。スピンボックスは、既知の正確な数値に対してのみ使用します。たとえば、ユーザーはオーディオの音量を数値の 2 や 5 ではなく、低や中に設定しようと考えます。
コントロールはテキストボックスとペアになっていますか? そうでない場合は、を使用しないでください。スピンコントロールは、単独で使用したり、テキストボックス以外の種類のコントロールで使用したりしないでください。

正しくない:

この例では、スピンコントロールを使用して動的グラフィックを制御します。
連続する値範囲は有効ですか? そうでない場合は、代わりに有効な値のドロップダウンリストを使用します。

この例では、すべてのディスクドライブ番号が有効なわけではないため、ドロップダウンリストを選択することをお勧めします。
スピン制御の使用は実用的ですか? スピンコントロールの使用は、次の場合に実用的です。
- 小さな数値を入力します。通常は 100 以下です。
- 既存の値または既定値に小さな変更を加える。
スピンコントロールは任意の数値入力に使用できますが、これら以外の状況では非効率的です。
スピンコントロールは役に立ちますか? コントロールは、ユーザーがマウスを使用している可能性が高いコンテキストで使用されますか? そうでない場合は、スピンコントロールを省略可能と考えてください。
兄弟コントロールのドロップダウンリストはありますか? 他のドロップダウンリストがある場合は、一貫性のためにドロップダウンリストを使用することを検討してください。

この例では、スピンボックスを使用できますが、一貫性のためにドロップダウンリストが使用されます。
タッチユーザーまたはペンユーザーは主なターゲットですか? その場合は、代わりにドロップダウンリストを使用することを検討してください。スピンコントロールの矢印ボタンが小さすぎて、タッチやペンで効率的に使用できません。

スライダーまたはスピンボックスが可能な場合は、次の場合にスピンボックスを使用します。

画面領域が狭い。
ユーザーはキーボードの使用を好む可能性があります。

次の場合にはスライダーを使います。

ユーザーにとって、すぐに結果がわかると便利。

ガイドライン

全般

スピンコントロールが実用的で役に立つ場合は常に使用します。 「これは適切なコントロールですか?」を参照してください。
- 例外： 同じユーザーインターフェイス (UI) 上の他のテキストボックスと一貫性を保つには、常に実用的ではない場合でもスピンコントロールを使用します。
正確:

この例では、スピンコントロールは、常に実用的ではない場合でも、一貫性を保つ目的で年コントロールと共に使用されます。

正しくない:

この例では、スピンコントロールは使用できません。
常にスピンコントロールをテキストボックスの "バディ" にします。 これにより、スピンコントロールがテキストボックス内に配置されます。

正確:

正しくない:

正しい例では、スピンコントロールは関連付けられているテキストボックス内に配置されます。
関連付けられているテキストボックスが無効になっている場合は、スピンコントロールを無効にします。 スピンコントロールは補足入力メソッドであり、唯一の入力メソッドではありません。

値

上部ボタンを定義して値を 1 単位ずつ増やし、下部のボタンを 1 単位ずつ減らします。 通常、単位は 1 ですが、値の最も小さな一般的な変更である必要があります。スピンコントロールは、すべての有効な値をカバーする必要があり、テキストを入力するよりも便利である必要があります。

この例では、スピンコントロールをクリックすると、値が .1 で変更されます。これは、値の最も小さな一般的な変更です。小さい単位を使用すると、有効な値の範囲がカバーされますが、スピンコントロールは使用できなくなります。
入力を有効な値に制限するには、スピンコントロールを使用します。 スピンコントロールを使用すると、正しくない値になることはありません。
有効な値の範囲の末尾で、範囲を再起動します。 スピン制御のメタファーは、ユーザーが値のホイールを回転させているため、このホイールのような動作です。
- 例外： 結果の値が正しくないと確信している場合は、範囲を再起動しないでください。
  
  この例では、下向き矢印ボタンをクリックしても、範囲は (最大値に移動して) 再起動されません。これは、その値が正しくないことが確実であるためです。
特殊な数値の代わりにテキストを使用します。 ユーザーがこれらの特別な値を認識して入力する代わりに、これらの特別な値にスピンすることを許可します。

この例では、Never は特別な値ですが、ユーザーはそれにスピンできます。
値に区切り記号がある場合は、関連付けられているテキストボックスに複数の入力フォーカスポイントが必要です。 これにより、数値セグメントを個別に操作できます。

この例では、スピンコントロールは、フォーカスがある時間、分、秒、A.M./P.M.の値に影響します。
値に単位がある場合は、スピンコントロールを使用してそれらの単位も変更します。

この例では、スピンコントロールを使用して単位を変更できます。