マウスポインタ アイコン

Android ユーザーは、スマートフォン、タブレット、折りたたみ式デバイス、Chromebook など、さまざまなフォーム ファクタからアプリにアクセスします。ユーザーは、特に大画面でアプリを操作する際に、3 ボタン マウスなどのポインティング デバイスを使用することもあります。Android アプリケーションでは、マウス ポインタにさまざまなスタイルを適用して、ユーザーがオブジェクトを操作できることを視覚的に示すことができます。

システムのデフォルト カーソルを使用する

ユーザーは、大画面デバイスでさまざまな種類のオブジェクトを操作するためのさまざまな規則に慣れています。Android では、ユーザーがよく知っている一般的なカーソル アイコンがデベロッパーに提供されています。これらのシステム デフォルトのカーソル アイコンは、数行のコードで追加できます。次の Kotlin スニペットを見てみましょう。

myView.setOnHoverListener { view, _ ->
      view.pointerIcon =
         PointerIcon.getSystemIcon(applicationContext, PointerIcon.TYPE_HAND)
      false // Listener did not consume the event.
}

この例では、myView は特定の条件でポインタ アイコンに設定されるビューです。ここで示されている条件は、マウスカーソルがビューの上にあるときに発生するホバー状態です。他のシナリオでは、処理中の待機アイコンやゲーム内の照準が必要になることがあります。

setOnHoverListener は、ポインタがホバー状態になったときにリッスンし、そのイベントに基づいて動作します。イベント リスナー内で view.pointerIcon が呼び出され、その特定のビューのポインタ アイコンが設定されます。既存のシステム アイコンを使用して、ポインタのアイコンを設定します。

Android には、いくつかのシステム アイコンが組み込まれています。完全なリストは、このページの下部にあります。TYPE_HAND アイコンが使用されました。これは、人差し指を伸ばした閉じた手を示しています。

独自の特殊なカーソルを使用する

// Loading a bitmap to use as a pointer icon
    BitmapFactory.decodeResource(
        this.resources,
        R.drawable.dollar_sign
    ), CURSOR_WIDTH, CURSOR_HEIGHT, false
)

// Creating the pointer icon and sending clicks from the center of the mouse icon
PointerIcon.create(dollarBitmap, (CURSOR_WIDTH/2).toFloat(), (CURSOR_HEIGHT/2).toFloat())

注: ホットスポットの場所はユースケースによって異なります。たとえば、お絵かきアプリでは、ホットスポットをペンやブラシの先端に設定します。

例

アプリケーションにポインタ アイコンを追加すると、ユーザーが使用するさまざまなデバイス フォーム ファクタで、より直感的な操作が可能になります。優れたデフォルトのシステム アイコンが多数用意されています。ニーズに合わない場合は、独自のアイコンを読み込んだり作成したりすることもできます。

  • ドラッグ＆ドロップ - アプリケーションが別のアプリケーションからのドラッグと、アプリケーションへのドロップをサポートしている場合は、TYPE_NO_DROP アイコンを実装できます。これにより、アプリにドロップしようとしている MIME タイプがアプリでサポートされていないことを視覚的に示すことができます。
  • 地図 - 地図アプリで、地図をパンできることをユーザーに示したい場合は、地図にカーソルを合わせたときに TYPE_GRAB アイコンを表示するオプションを用意できます。ユーザーがクリックしたときに、アイコンを手のひらアイコンに更新して、地図をパンしていることを示すことができます。
  • 写真の編集 - 写真の編集ユーザーは、拡大鏡を選択して拡大できるコントロールを好みます。ズームイン モードが選択されている場合、カーソルを TYPE_ZOOM_IN アイコンの虫眼鏡に変更できます。
  • その他多数の機会

注: さまざまなポインタの変更の動作を確認するには、GitHub ポインタ サンプルをご覧ください。

Android アプリのカスタム ポインタ アイコン。

付録

関連情報

システムのデフォルト カーソル

これらは、Android システムでデフォルトで使用できるカーソルです。

カーソル名 アイコン
TYPE_ALIAS エイリアス カーソル。矢印の横に小さな曲がった矢印が付いている。
TYPE_ALL_SCROLL 全スクロール カーソル。外側を指す 4 つの矢印が付いた円。
TYPE_ARROW 標準の矢印カーソル。
TYPE_CELL Cell Cursor
TYPE_CONTEXT_MENU コンテキスト メニュー カーソル。矢印の横に小さなメニュー アイコンが表示されます。
TYPE_COPY コピー カーソル（プラス記号が横に付いている矢印）。
TYPE_CROSSHAIR 十字カーソル。中央に点があるプラス記号。
TYPE_DEFAULT デフォルトの矢印カーソル。
TYPE_GRAB つかむカーソル（開いた手）。
TYPE_GRABBING つかむカーソル（閉じた手）。
TYPE_HAND 人差し指を指している手のハンドカーソル。
TYPE_HELP ヘルプ カーソル。矢印の横に疑問符が付いています。
TYPE_HORIZONTAL_DOUBLE_ARROW サイズ変更用の水平方向の二重矢印カーソル。
TYPE_NO_DROP ドロップ禁止カーソル（斜線が入った円）。
TYPE_NULL カーソルが表示されない
TYPE_TEXT テキスト カーソル（I ビーム）。
TYPE_TOP_LEFT_DIAGONAL_DOUBLE_ARROW サイズ変更用の左上から右下への斜めの二重矢印カーソル。
TYPE_TOP_RIGHT_DIAGONAL_DOUBLE_ARROW サイズ変更用の右上から左下への斜めの二重矢印カーソル。
TYPE_VERTICAL_DOUBLE_ARROW サイズ変更用の垂直方向の双方向矢印カーソル。
TYPE_VERTICAL_TEXT 縦書きのテキスト カーソル。横書きの I ビーム。
TYPE_WAIT 待機カーソル（砂時計または回転する円）。
TYPE_ZOOM_IN ズームイン カーソル（プラス記号付きの虫眼鏡）。
TYPE_ZOOM_OUT ズームアウト カーソル（マイナス記号付きの虫眼鏡）。