インタラクティブなウォッチフェイスの作成

ユーザーは、さまざまな方法でウォッチフェイスを操作することができます。たとえば、ユーザーはウォッチフェイスをタップして、現在再生されている曲や今日の予定を確認することができます。Wear OS by Google を使うと、ウォッチフェイス上のある場所を 1 回タップする操作を受け取ることができます。ただし、その操作に応答する別の UI 要素がある場合を除きます。

このレッスンでは、まずウォッチフェイス スタイルを構築し、操作に対する処理を実装することで、インタラクティブなウォッチフェイスの実装方法について学習します。

注: インタラクティブなウォッチフェイスの開発を始める前に、必ずインタラクティブなウォッチフェイスをご覧ください。

タップイベントの処理

インタラクティブなウォッチフェイス スタイルを構築する場合、アプリはまずシステムに対して、ウォッチフェイスがタップイベントを受け取ることを伝えなければなりません。その方法については、次の例を参考にしてください。

Kotlin

setWatchFaceStyle(WatchFaceStyle.Builder(service)
        .setAcceptsTapEvents(true)
        // other style customizations
        .build())

Java

setWatchFaceStyle(new WatchFaceStyle.Builder(service)
        .setAcceptsTapEvents(true)
        // other style customizations
        .build());

システムがウォッチフェイスのタップを検知すると、WatchFaceService.Engine.onTapCommand() メソッドが呼び出されます。WatchFaceService.Engine の実装でこのメソッドをオーバーライドし、実行したい操作を開始します。たとえば、細かい歩数を表示したり、ウォッチフェイスのテーマを変更したりできます。操作に対する処理のコード スニペットには、そのような実装の例が示されています。

操作に対する処理

一貫性のあるユーザー エクスペリエンスを提供するために、システム UI 要素に対するドラッグや長押しなどの操作は予約されています。そのため、ウォッチフェイスにタッチイベントが直接送られることはありません。ただし、特定のコマンドが onTapCommand() メソッドに転送されます。

ユーザーが画面に触れ始めると、システムから最初のコマンド TAP_TYPE_TOUCH が送られます。このイベントを使って、ユーザーにタッチの視覚的なフィードバックを提供することができます。このイベントがトリガーされた際に、UI を起動してはいけません。UI を起動すると、ドラッグ イベントでアプリ ランチャー、設定シェード、通知ストリームを開く操作が妨害されます。

システムは、次のコマンドを送信する前に、ユーザーによるタッチが 1 回のタップなのかどうかを判断します。ウォッチフェイスで許可されている操作は、1 回のタップのみです。ユーザーがすぐに指を離すと、システムは 1 回のタップが起きたものと判断し、TAP_TYPE_TAP イベントを転送します。ユーザーがすぐに指を離さない場合、システムは TAP_TYPE_TOUCH_CANCEL イベントを転送します。TAP_TYPE_TOUCH_CANCEL イベントが呼ばれると、再度画面に触れない限り、TAP_TYPE_TAP イベントは発生しません。

次の例は、ウォッチフェイスでタップイベントを実装する方法を示しています。

Kotlin

override fun onTapCommand(@TapType tapType: Int, x: Int, y: Int, eventTime: Long) {
    when (tapType) {
        WatchFaceService.TAP_TYPE_TAP -> {
            hideTapHighlight()
            if (withinTapRegion(x, y)) {
                // Implement the tap action
                // (e.g. show detailed step count)
                onWatchFaceTap()
            }
        }

        WatchFaceService.TAP_TYPE_TOUCH ->
            if (withinTapRegion(x, y)) {
                // Provide visual feedback of touch event
                startTapHighlight(x, y, eventTime)
            }

        WatchFaceService.TAP_TYPE_TOUCH_CANCEL -> hideTapHighlight()

        else -> super.onTapCommand(tapType, x, y, eventTime)
    }
}

Java

@Override
public void onTapCommand(
       @TapType int tapType, int x, int y, long eventTime) {
    switch (tapType) {
        case WatchFaceService.TAP_TYPE_TAP:
            hideTapHighlight();
            if (withinTapRegion(x, y)) {
                // Implement the tap action
                // (e.g. show detailed step count)
                onWatchFaceTap();
            }
            break;

        case WatchFaceService.TAP_TYPE_TOUCH:
            if (withinTapRegion(x, y)) {
                // Provide visual feedback of touch event
                startTapHighlight(x, y, eventTime);
            }
            break;

        case WatchFaceService.TAP_TYPE_TOUCH_CANCEL:
            hideTapHighlight();
            break;

        default:
            super.onTapCommand(tapType, x, y, eventTime);
            break;
    }
}

この例のアプリは、発生したイベントの種類を判断し、それに従って応答します。ユーザーの指が最初に触れたことを示すイベントである場合、アプリは視覚的なフィードバックを表示します。指が触れた後、すぐに離れたことを示すイベントである場合、ユーザーがタップした操作を行います。ユーザーが長く指を触れていることを示すイベントである場合、アプリは何もしません。