| Roman Nurik | b99ae73 | 2012-03-06 12:26:15 -0800 | [diff] [blame] | 1 | page.title=Notifications |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 2 | page.tags="notifications","design","L" |
| Roman Nurik | b99ae73 | 2012-03-06 12:26:15 -0800 | [diff] [blame] | 3 | @jd:body |
| 4 | |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 5 | <a class="notice-developers" href="{@docRoot}training/notify-user/index.html"> |
| Scott Main | cbcd17d | 2013-05-14 08:46:55 -0700 | [diff] [blame] | 6 | <div> |
| 7 | <h3>Developer Docs</h3> |
| 8 | <p>Notifying the User</p> |
| 9 | </div> |
| 10 | </a> |
| 11 | |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 12 | <a class="notice-designers" href="notifications_k.html"> |
| 13 | <div> |
| 14 | <h3>Notifications in Android 4.4 and Lower</h3> |
| 15 | </div> |
| 16 | </a> |
| Peter Ng | 252d23d | 2012-08-07 20:19:10 -0700 | [diff] [blame] | 17 | |
| Eric Gilmore | fe7b93f | 2014-12-17 15:25:51 -0800 | [diff] [blame] | 18 | <!-- video box --> |
| 19 | <a class="notice-developers-video" href="https://www.youtube.com/watch?v=Uiq2kZ2JHVY"> |
| 20 | <div> |
| 21 | <h3>Video</h3> |
| 22 | <p>DevBytes: Notifications in the Android L Developer Preview</p> |
| 23 | </div> |
| 24 | </a> |
| 25 | |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 26 | <style> |
| 27 | .col-5, .col-6, .col-7 { |
| 28 | margin-left:0px; |
| 29 | } |
| 30 | </style> |
| 31 | |
| 32 | <p>The notification system allows users to keep informed about relevant and |
| 33 | timely |
| 34 | events in your app, such as new chat messages from a friend or a calendar event. |
| 35 | Think of notifications as a news channel that alerts the user to important |
| 36 | events as |
| 37 | they happen or a log that chronicles events while the user is not paying |
| 38 | attention—and one that is synced as appropriate across all their Android devices.</p> |
| 39 | |
| 40 | <h4 id="New"><strong>New in Android 5.0</strong></h4> |
| 41 | |
| 42 | <p>In Android 5.0, notifications receive important updates: structurally, |
| 43 | visually, and functionally:</p> |
| 44 | |
| Peter Ng | 252d23d | 2012-08-07 20:19:10 -0700 | [diff] [blame] | 45 | <ul> |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 46 | <li>Notifications have undergone visual changes consistent with the new |
| 47 | material design theme.</li> |
| 48 | <li> Notifications are now available on the device lock screen, while |
| 49 | sensitive content can still |
| 50 | be hidden behind it.</li> |
| 51 | <li>High-priority notifications received while the device is in use now use a new format called |
| 52 | heads-up notifications.</li> |
| 53 | <li>Cloud-synced notifications: Dismissing a notification on one of your |
| 54 | Android devices dismisses it |
| 55 | on the others, as well.</li> |
| Peter Ng | 252d23d | 2012-08-07 20:19:10 -0700 | [diff] [blame] | 56 | </ul> |
| 57 | |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 58 | <p class="note"><strong>Note:</strong> Notification design in this version of |
| 59 | Android is a significant |
| 60 | departure from that of previous versions. For information about notification design in previous |
| 61 | versions, see <a href="./notifications_k.html">Notifications in Android 4.4 and lower</a>.</p> |
| Peter Ng | 252d23d | 2012-08-07 20:19:10 -0700 | [diff] [blame] | 62 | |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 63 | <h2 id="Anatomy">Anatomy of a Notification</h2> |
| 64 | |
| 65 | <p>This section goes over basic parts of a notification and how they can |
| 66 | appear on different types of devices.</p> |
| 67 | |
| 68 | <h3 id="BaseLayout">Base layout</h3> |
| 69 | |
| 70 | <p>At a minimum, all notifications consist of a base layout, including:</p> |
| 71 | |
| 72 | <ul> |
| 73 | <li> The notification's <strong>icon</strong>. The icon symbolizes the |
| 74 | originating app. It may also |
| 75 | potentially indicate notification type if the app generates more than one |
| 76 | type.</li> |
| 77 | <li> A notification <strong>title</strong> and additional |
| 78 | <strong>text</strong>.</li> |
| 79 | <li> A <strong>timestamp</strong>.</li> |
| 80 | </ul> |
| 81 | |
| 82 | <p>Notifications created with {@link android.app.Notification.Builder Notification.Builder} |
| 83 | for previous platform versions look and work the same in Android |
| 84 | 5.0, with only minor stylistic changes that the system handles |
| 85 | for you. For more information about notifications on previous versions of |
| 86 | Android, see |
| 87 | <a href="./notifications_k.html">Notifications in Android 4.4 and lower</a>.</p></p> |
| 88 | |
| 89 | |
| 90 | <img style="margin:20px 0 0 0" |
| 91 | src="{@docRoot}images/android-5.0/notifications/basic_combo.png" |
| 92 | alt="" width="700px" /> |
| 93 | |
| 94 | |
| 95 | <div style="clear:both;margin-top:20px"> |
| 96 | <p class="img-caption"> |
| 97 | Base layout of a handheld notification (left) and the same notification on Wear (right), |
| 98 | with a user photo and a notification icon |
| 99 | </p> |
| Peter Ng | 252d23d | 2012-08-07 20:19:10 -0700 | [diff] [blame] | 100 | </div> |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 101 | |
| 102 | <h3 id="ExpandedLayouts">Expanded layouts</h3> |
| 103 | |
| 104 | |
| 105 | <p>You can choose how much detail your app's notifications should |
| 106 | provide. They can show the first |
| 107 | few lines of a message or show a larger image preview. The additional |
| 108 | information provides the user with more |
| 109 | context, and—in some cases—may allow the user to read a message in its |
| 110 | entirety. The user can |
| 111 | pinch-zoom or perform a single-finger glide to toggle between compact |
| 112 | and expanded layouts. |
| 113 | For single-event notifications, Android provides three expanded layout |
| 114 | templates (text, inbox, and |
| 115 | image) for you to use in your application. The following images show you how |
| 116 | single-event notifications look on |
| 117 | handhelds (left) and wearables (right).</p> |
| 118 | |
| 119 | <img style="margin-top:30px" |
| 120 | src="{@docRoot}images/android-5.0/notifications/expandedtext_combo.png" |
| 121 | alt="" width="700px" height;="284px" /> |
| 122 | <img style="margin-top:30px" |
| 123 | src="{@docRoot}images/android-5.0/notifications/stack_combo.png" |
| 124 | alt="" width="700px" height;="284px" /> |
| 125 | <img style="margin-top:30px" |
| 126 | src="{@docRoot}images/android-5.0/notifications/ExpandedImage.png" |
| 127 | alt="" width="311px" height;="450px" /> |
| 128 | |
| 129 | <h3 id="actions" style="clear:both; margin-top:40px">Actions</h3> |
| 130 | |
| 131 | <p>Android supports optional actions that are displayed at the bottom |
| 132 | of the notification. |
| 133 | With actions, users can handle the most common tasks for a particular |
| 134 | notification from within the notification shade without having to open the |
| 135 | originating application. |
| 136 | This speeds up interaction and, in conjunction with swipe-to-dismiss, helps users focus on |
| 137 | notifications that matter to them.</p> |
| 138 | |
| 139 | |
| 140 | <img src="{@docRoot}images/android-5.0/notifications/action_combo.png" |
| 141 | alt="" width="700px" /> |
| 142 | |
| 143 | |
| 144 | |
| 145 | <p style="clear:both">Be judicious with how many actions you include with a |
| 146 | notification. The more |
| 147 | actions you include, the more cognitive complexity you create. Limit yourself |
| 148 | to the smallest number |
| 149 | of actions possible by only including the most imminently important and |
| 150 | meaningful actions.</p> |
| 151 | |
| 152 | <p>Good candidates for actions on notifications are actions that:</p> |
| 153 | |
| 154 | <ul> |
| 155 | <li> Are essential, frequent, and typical for the content type you're |
| 156 | displaying |
| 157 | <li> Allow the user to accomplish tasks quickly |
| 158 | </ul> |
| 159 | |
| 160 | <p>Avoid actions that are:</p> |
| 161 | |
| 162 | <ul> |
| 163 | <li> Ambiguous |
| 164 | <li> The same as the default action of the notification (such as "Read" or |
| 165 | "Open") |
| 166 | </ul> |
| 167 | |
| 168 | |
| 169 | |
| 170 | <p>You can specify a maximum of three actions, each consisting of an action |
| 171 | icon and name. |
| 172 | Adding actions to a simple base layout makes the notification expandable, |
| 173 | even if the |
| 174 | notification doesn't have an expanded layout. Since actions are only shown for |
| 175 | expanded |
| 176 | notifications and are otherwise hidden, make sure that any action a |
| 177 | user can invoke from |
| 178 | a notification is available from within the associated application, as |
| 179 | well.</p> |
| 180 | |
| 181 | <h2 style="clear:left">Heads-up Notification</h2> |
| 182 | <div class="figure" style="width:311px"> |
| 183 | <img src="{@docRoot}images/android-5.0/notifications/hun-example.png" |
| 184 | alt="" width="311px" /> |
| 185 | <p class="img-caption"> |
| 186 | Example of a heads-up notification (incoming phone call, high priority) |
| 187 | appearing on top of an |
| 188 | immersive app |
| 189 | </p> |
| Peter Ng | 252d23d | 2012-08-07 20:19:10 -0700 | [diff] [blame] | 190 | </div> |
| 191 | |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 192 | <p>When a high-priority notification arrives (see right), it is presented |
| 193 | to users for a |
| 194 | short period of time with an expanded layout exposing possible actions.</p> |
| 195 | <p> After this period of time, the notification retreats to the notification |
| 196 | shade. If a notification's <a href="#correctly_set_and_manage_notification_priority">priority</a> is |
| 197 | flagged as High, Max, or full-screen, it gets a heads-up notification.</p> |
| Peter Ng | 252d23d | 2012-08-07 20:19:10 -0700 | [diff] [blame] | 198 | |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 199 | <p><b>Good examples of heads-up notifications</b></p> |
| Peter Ng | 252d23d | 2012-08-07 20:19:10 -0700 | [diff] [blame] | 200 | |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 201 | <ul> |
| 202 | <li> Incoming phone call when using a device</li> |
| 203 | <li> Alarm when using a device</li> |
| 204 | <li> New SMS message</li> |
| 205 | <li> Low battery</li> |
| 206 | </ul> |
| Peter Ng | 252d23d | 2012-08-07 20:19:10 -0700 | [diff] [blame] | 207 | |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 208 | <h2 style="clear:both" id="guidelines">Guidelines</h2> |
| Peter Ng | 252d23d | 2012-08-07 20:19:10 -0700 | [diff] [blame] | 209 | |
| Peter Ng | 252d23d | 2012-08-07 20:19:10 -0700 | [diff] [blame] | 210 | |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 211 | <h3 id="MakeItPersonal">Make it personal</h3> |
| Peter Ng | 252d23d | 2012-08-07 20:19:10 -0700 | [diff] [blame] | 212 | |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 213 | <p>For notifications of items sent by another person (such as a message or |
| 214 | status update), include that person's image using |
| 215 | {@link android.app.Notification.Builder#setLargeIcon setLargeIcon()}. Also attach information about |
| 216 | the person to the notification's metadata (see {@link android.app.Notification#EXTRA_PEOPLE}).</p> |
| Peter Ng | 252d23d | 2012-08-07 20:19:10 -0700 | [diff] [blame] | 217 | |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 218 | <p>Your notification's main icon is still shown, so the user can associate |
| 219 | it with the icon |
| 220 | visible in the status bar.</p> |
| 221 | |
| 222 | |
| 223 | <img src="{@docRoot}images/android-5.0/notifications/Triggered.png" |
| 224 | alt="" width="311px"/> |
| 225 | <p style="margin-top:10px" class="img-caption"> |
| 226 | Notification that shows the person who triggered it and the content they sent. |
| 227 | </p> |
| 228 | |
| 229 | |
| 230 | <h3 id="navigate_to_the_right_place">Navigate to the right place</h3> |
| 231 | |
| 232 | <p>When the user touches the body of a notification (outside of the action |
| 233 | buttons), open your app |
| 234 | to the place where the user can view and act upon the data referenced in the |
| 235 | notification. In most cases, this will be the detailed view of a single data item such as a message, |
| 236 | but it might also be a |
| 237 | summary view if the notification is stacked. If your app takes the |
| 238 | user anywhere below your app's top level, insert navigation into your app's back stack so that the |
| 239 | user can press the system back button to return to the top level. For more information, see |
| 240 | <em>Navigation into Your App via Home Screen Widgets and Notifications</em> in the <a |
| 241 | href="{@docRoot}design/patterns/navigation.html#into-your-app">Navigation</a> |
| 242 | design pattern.</p> |
| 243 | |
| 244 | <h3 id="correctly_set_and_manage_notification_priority">Correctly set and |
| 245 | manage notification |
| 246 | priority</h3> |
| 247 | |
| 248 | <p>Android supports a priority flag for notifications. This flag allows you to |
| 249 | influence where your notification appears, relative to other notifications, and |
| 250 | helps ensure |
| 251 | that users always see their most important notifications first. You can choose |
| 252 | from the |
| 253 | following priority levels when posting a notification:</p> |
| Peter Ng | 252d23d | 2012-08-07 20:19:10 -0700 | [diff] [blame] | 254 | <table> |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 255 | <tr> |
| 256 | <td class="tab0"> |
| 257 | <p><strong>Priority</strong></p> |
| 258 | </td> |
| 259 | <td class="tab0"> |
| 260 | <p><strong>Use</strong></p> |
| 261 | </td> |
| 262 | </tr> |
| 263 | <tr> |
| 264 | <td class="tab1"> |
| 265 | <p><code>MAX</code></p> |
| 266 | </td> |
| 267 | <td class="tab1"> |
| 268 | <p>Use for critical and urgent notifications that alert the user to a condition |
| 269 | that is |
| 270 | time-critical or needs to be resolved before they can continue with a |
| 271 | particular task.</p> |
| 272 | </td> |
| 273 | </tr> |
| 274 | <tr> |
| 275 | <td class="tab1"> |
| 276 | <p><code>HIGH</code></p> |
| 277 | </td> |
| 278 | <td class="tab1"> |
| 279 | <p>Use primarily for important communication, such as message or chat |
| 280 | events with content that is particularly interesting for the user. |
| 281 | High-priority notifications trigger the heads-up notification display.</p> |
| 282 | </td> |
| 283 | </tr> |
| 284 | <tr> |
| 285 | <td class="tab1"> |
| 286 | <p><code>DEFAULT</code></p> |
| 287 | </td> |
| 288 | <td class="tab1"> |
| 289 | <p>Use for all notifications that don't fall into any of the other priorities described here.</p> |
| 290 | </td> |
| 291 | </tr> |
| 292 | <tr> |
| 293 | <td class="tab1"> |
| 294 | <p><code>LOW</code></p> |
| 295 | </td> |
| 296 | <td class="tab1"> |
| 297 | <p>Use for notifications that you want the user to be informed about, but |
| 298 | that are less urgent. Low-priority notifications tend to show up at the bottom of the list, |
| 299 | which makes them a good |
| 300 | choice for things like public or undirected social updates: The user has asked to |
| 301 | be notified about |
| 302 | them, but these notifications should never take precedence over urgent or direct |
| 303 | communication.</p> |
| 304 | </td> |
| 305 | </tr> |
| 306 | <tr> |
| 307 | <td class="tab1"> |
| 308 | <p><code>MIN</code></p> |
| 309 | </td> |
| 310 | <td class="tab1"> |
| 311 | <p>Use for contextual or background information such as weather information or contextual |
| 312 | location information. |
| 313 | Minimum-priority notifications do not appear in the status bar. The user |
| 314 | discovers them on expanding the notification shade.</p> |
| 315 | </td> |
| 316 | </tr> |
| Peter Ng | 252d23d | 2012-08-07 20:19:10 -0700 | [diff] [blame] | 317 | </table> |
| 318 | |
| Peter Ng | 252d23d | 2012-08-07 20:19:10 -0700 | [diff] [blame] | 319 | |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 320 | <h4 id="how_to_choose_an_appropriate_priority"><strong>How to choose an |
| 321 | appropriate |
| 322 | priority</strong></h4> |
| Peter Ng | 252d23d | 2012-08-07 20:19:10 -0700 | [diff] [blame] | 323 | |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 324 | <p><code>DEFAULT</code>, <code>HIGH</code>, and <code>MAX</code> are interruptive priority levels, and risk |
| 325 | interrupting the user |
| 326 | in mid-activity. To avoid annoying your app's users, reserve interruptive priority levels for |
| 327 | notifications that:</p> |
| Peter Ng | 252d23d | 2012-08-07 20:19:10 -0700 | [diff] [blame] | 328 | |
| Roman Nurik | b99ae73 | 2012-03-06 12:26:15 -0800 | [diff] [blame] | 329 | <ul> |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 330 | <li> Involve another person</li> |
| 331 | <li> Are time-sensitive</li> |
| 332 | <li> Might immediately change the user's behavior in the real world</li> |
| Roman Nurik | b99ae73 | 2012-03-06 12:26:15 -0800 | [diff] [blame] | 333 | </ul> |
| 334 | |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 335 | <p>Notifications set to <code>LOW</code> and <code>MIN</code> can still be |
| 336 | valuable for the user: Many, if not most, notifications just don't need to command the user's |
| 337 | immediate attention, or vibrate the user's wrist, yet contain information that the user will find |
| 338 | valuable when they choose to |
| 339 | look for notifications. Criteria for <code>LOW</code> and <code>MIN</code> |
| 340 | priority notifications include:</p> |
| 341 | |
| 342 | <ul> |
| 343 | <li> Don't involve other people</li> |
| 344 | <li> Aren't time sensitive</li> |
| 345 | <li> Contain content the user might be interested in but could choose to |
| 346 | browse at their leisure</li> |
| 347 | </ul> |
| 348 | |
| 349 | |
| 350 | <img |
| 351 | src="{@docRoot}images/android-5.0/notifications/notifications_pattern_priority.png" |
| 352 | alt="" width="700"/> |
| 353 | |
| 354 | |
| 355 | <h3 style="clear:both" id="set_a_notification_category">Set a notification |
| 356 | category</h3> |
| 357 | |
| 358 | <p>If your notification falls into one of the predefined categories (see |
| 359 | below), assign it |
| 360 | accordingly. Aspects of the system UI such as the notification shade (or any |
| 361 | other notification |
| 362 | listener) may use this information to make ranking and filtering decisions.</p> |
| 363 | <table> |
| 364 | <tr> |
| 365 | <td> |
| 366 | <p><code><a |
| 367 | href="/reference/android/app/Notification.html#CATEGORY_CALL">CATEGORY_CALL</a></code></p> |
| 368 | </td> |
| 369 | <td> |
| 370 | <p>Incoming call (voice or video) or similar synchronous communication |
| 371 | request</p> |
| 372 | </td> |
| 373 | </tr> |
| 374 | <tr> |
| 375 | <td> |
| 376 | <p><code><a |
| 377 | href="/reference/android/app/Notification.html#CATEGORY_MESSAGE">CATEGORY_MESSAGE</a></code></p> |
| 378 | </td> |
| 379 | <td> |
| 380 | <p>Incoming direct message (SMS, instant message, etc.)</p> |
| 381 | </td> |
| 382 | </tr> |
| 383 | <tr> |
| 384 | <td> |
| 385 | <p><code><a |
| 386 | href="/reference/android/app/Notification.html#CATEGORY_EMAIL">CATEGORY_EMAIL</a></code></p> |
| 387 | </td> |
| 388 | <td> |
| 389 | <p>Asynchronous bulk message (email)</p> |
| 390 | </td> |
| 391 | </tr> |
| 392 | <tr> |
| 393 | <td> |
| 394 | <p><code><a |
| 395 | href="/reference/android/app/Notification.html#CATEGORY_EVENT">CATEGORY_EVENT</a></code></p> |
| 396 | </td> |
| 397 | <td> |
| 398 | <p>Calendar event</p> |
| 399 | </td> |
| 400 | </tr> |
| 401 | <tr> |
| 402 | <td> |
| 403 | <p><code><a |
| 404 | href="/reference/android/app/Notification.html#CATEGORY_PROMO">CATEGORY_PROMO</a></code></p> |
| 405 | </td> |
| 406 | <td> |
| 407 | <p>Promotion or advertisement</p> |
| 408 | </td> |
| 409 | </tr> |
| 410 | <tr> |
| 411 | <td> |
| 412 | <p><code><a |
| 413 | href="/reference/android/app/Notification.html#CATEGORY_ALARM">CATEGORY_ALARM</a></code></p> |
| 414 | </td> |
| 415 | <td> |
| 416 | <p>Alarm or timer</p> |
| 417 | </td> |
| 418 | </tr> |
| 419 | <tr> |
| 420 | <td> |
| 421 | <p><code><a |
| 422 | href="/reference/android/app/Notification.html#CATEGORY_PROGRESS">CATEGORY_PROGRESS</a></code></p> |
| 423 | </td> |
| 424 | <td> |
| 425 | <p>Progress of a long-running background operation</p> |
| 426 | </td> |
| 427 | </tr> |
| 428 | <tr> |
| 429 | <td> |
| 430 | <p><code><a |
| 431 | href="/reference/android/app/Notification.html#CATEGORY_SOCIAL">CATEGORY_SOCIAL</a></code></p> |
| 432 | </td> |
| 433 | <td> |
| 434 | <p>Social network or sharing update</p> |
| 435 | </td> |
| 436 | </tr> |
| 437 | <tr> |
| 438 | <td> |
| 439 | <p><code><a |
| 440 | href="/reference/android/app/Notification.html#CATEGORY_ERROR">CATEGORY_ERROR</a></code></p> |
| 441 | </td> |
| 442 | <td> |
| 443 | <p>Error in background operation or authentication status</p> |
| 444 | </td> |
| 445 | </tr> |
| 446 | <tr> |
| 447 | <td> |
| 448 | <p><code><a |
| 449 | href="/reference/android/app/Notification.html#CATEGORY_TRANSPORT">CATEGORY_TRANSPORT</a></code></p> |
| 450 | </td> |
| 451 | <td> |
| 452 | <p>Media transport control for playback</p> |
| 453 | </td> |
| 454 | </tr> |
| 455 | <tr> |
| 456 | <td> |
| 457 | <p><code><a |
| 458 | href="/reference/android/app/Notification.html#CATEGORY_SYSTEM">CATEGORY_SYSTEM</a></code></p> |
| 459 | </td> |
| 460 | <td> |
| 461 | <p>System or device status update. Reserved for system use.</p> |
| 462 | </td> |
| 463 | </tr> |
| 464 | <tr> |
| 465 | <td> |
| 466 | <p><code><a |
| 467 | href="/reference/android/app/Notification.html#CATEGORY_SERVICE">CATEGORY_SERVICE</a></code></p> |
| 468 | </td> |
| 469 | <td> |
| 470 | <p>Indication of running background service</p> |
| 471 | </td> |
| 472 | </tr> |
| 473 | <tr> |
| 474 | <td> |
| 475 | <p><code><a |
| 476 | href="/reference/android/app/Notification.html#CATEGORY_RECOMMENDATION">CATEGORY_RECOMMENDATION</a></code></p> |
| 477 | </td> |
| 478 | <td> |
| 479 | <p>A specific, timely recommendation for a single thing. For example, a news |
| 480 | app might want to |
| 481 | recommend a news story it believes the user will want to read next.</p> |
| 482 | </td> |
| 483 | </tr> |
| 484 | <tr> |
| 485 | <td> |
| 486 | <p><code><a |
| 487 | href="/reference/android/app/Notification.html#CATEGORY_STATUS">CATEGORY_STATUS</a></code></p> |
| 488 | </td> |
| 489 | <td> |
| 490 | <p>Ongoing information about device or contextual status</p> |
| 491 | </td> |
| 492 | </tr> |
| 493 | </table> |
| 494 | |
| 495 | <h3 id="summarize_your_notifications">Summarize your notifications</h3> |
| 496 | |
| 497 | <p>If a notification of a certain type is already pending when your app tries to send a new |
| 498 | notification of the same type, combine them into a single summary notification for the app. Do not |
| 499 | create a new object.</p> |
| 500 | |
| 501 | <p>A summary notification builds a summary description and allows the user to |
| 502 | understand how many |
| 503 | notifications of a particular kind are pending.</p> |
| 504 | |
| 505 | <div class="col-6"> |
| 506 | |
| 507 | <p><strong>Don't</strong></p> |
| 508 | <img src="{@docRoot}images/android-5.0/notifications/Summarise_Dont.png" |
| 509 | alt="" width="311px" /> |
| Roman Nurik | b99ae73 | 2012-03-06 12:26:15 -0800 | [diff] [blame] | 510 | </div> |
| 511 | |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 512 | <div> |
| 513 | <p><strong>Do</strong></p> |
| Roman Nurik | b99ae73 | 2012-03-06 12:26:15 -0800 | [diff] [blame] | 514 | |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 515 | <img src="{@docRoot}images/android-5.0/notifications/Summarise_Do.png" |
| 516 | alt="" width="311px"/> |
| Roman Nurik | b99ae73 | 2012-03-06 12:26:15 -0800 | [diff] [blame] | 517 | </div> |
| 518 | |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 519 | <p style="clear:left; padding-top:30px; padding-bottom:20px">You can provide |
| 520 | more detail about the individual notifications that make up a |
| 521 | summary by using the expanded digest layout. This approach allows users to gain a |
| 522 | better sense of which |
| 523 | notifications are pending and if they are interesting enough to read in |
| 524 | detail within the |
| 525 | associated app.</p> |
| 526 | <div class="col-6"> |
| 527 | <img src="{@docRoot}images/android-5.0/notifications/Stack.png" |
| 528 | style="margin-bottom:20px" |
| 529 | alt="" width="311px" /> |
| 530 | <p class="img-caption"> |
| 531 | Expanded and contracted notification that is a summary (using <code>InboxStyle</code>) |
| 532 | </p> |
| Roman Nurik | b99ae73 | 2012-03-06 12:26:15 -0800 | [diff] [blame] | 533 | </div> |
| 534 | |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 535 | <h3 style="clear:both" id="make_notifications_optional">Make notifications |
| 536 | optional</h3> |
| 537 | |
| 538 | <p>Users should always be in control of notifications. Allow the user to |
| 539 | disable your app's |
| 540 | notifications or change their alert properties, such as alert sound and whether |
| 541 | to use vibration, |
| 542 | by adding a notification settings item to your application settings.</p> |
| 543 | |
| 544 | <h3 id="use_distinct_icons">Use distinct icons</h3> |
| 545 | <p>By glancing at the notification area, the user should be able to discern |
| 546 | what kinds of |
| 547 | notifications are currently pending.</p> |
| 548 | |
| 549 | <div class="figure"> |
| 550 | <img src="{@docRoot}images/android-5.0/notifications/ProductIcons.png" |
| 551 | alt="" width="420" /> |
| Scott Main | d4cc942 | 2012-10-03 18:47:08 -0700 | [diff] [blame] | 552 | </div> |
| 553 | |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 554 | <div><p><strong>Do</strong></p> |
| 555 | <p>Look at the notification icons Android apps already provide and create |
| 556 | notification icons for |
| 557 | your app that are sufficiently distinct in appearance.</p> |
| 558 | |
| 559 | <p><strong>Do</strong></p> |
| 560 | <p>Use the proper <a |
| 561 | href="/design/style/iconography.html#notification">notification icon style</a> |
| 562 | for small icons, and the Material Light |
| 563 | <a href="/design/style/iconography.html#action-bar">action bar icon |
| 564 | style</a> for your action |
| 565 | icons.</p> |
| 566 | <p ><strong>Do</strong></p> |
| 567 | <p >Keep your icons visually simple, avoiding excessive detail that is hard to |
| 568 | discern.</p> |
| 569 | |
| 570 | <div><p><strong>Don't</strong></p> |
| 571 | <p>Place any additional alpha (dimming or fading) into your |
| 572 | small icons and action |
| 573 | icons; they can have anti-aliased edges, but because Android uses these |
| 574 | icons as masks (that is, only |
| 575 | the alpha channel is used), the image should generally be drawn at full |
| 576 | opacity.</p> |
| 577 | |
| 578 | </div> |
| 579 | <p style="clear:both"><strong>Don't</strong></p> |
| 580 | |
| 581 | <p>Use color to distinguish your app from others. Notification icons should |
| 582 | only be a white-on-transparent background image.</p> |
| 583 | |
| 584 | |
| 585 | <h3 id="pulse_the_notification_led_appropriately">Pulse the notification LED |
| 586 | appropriately</h3> |
| 587 | |
| 588 | <p>Many Android devices contain a notification LED, which is used to keep the |
| 589 | user informed about |
| 590 | events while the screen is off. Notifications with a priority level of <code>MAX</code>, |
| 591 | <code>HIGH</code>, or <code>DEFAULT</code> should |
| 592 | cause the LED to glow, while those with lower priority (<code>LOW</code> and |
| 593 | <code>MIN</code>) should not.</p> |
| 594 | |
| 595 | <p>The user's control over notifications should extend to the LED. When you use |
| 596 | DEFAULT_LIGHTS, the |
| 597 | LED will glow white. Your notifications shouldn't use a different |
| 598 | color unless the |
| 599 | user has explicitly customized it.</p> |
| 600 | |
| 601 | <h2 id="building_notifications_that_users_care_about">Building Notifications |
| 602 | That Users Care About</h2> |
| 603 | |
| 604 | <p>To create an app that users love, it is important to design your |
| 605 | notifications carefully. |
| 606 | Notifications embody your app's voice, and contribute to your app's |
| 607 | personality. Unwanted or |
| 608 | unimportant notifications can annoy the user or make them resent how much |
| 609 | attention the app wants |
| 610 | from them, so use notifications judiciously.</p> |
| 611 | |
| 612 | <h3 id="when_to_display_a_notification">When to display a notification</h3> |
| 613 | |
| 614 | <p>To create an application that people enjoy using, it's important to |
| 615 | recognize that the user's |
| 616 | attention and focus is a resource that must be protected. While Android's |
| 617 | notification system has |
| 618 | been designed to minimize the impact of notifications on the user's attention, |
| 619 | it is |
| 620 | still important to be aware of the fact that notifications are interrupting the |
| 621 | user's task flow. |
| 622 | As you plan your notifications, ask yourself if they are important enough to |
| 623 | warrant an interruption. If you are unsure, allow the user to opt into a |
| 624 | notification using your apps notification settings, or adjust |
| 625 | the notifications priority flag to <code>LOW</code> or <code>MIN</code> to |
| 626 | avoid distracting the user while they are doing |
| 627 | something else.</p> |
| 628 | |
| 629 | <img src="{@docRoot}images/android-5.0/notifications/TimeSensitive.png" |
| 630 | alt="" width="311px" /> |
| 631 | <p style="margin-top:10px" class="img-caption"> |
| 632 | Examples of time-sensitive notification |
| 633 | </p> |
| 634 | |
| 635 | <p>While well-behaved apps generally only speak when spoken to, a few cases |
| 636 | do merit an app's interrupting the user with an unprompted notification.</p> |
| 637 | |
| 638 | <p>Use notifications primarily for <strong>time-sensitive events</strong>, especially |
| 639 | if these synchronous events <strong>involve other people</strong>. For |
| 640 | instance, an incoming chat |
| 641 | is a real-time and synchronous form of communication: Another user |
| 642 | actively waiting on your response. Calendar events are another good example of when to use a |
| 643 | notification and grab the |
| 644 | user's attention, because the event is imminent, and calendar events often |
| 645 | involve other people.</p> |
| 646 | |
| 647 | <h3 style="clear:both" id="when_not_to_display_a_notification">When not to |
| 648 | display a notification</h3> |
| 649 | |
| 650 | <div class="figure" style="margin-top:60px"> |
| 651 | <img src="{@docRoot}images/android-5.0/notifications/AntiSample1.png" |
| 652 | alt="" width="311px" /> |
| 653 | </div> |
| 654 | |
| 655 | <p>In many other cases, notifications aren't appropriate:</p> |
| 656 | |
| 657 | <ul> |
| 658 | <li> Avoid notifying the user of information that is not directed |
| 659 | specifically at them, or |
| 660 | information that is not truly time-sensitive. For instance, the asynchronous |
| 661 | and undirected updates |
| 662 | flowing through a social network generally do not warrant a real-time |
| 663 | interruption. For the users |
| 664 | who do care about them, allow them to opt-in.</li> |
| 665 | <li> Don't create a notification if the relevant new information is currently |
| 666 | on screen. Instead, |
| 667 | use the UI of the application itself to notify the user of new information |
| 668 | directly in context. |
| 669 | For instance, a chat application should not create system notifications while |
| 670 | the user is actively chatting with another user.</li> |
| 671 | <li> Don't interrupt the user for low-level technical operations, like saving |
| 672 | or syncing information, or updating an application if the app or system can resolve the issue |
| 673 | without involving the user.</li> |
| 674 | <li> Don't interrupt the user to inform them of an error if it is possible |
| 675 | for the application to recover from the error on its own without the user |
| 676 | taking any action.</li> |
| 677 | <li> Don't create notifications that have no true notification content and |
| 678 | merely advertise your |
| 679 | app. A notification should provide useful, timely, new information and should |
| 680 | not be used |
| 681 | merely to launch an app.</li> |
| 682 | <li> Don't create superfluous notifications just to get your brand in front |
| 683 | of users. |
| 684 | Such notifications frustrate and likely alienate your audience. The |
| 685 | best way to provide |
| 686 | small amounts of updated information and keep them engaged |
| 687 | with your |
| 688 | app is to develop a widget that they can choose to place on their |
| 689 | home screen.</li> |
| 690 | </ul> |
| 691 | |
| 692 | <h2 style="clear:left" id="interacting_with_notifications">Interacting with |
| 693 | Notifications</h2> |
| 694 | |
| 695 | <p>Notifications are indicated by icons in the status bar, and can be accessed |
| 696 | by opening the |
| 697 | notification drawer.</p> |
| 698 | |
| 699 | <p>Touching a notification opens the associated app to detailed content |
| 700 | that matches the notification. |
| 701 | Swiping left or right on a notification removes it from the drawer.</p> |
| 702 | |
| 703 | <h3 id="ongoing_notifications">Ongoing notifications</h3> |
| 704 | <div class="figure" style="width:311px"> |
| 705 | <img src="{@docRoot}images/android-5.0/notifications/MusicPlayback.png" |
| 706 | alt="" width="311px" /> |
| 707 | <p class="img-caption"> |
| 708 | Ongoing notification due to music playback |
| 709 | </p> |
| 710 | </div> |
| 711 | <p>Ongoing notifications keep users informed about an ongoing process in the |
| 712 | background. |
| 713 | For example, music players announce the currently playing track in the |
| 714 | notification system and |
| 715 | continue to do so until the user stops the playback. Ongoing notifications can also |
| 716 | show the user |
| 717 | feedback for longer tasks like downloading a file, or encoding a video. A user cannot manually |
| 718 | remove an ongoing notification from the notification drawer.</p> |
| 719 | |
| 720 | <h3 id="ongoing_notifications">Media playback</h3> |
| 721 | <p>In Android 5.0, the lock screen doesn't show transport controls for the deprecated |
| 722 | {@link android.media.RemoteControlClient} class. But it <em>does</em> show notifications, so each |
| 723 | app's playback notification is now the primary |
| 724 | way for users to control playback from a locked state. This behavior gives apps more |
| 725 | control over which |
| 726 | buttons to show, and in what way, while providing a consistent experience for |
| 727 | the user whether or not the screen is locked.</p> |
| 728 | |
| 729 | <h3 style="clear:both" |
| 730 | id="dialogs_and_toasts_are_for_feedback_not_notification">Dialogs |
| 731 | and toasts</h3> |
| 732 | |
| 733 | <p>Your app should not create a dialog or toast if it is not currently on |
| 734 | screen. A dialog or toast |
| 735 | should only be displayed as an immediate response to the user taking an action |
| 736 | inside of your app. |
| 737 | For further guidance on the use of dialogs and toasts, refer to |
| 738 | <a href="/design/patterns/confirming-acknowledging.html">Confirming & Acknowledging</a>.</p> |
| 739 | |
| 740 | <h3>Ranking and ordering</h3> |
| 741 | |
| 742 | <p>Notifications are news, and so are essentially shown in |
| 743 | reverse-chronological order, with |
| 744 | special consideration given to the app's stated notification |
| 745 | <a href="#correctly_set_and_manage_notification_priority">priority</a>.</p> |
| 746 | |
| 747 | <p>Notifications are a key part of the lock screen, and are featured prominently |
| 748 | every |
| 749 | time the device display comes on. Space on the lock screen is tight, so it |
| 750 | is more important |
| 751 | than ever to identify the most urgent or relevant notifications. For this |
| 752 | reason, Android has a |
| 753 | more sophisticated sorting algorithm for notifications, taking into account:</p> |
| 754 | |
| 755 | <ul> |
| 756 | <li> The timestamp and application's stated priority.</li> |
| 757 | <li> Whether the notification has recently disturbed the user with sound or |
| 758 | vibration. (That is, |
| 759 | if the phone just made a noise, and the user wants to know "What just |
| 760 | happened?", the lock screen |
| 761 | should answer that at a glance.)</li> |
| 762 | <li> Any people attached to the notification using {@link android.app.Notification#EXTRA_PEOPLE}, |
| 763 | and, in particular, whether they are starred contacts.</li> |
| 764 | </ul> |
| 765 | |
| 766 | <p>To best take advantage of this sorting, focus on the user |
| 767 | experience you want |
| 768 | to create, rather than aiming for any particular spot on the list.</p> |
| 769 | |
| 770 | <img src="{@docRoot}images/android-5.0/notifications/AntiSample3.png" |
| 771 | alt="" width="700px" /> |
| 772 | |
| 773 | <p class="img-caption" style="margin-top:10px">Gmail notifications are |
| 774 | default priority, so they |
| 775 | normally sort below messages from an instant messaging app like Hangouts, but |
| 776 | get a |
| 777 | temporary bump when new messages come in. |
| 778 | </p> |
| 779 | |
| 780 | |
| 781 | <h3>On the lock screen</h3> |
| 782 | |
| 783 | <p>Because notifications are visible on the lock screen, user privacy is an |
| 784 | especially |
| 785 | important consideration. Notifications often contain sensitive information, and |
| 786 | should not necessarily be visible |
| 787 | to anyone who picks up the device and turns on the display.</p> |
| 788 | |
| 789 | <ul> |
| 790 | <li> For devices that have a secure lock screen (PIN, pattern, or password), the interface has |
| 791 | public and private parts. The public interface can be displayed on a secure lock screen and |
| 792 | therefore seen by anyone. The private interface is the world behind that lock screen, and |
| 793 | is only revealed once the user has signed into the device.</li> |
| 794 | </ul> |
| 795 | |
| 796 | <h3>User control over information displayed on the secure lock screen</h3> |
| 797 | <div class="figure" style="width:311px"> |
| David Friedman | 576a4b7 | 2014-10-27 17:16:44 -0700 | [diff] [blame] | 798 | <img src="{@docRoot}images/android-5.0/notifications/LockScreen@2x.png" |
| 799 | srcset="{@docRoot}images/android-5.0/notifications/LockScreen.png 1x" alt="" width="311px"/> |
| David Friedman | 0df77e9 | 2014-10-02 15:23:45 -0700 | [diff] [blame] | 800 | <p class="img-caption"> |
| 801 | Notifications on the lock screen, with contents revealed after the user unlocks the device. |
| 802 | </p> |
| 803 | </div> |
| 804 | |
| 805 | <p>When setting up a secure lock screen, the user can choose to conceal |
| 806 | sensitive details from the secure lock screen. In this case the System UI |
| 807 | considers the notification's <em>visibility level</em> to figure out what can |
| 808 | safely be shown.</p> |
| 809 | <p> To control the visibility level, call |
| 810 | <code><a |
| 811 | href="/reference/android/app/Notification.Builder.html#setVisibility(int)">Notification.Builder.setVisibility()</a></code>, |
| 812 | and specify one of these values:</p> |
| 813 | |
| 814 | <ul> |
| 815 | <li><code><a |
| 816 | href="/reference/android/app/Notification.html#VISIBILITY_PUBLIC">VISIBILITY_PUBLIC</a></code>. |
| 817 | Shows the notification's full content. |
| 818 | This is the system default if visibility is left unspecified.</li> |
| 819 | <li><code><a |
| 820 | href="/reference/android/app/Notification.html#VISIBILITY_PRIVATE">VISIBILITY_PRIVATE</a></code>. |
| 821 | On the lock screen, shows basic information about the existence of this notification, including its |
| 822 | icon and the name of the app that posted it. The rest of the notification's details are not displayed. |
| 823 | A couple of good points to keep in mind are as follows: |
| 824 | <ul> |
| 825 | <li> If you want to provide a different public version of your notification |
| 826 | for the system to display on a secure lock screen, supply a replacement |
| 827 | Notification object in the <code><a |
| 828 | href="/reference/android/app/Notification.html#publicVersion">Notification.publicVersion</a></code> |
| 829 | field. |
| 830 | <li> This setting gives your app an opportunity to create a redacted version of the |
| 831 | content that is still useful but does not reveal personal information. Consider the example of an |
| 832 | SMS app whose notifications include the text of the SMS and the sender's name and contact icon. |
| 833 | This notification should be <code>VISIBILITY_PRIVATE</code>, but <code>publicVersion</code> could still |
| 834 | contain useful information like "3 new messages" without any other identifying |
| 835 | details. |
| 836 | </ul> |
| 837 | </li> |
| 838 | <li><code><a |
| 839 | href="/reference/android/app/Notification.html#VISIBILITY_SECRET">Notification.VISIBILITY_SECRET</A></code>. Shows only the most minimal information, excluding |
| 840 | even the notification's icon.</li> |
| 841 | </ul> |
| 842 | <h2 style="clear:both" id="notifications_on_android_wear">Notifications on |
| 843 | Android Wear</h2> |
| 844 | |
| 845 | <p>Notifications and their <em>actions</em> are bridged over to Wear devices by default. |
| 846 | Developers can control which notifications bridge from the |
| 847 | phone to the watch, |
| 848 | and vice-versa. Developers can also control which actions bridge, as well. If |
| 849 | your app includes |
| 850 | actions that can't be accomplished with a single tap, either hide these actions |
| 851 | on your Wear |
| 852 | notification or consider hooking them up to a Wear app, thus allowing the user to |
| 853 | finish the action on |
| 854 | their watch.</p> |
| 855 | |
| 856 | <h4>Bridging notifications and actions</h4> |
| 857 | |
| 858 | <p>A connected device, such as a phone, can bridge notifications to a Wear device, so that the |
| 859 | notifications are displayed there. Similarly, it can bridge actions, so that the user can act |
| 860 | on the notifications right from the Wear device.</p> |
| 861 | |
| 862 | <p><strong>Bridge</strong></p> |
| 863 | |
| 864 | <ul> |
| 865 | <li> New instant messages</li> |
| 866 | <li> Single-tap actions such as +1, Like, Heart</li> |
| 867 | </ul> |
| 868 | |
| 869 | <img src="{@docRoot}images/android-5.0/notifications/WearBasic.png" width="156px" |
| 870 | height="156px" |
| 871 | alt="" /> |
| 872 | |
| 873 | <p><strong>Don't bridge</strong></p> |
| 874 | |
| 875 | <ul> |
| 876 | <li> Notifications of newly arrived podcasts</li> |
| 877 | <li> Actions that map to features that aren't possible on the watch</li> |
| 878 | </ul> |
| 879 | |
| 880 | |
| 881 | |
| 882 | <p><h4>Unique actions to define for Wear</h4></p> |
| 883 | |
| 884 | <p>There are some actions that you can perform only on Wear. These include the following:</p> |
| 885 | |
| 886 | <ul> |
| 887 | <li> Quick lists of canned responses such as "Be right back"</li> |
| 888 | <li> Open on the phone</li> |
| 889 | <li> A "Comment" or "Reply" action that brings up the speech input screen</li> |
| 890 | <li> Actions that launch Wear-specific apps</li> |
| 891 | </ul> |
| 892 | |
| 893 | <img src="{@docRoot}images/android-5.0/notifications/ReplyAction.png" width="156px" |
| 894 | height="156px" |
| 895 | alt="" /> |