Selection Controls

選択コントロールは、二値選択(オン/オフ)やグループアクション(1つ以上のアクションをグループから選択)の場合にユーザーが実行できるアクションです。

Selection Controls

選択コントロールの使用方法

次の3種類の選択コントロールがあります。

  • チェックボックス
  • ラジオボタン
  • スイッチ

各コントロールの対話状態には、NORMAL、PRESSED、FOCUSED、DISABLEDの4種類があります。

チェックボックス

チェックボックスを使用すると、ユーザーは項目のセットから1つまたは複数を選択できます。1つも選択しなくてもかまいません。

Checkboxes

親子のチェックボックス

主要な選択肢の下に二次的な選択肢を入れ子にして、チェックボックスの親子関係を作ることができます。親チェックボックスを使用して項目を整理し、複数の項目を簡単に選択できるようにします。子チェックボックスは、親チェックボックスの状態(SELECTED/UNSELECTED)を自動的に継承します。

: SELECTEDになっている子チェックボックスがある場合、親チェックボックスの状態はINDETERMINATEになります。

チェックボックスには、次の状態があります。

  • SELECTED
  • INDETERMINATE
  • UNSELECTED

Checkboxes states

ラジオボタン

ラジオボタンを使用すると、使用可能な機能のセットから1つのアクションを選択できます。ユーザーにすべての項目を表示して、そこから1つだけ選択できるようにする場合に、ラジオボタンを使用します。

Radio buttons

スイッチ

スイッチを使用すると、物理的な電気スイッチのように、2つの状態(機能のオン/オフなど)を切り替えることができます。

点が左側にあるときはスイッチがオフ、右側にあるときはオンです。

Switches

ベストプラクティス

  • チェックボックスを入れ子にする場合は、2階層までにしてください。
  • 先に進む前にユーザーの確認が必要な場合、ユーザーの意思を確認するためにチェックボックスを使用します。
  • 機能やモードのオン/オフを切り替える必要がある場合は、スイッチを使用します。より多くのコントロールを表示したり、新しい機能を有効にしたりするなどの変更が即座に行われることもあります。
  • ラジオボタンは、グループから1つの項目のみを選択するものです。複数の項目を選択する場合は、チェックボックスを使用してください。

アクセシビリティ

以下に、選択コントロールのライトモードとダークモードの一覧を示します。

チェックボックス

Checkbox

ラジオボタン

Radio button

スイッチ

Switch

試してみる

APLドキュメントの作成と編集を参照してください。

開発者向けドキュメント