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

ユーザーはさまざまな方法でウォッチフェイスを操作します。たとえば、ウォッチフェイスをタップして、現在再生中の曲や今日の予定を確認します。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 回のタップが行われたと判断し、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;
        }
    }
    

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