コンテンツに移動

よくアクセスするページ

最近アクセスしたページ

navigation

Creating Interactive Watch Faces

This lesson teaches you how to

  1. Handle tap events
  2. Handle gestures

A user can interact with your watch face in many ways. For example, a user might tap the watch face to learn what song is currently playing, or to see the day's agenda. Wear OS by Google allows watch faces to accept the single-tap gesture at a given location on the watch face, as long as there's not another UI element that also responds to that gesture.

This lesson teaches you how to implement an interactive watch face by first constructing the watch face style, and then implementing gesture handling.

Note: Before beginning development work on your interactive watch face, you should be sure to read about Interactive Watch Faces.

Handle tap events

When constructing an interactive watch-face style, the first thing the app must do is tell the system that the watch face receives tap events. The following example shows how to do this:

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

When the system detects a tap on the watch face, it triggers the WatchFaceService.Engine.onTapCommand() method. Override this method in your implementation of WatchFaceService.Engineto initiate the action you wish to perform, such as showing a detailed step count or changing the theme of the watch face. The code snippet in Handle Gestures shows an example of such an implementation.

Handle gestures

To provide a consistent user experience, the system reserves gestures such as drag and long-press for system UI elements. Therefore, the system does not send raw touch events to the watch face. Instead, the system forwards specific commands to the onTapCommand() method.

The system sends the first command, TAP_TYPE_TOUCH, when the user initially touches the screen. This event lets you provide visual feedback to the user on touch. Your app should not launch a UI when this event triggers. Launching a UI prevents drag events from opening the app launcher, settings shade, and notifications stream.

Before sending the next command, the system judges whether the contact is a single tap, which is the only gesture allowed. If the user immediately lifts their finger, the system determines that a single tap took place, and forwards a TAP_TYPE_TAP event. If the user does not immediately lift their finger, the system forwards a TAP_TYPE_TOUCH_CANCEL event. Once the user has triggered a TAP_TYPE_TOUCH_CANCEL event, they cannot trigger a TAP_TYPE_TAP event until they make a new contact with the screen.

The following example shows you how to implement tap events on a watch face:

@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;
    }
}

In this example, the app determines what kind of event has taken place, and responds accordingly. If the event is initial contact by the user's finger, the app displays visual feedback. If the event is an immediate lifting of the finger after contact, it performs the action on which the user tapped. If the event is prolonged contact by the finger, the app does nothing.

このサイトでは、ユーザーが選択したサイトの言語と表示設定を保存する目的で Cookie を使用しています。

Android デベロッパー向けの最新情報やヒントを入手して、Google Play での成功を手に入れましょう。

* 必須

送信しました

WeChat で Google Developers をフォローする

このサイトをで表示しますか?

ページの表示言語としてを選択しましたが、このサイトの言語はに設定されています。

言語設定を変更してこのサイトをで表示しますか?言語設定を変更する場合は、各ページの下にある言語メニューを使用してください。

このクラスには、API レベル 以上が必要です。

API レベル が選択されているため、このドキュメントは非表示になっています。左のナビゲーションの上にあるセレクタを使って、ドキュメントの API レベルを変更できます。

アプリに必要な API レベルを指定する方法について、詳しくは異なるプラットフォーム バージョンのサポートをご覧ください。

Take a short survey?
Help us improve the Android developer experience. (April 2018 — Developer Survey)