page.title=Notification Changes in Android Wear 2.0
meta.tags="wear", "wear-preview", "notifications"
page.tags="wear"
page.image=/wear/preview/images/expanded_diagram.png
@jd:body
<div id="qv-wrapper">
<div id="qv">
<!-- table of contents -->
<h2>This document includes</h2>
<ol>
<li><a href="#visual">Visual Updates</a></li>
<li><a href="#expanded">Expanded Notifications</a></li>
<li><a href="#messaging">MessagingStyle</a></li>
</ol>
</div>
</div>
<p>Android Wear 2.0 updates the visual style and interaction paradigm of notifications
as well as introduces expanded notifications, which provide substantial additional
content and actions in an app-like experience.
</p>
<p>The visual and interaction changes make it much easier for users to read and
interact with notifications from your app. Expanded notifications enable
you to deliver Wear users an app-like experience even if you haven't built an
Android Wear app.
</p>
<p class="note">
<strong>Note:</strong> When developing for Wear 2.0, ensure that
you have the latest version of the Android Wear app on your phone.
</p>
<h2 id="visual">Visual Updates</h2>
<p>Notifications receive important visual updates in Wear 2.0, with
<a href="http://www.google.com/design/spec-wear">
material design</a> visual changes.
</p>
<p><img src="{@docRoot}wear/preview/images/comparison_diagram.png" /> </p>
<p><b>Figure 1.</b> Comparison of the same notification in Android Wear 1.x and 2.0.</p>
<p>Some of the visual updates include:</p>
<ul>
<li><strong>Updated touch targets of a notification</strong>:
If no <a href="{@docRoot}reference/android/app/Notification.html#contentIntent">{@code contentIntent}</a>
is set or if the notification is
<a href="{@docRoot}design/wear/structure.html#Bridged">bridged</a>
from a paired phone, then tapping the notification opens an <a href="{@docRoot}wear/preview/features/notifications.html#expanded">expanded notification</a>.
If the notification is generated locally by a Wear app and if a
<a href="{@docRoot}reference/android/app/Notification.html#contentIntent">{@code contentIntent}</a>
is set, tapping the notification fires the
<a href="{@docRoot}reference/android/app/Notification.html#contentIntent">{@code contentIntent}</a>.
</li>
<li><strong>Dark background color</strong>:
If you have notifications that are bridged to wearables, you need to be careful
with regards to using color for the notifications. Since a bridged
notification needs to support both light (Wear 1.x) and dark (Wear 2.0)
backgrounds, it is unlikely that any colors will work well on both.
<a href="{@docRoot}reference/android/app/Notification.WearableExtender.html#setDisplayIntent(android.app.PendingIntent)">{@code DisplayIntent}</a>
notifications render with both light and dark backgrounds
as well, and need to be checked for the same reason.
We recommended that you don't set color for bridged notifications.
When Wear apps post local notifications, you can work around this by checking
<a href="{@docRoot}training/basics/supporting-devices/platforms.html#version-codes">the API level of the device</a> they're running on and using an appropriate color
for Wear 1.x and a different color for Wear 2.0.
</li>
<li><strong>Updated horizontal swipe gesture on a notification</strong>:
To dismiss a notification in Wear 2.0, the user swipes horizontally in either
direction. So if your notification instructs the user to swipe left or right,
you must update the text of your notification.
</li>
</ul>
<h2 id="expanded">Expanded Notifications</h2>
<p>Android Wear 2.0 introduces <i>expanded notifications</i>, which provide
substantial additional content and actions for each notification.
</p>
<p>When you <a href="{@docRoot}training/wearables/notifications/pages.html">specify additional content pages</a>
and actions for a notification, those are available to the user within the
expanded notification. Each expanded notification follows
<a href="http://www.google.com/design/spec-wear">Material Design for Android Wear</a>,
so the user gets an app-like experience.
</p>
<h3 id="expanded">Expanded notifications</h3>
<p>If the first action in the expanded notification has a
<a href=" {@docRoot}reference/android/support/v4/app/RemoteInput.html">{@code RemoteInput}</a>
(e.g., a Reply action), then the choices you set with <a href="http://developer.android.com/reference/android/support/v4/app/RemoteInput.Builder.html#setChoices(java.lang.CharSequence[])">{@code setChoices()}</a>
appear within the expanded notification below the first action.
</p>
<p>The user can view the expanded notification by tapping on a notification when
either of the following is true:
</p>
<ul>
<li>The notification is generated by an app on the paired phone and
bridged to Wear.
</li>
<li>The notification does not have a
<a href="http://developer.android.com/reference/android/support/v4/app/NotificationCompat.Builder.html#setContentIntent(android.app.PendingIntent)">{@code contentIntent}</a>.
</li>
</ul>
<h3>Best practices for expanded notifications</h3>
<p>To decide when to use expanded notifications, follow these guidelines:</p>
<ul>
<li>All notifications bridged from the paired phone to the Wear device will
use expanded notifications.
</li>
<li>If a notification is generated by an app running locally on Wear 2.0,
you should <a href="{@docRoot}training/notify-user/build-notification.html#action">
make the touch target of your notification </a> launch
<a href="{@docRoot}training/notify-user/build-notification.html#action"> an Activity</a>
within your app by calling <a href="{@docRoot}reference/android/support/v4/app/NotificationCompat.Builder.html#setContentIntent(android.app.PendingIntent)">{@code setContentIntent()}</a>.
We recommend that you do not use expanded notifications for notifications generated
by an app running locally on Wear 2.0.
</li>
</ul>
<h3>Adding expanded notifications</h3>
<p>
Expanded Notifications allow you to include additional content and actions
for a notification. You choose the level of detail that your app's notifications
will provide; however be judicious with the amount of detail you include in a
notification.
</p>
<img src="{@docRoot}wear/preview/images/expanded_diagram.png" height="340"
style="float:left;margin:10px 20px 0 0" />
<h4>Adding additional content</h4>
To show additional content in your expanded notification, see <a href="{@docRoot}training/wearables/notifications/pages.html">Adding Pages to a Notification</a>.</p>
<p>Additional content pages are stacked vertically in the expanded notification
and appear in the order they were added.
These additional content pages can optionally use a style such as <a href="{@docRoot}reference/android/support/v4/app/NotificationCompat.BigTextStyle.html">{@code BigTextStyle}</a> or <a href="{@docRoot}reference/android/support/v4/app/NotificationCompat.BigPictureStyle.html">{@code BigPictureStyle}</a>.
</p>
<h4>Primary action</h4>
The expanded notification will contain one primary action, which is the first
action in the notification unless a different action is specified using
<a href="{@docRoot}reference/android/support/v4/app/NotificationCompat.WearableExtender.html#setContentAction(int)">{@code setContentAction()}</a>.
</p>
<h4>Additional actions</h4>
<p>
To specify additional actions, use
<a href="{@docRoot}reference/android/support/v4/app/NotificationCompat.WearableExtender.html#addAction(android.support.v4.app.NotificationCompat.Action)">{@code addAction()}</a>
or <a href="{@docRoot}reference/android/support/v4/app/NotificationCompat.WearableExtender.html#addActions(java.util.List<android.support.v4.app.NotificationCompat.Action>)">{@code addActions()}</a>.
The action drawer of the expanded notification contains all available actions.
</p>
<h2 id="messaging">MessagingStyle</h2>
<p>If you have a chat messaging app, your notifications should use
<a href="{@docRoot}preview/features/notification-updates.html#style">{@code Notification.MessagingStyle}</a>,
which is new in Android N. Wear 2.0 uses the chat messages included
in a <a href="{@docRoot}preview/features/notification-updates.html#style">{@code MessagingStyle}</a> notification
(see <a href="{@docRoot}preview/features/notification-updates.html#style">{@code addMessage()}</a>) to provide
a rich chat app-like experience in the expanded notification.
</p>
<p class="note">Note: <a href="{@docRoot}preview/features/notification-updates.html#style">{@code MessagingStyle}</a>
expanded notifications require that you have at least version 1.5.0.2861804 of the
<a href="https://play.google.com/store/apps/details?id=com.google.android.wearable.app">Android Wear app</a>
on your paired Android phone. That version will be available within the next
few weeks in the Play Store.
</p>
<h3 id="smart-reply">Smart Reply</h3>
<img src="{@docRoot}wear/preview/images/messaging_style.png" height="420"
style="float:right;margin:10px 20px 0 0" />
<p>Wear 2.0 also introduces <i>Smart Reply</i>
for <a href="{@docRoot}preview/features/notification-updates.html#style">{@code MessagingStyle}</a> notifications.
Smart Reply provides the user with contextually relevant, touchable choices in
the expanded notification and in {@code RemoteInput}. These augment the fixed
list of choices that the developer provides in
<a href="http://developer.android.com/reference/android/support/v4/app/RemoteInput.html">{@code RemoteInput}</a>
using the
<a href="{@docRoot}reference/android/support/v4/app/RemoteInput.Builder.html#setChoices(java.lang.CharSequence[])">{@code setChoices()}</a> method.
</p>
<p>By enabling Smart Reply for your MessagingStyle notifications,
you provide users with a fast (single tap), discreet (no speaking aloud), and
reliable way to respond to chat messages.
</p>
<p>Responses generated by Smart Reply are shown in addition to those set using the
<a href="{@docRoot}reference/android/support/v4/app/RemoteInput.Builder.html#setChoices(java.lang.CharSequence[])">{@code setChoices()}</a> method.
</p>
<p>To enable Smart Reply for your notification action, you need to do the
following:
</p>
<ol>
<li>Use <a href="{@docRoot}preview/features/notification-updates.html#style">{@code Notification.MessagingStyle}</a>.
</li>
<li>Call the method {@code setAllowGeneratedReplies()} for the notification action.
For more information, see the downloadable
<a href="{@docRoot}preview/setup-sdk.html#docs-dl">API reference</a>.
</li>
<li>Ensure that the notification action has a
<a href="{@docRoot}reference/android/app/RemoteInput.html">{@code RemoteInput}</a>
(where the responses will reside).
</li>
</ol>
<p>The following example shows how to create a MessagingStyle notification with
Smart Reply responses.</p>
<pre>
// Create an intent for the reply action
Intent replyIntent = new Intent(this, ReplyActivity.class);
PendingIntent replyPendingIntent =
PendingIntent.getActivity(this, 0, replyIntent,
PendingIntent.FLAG_UPDATE_CURRENT);
// Create the reply action and add the remote input
NotificationCompat.Action action =
new NotificationCompat.Action.Builder(R.drawable.ic_reply_icon,
getString(R.string.label), replyPendingIntent)
.addRemoteInput(remoteInput)
// 1) allow generated replies
.setAllowGeneratedReplies(true)
.build();
Notification noti = new NotificationCompat.Builder()
.setContentTitle(messages.length + " new messages with " + sender.toString())
.setContentText(subject)
.setSmallIcon(R.drawable.new_message)
.setLargeIcon(aBitmap)
// 2) set the style to MessagingStyle
.setStyle(new NotificationCompat.MessagingStyle(resources.getString(R.string.reply_name))
.addMessage(messages[0].getText(), messages[0].getTime(), messages[0].getSender())
.addMessage(messages[1].getText(), messages[1].getTime(), messages[1].getSender()))
// 3) add an action with RemoteInput
.extend(new WearableExtender().addAction(action)).build();
</pre>