タップ ターゲットのサイズ

クリック、タップなど、ユーザーが操作できる画面上のすべての要素は、確実に操作できるよう十分な大きさにする必要があります。マテリアル デザインのユーザー補助機能に関するガイドラインで説明されているように、これらの要素の幅と高さは 48 dp 以上にすることをおすすめします。

実装

表示

クリック可能またはタップ可能な要素をレイアウトに実装するには、タップ ターゲットの推奨サイズ以上のサイズを使用することをおすすめします。

これらのコントロールのサイズを動的に変更する場合や、コンテンツのサイズに基づいてサイズを変更する場合は、android:minWidthandroid:minHeight を使用してサイズの下限を設定することをおすすめします。

View の元のサイズを変えずに、タップ可能な範囲を拡大するには、TouchDelegate の使用をおすすめします。これを使用すると、子孫の View の代わりに親のレイアウトでタップイベントを処理できます。

ヒント: ユーザー補助検証ツールで TouchDelegate の使用を検出、確認できるのは、Android 10 以降を実行している場合のみです。それより前の Android バージョンでは、この API を使用してタップ ターゲットを適切なサイズに拡大しても、タップ ターゲットの元のサイズの結果が表示されます。

作成

コンポーズ可能な要素の中にクリック可能またはタップ可能な要素を実装するには、タップ ターゲットの推奨サイズ以上の大きさにすることをおすすめします。

これらのコントロールのサイズを動的に変更する場合や、コンテンツのサイズに基づいてサイズを変更する場合は、Modifier.sizeIn を使用してサイズの下限を設定することをおすすめします。

コンポーズ可能な要素の元のサイズを変えずに、タップ可能な範囲を拡大するには、祖先を clickable にするか、Modifier.mergeDescendants を使用してください。これを使用すると、ユーザー補助サービスは、より大きな祖先のコンポーズ可能な要素にのみフォーカスを当てるようになり、その要素にクリック イベントが送信されます。

デザイン

タップ ターゲットには、ユーザー入力に応答する領域が含まれます。タップ ターゲットは要素の表示サイズより大きくなります。たとえば、アイコンなどの要素の表示サイズが 24 x 24 dp とすると、その周囲を囲むパディングも合わせて 48 x 48 dp のタップ ターゲットが形成されます。Jetpack Compose では、CheckboxSwitch などの Material コンポーネントが自動的にパディングを追加し、48 x 48 dp 以上になるようにします。場合によっては、非常に小さく密接したボタンなどの要素は、拡大した時にタップ可能な領域が重なってしまうことがあります。

タップ ターゲットは 48 x 48 dp 以上とし、8 dp 以上の余白を設けて、情報の密度と使いやすさのバランスを取ることをおすすめします。48 x 48 dp のタップ ターゲットの物理的なサイズは、画面のサイズにかかわらず約 9 mm です。タッチスクリーン オブジェクトのターゲット サイズは 7~10 mm 程度にすることをおすすめします。

例については、マテリアル デザインのユーザー補助機能に関するガイドラインをご覧ください。

テスト

アプリのユーザー インターフェースに小さいタップ ターゲットが含まれていないことを手動で確認するには:

  1. アプリを起動します。
  2. インターフェース内のクリック可能、タップ可能、操作可能な要素をすべて特定します。
  3. これらの各要素のサイズが 48 x 48 dp(約 9 mm)であることを確認します。

小さいタップ ターゲットは、Android の自動テストツールで検出できます。デバイス上でのアプリの手動テストには Android 用ユーザー補助検証ツールを使用することをおすすめします。自動テストでは、EspressoRobolectric でユーザー補助機能の確認を有効にします。

検索
検索をクリア
検索を終了
メインメニュー
13524855458292105509
true
ヘルプセンターを検索
true
true
true
true
true
717068
false
false