Donate to e Foundation | Murena handsets with /e/OS | Own a part of Murena! Learn more

Commit e249763d authored by Scott Main's avatar Scott Main
Browse files

small update to Toast guide, flatten sidenav for notifications/toasts, 

new screenshots for notifications

Change-Id: I0c02e9e6db70a60ca299ff7f0caa7c8276b7ab68
parent 01154bda

docs/html/guide/guide_toc.cs

+9 −16
Original line number Original line Diff line number Diff line
@@ -191,28 +191,21 @@ 
      <li><a href="<?cs var:toroot ?>guide/topics/ui/menus.html">

      <li><a href="<?cs var:toroot ?>guide/topics/ui/menus.html">

          <span class="en">Menus</span></span>

          <span class="en">Menus</span></span>

          </a></li>

          </a></li>

      <li><a href="<?cs var:toroot ?>guide/topics/ui/dialogs.html">

           <span class="en">Dialogs</span>

          </a></li>

      <li><a href="<?cs var:toroot ?>guide/topics/ui/actionbar.html">

      <li><a href="<?cs var:toroot ?>guide/topics/ui/actionbar.html">

           <span class="en">Action Bar</span>

           <span class="en">Action Bar</span>

          </a></li>

          </a></li>

      <li><a href="<?cs var:toroot ?>guide/topics/ui/settings.html">

      <li><a href="<?cs var:toroot ?>guide/topics/ui/settings.html">

            <span class="en">Settings</span>

            <span class="en">Settings</span>

          </a></li>

          </a></li>

      <li class="nav-section">

      <li><a href="<?cs var:toroot ?>guide/topics/ui/dialogs.html">

          <div class="nav-section-header"><a href="<?cs var:toroot ?>guide/topics/ui/notifiers/index.html">

           <span class="en">Dialogs</span>

              <span class="en">Notifications</span>

            </a></div>

          <ul>

          <li><a href="<?cs var:toroot ?>guide/topics/ui/notifiers/toasts.html">

              <span class="en">Toast Notifications</span>

          </a></li>

          </a></li>

      <li><a href="<?cs var:toroot ?>guide/topics/ui/notifiers/notifications.html">

      <li><a href="<?cs var:toroot ?>guide/topics/ui/notifiers/notifications.html">

              <span class="en">Status Notifications</span>

          <span class="en">Notifications</span>

        </a></li>

      <li><a href="<?cs var:toroot ?>guide/topics/ui/notifiers/toasts.html">

          <span class="en">Toasts</span>

        </a></li>

        </a></li>

          </ul>

      </li>

      <li class="nav-section">

      <li class="nav-section">

        <div class="nav-section-header"><a href="<?cs var:toroot ?>guide/topics/search/index.html">

        <div class="nav-section-header"><a href="<?cs var:toroot ?>guide/topics/search/index.html">

            <span class="en">Search</span>

            <span class="en">Search</span>

docs/html/guide/topics/ui/notifiers/notifications.jd

+38 −22
Original line number Original line Diff line number Diff line
@@ -5,25 +5,42 @@ page.title=Notifications 
<div id="qv">

<div id="qv">

<h2>In this document</h2>

<h2>In this document</h2>

<ol>

<ol>

        <li>

  <li><a href="#NotificationUI">Notification Display Elements</a>

            <a href="#NotificationUI">Notification Display Elements</a>

    <ol>

        </li>

      <li><a href="#NormalNotify">Normal view</a></li>

        <li>

      <li><a href="#BigNotify">Big view</a></li>

        <a href="#CreateNotification">Creating a Notification</a>

    </ol>

  </li>

  </li>

        <li>

  <li><a href="#CreateNotification">Creating a Notification</a>

            <a href="#Managing">Managing Notifications</a>

    <ol>

      <li><a href="#Required">Required notification contents</a></li>

      <li><a href="#Optional">Optional notification contents and settings</a></li>

      <li><a href="#Actions">Notification actions</a></li>

      <li><a href="#SimpleNotification">Creating a simple notification</a></li>

      <li><a href="#ApplyStyle">Applying a big view style to a notification</a></li>

    </ol>

  </li>

  </li>

        <li>

  <li><a href="#Managing">Managing Notifications</a>

            <a href="#NotificationResponse">Preserving Navigation when Starting an Activity</a>

    <ol>

      <li><a href="#Updating">Updating notifications</a></li>

      <li><a href="#Removing">Removing notifications</a></li>

    </ol>

  </li>

  </li>

        <li>

  <li><a href="#NotificationResponse">Preserving Navigation when Starting an Activity</a>

            <a href="#Progress">Displaying Progress in a Notification</a>

    <ol>

      <li><a href="#DirectEntry">Setting up a regular activity PendingIntent</a></li>

      <li><a href="#ExtendedNotification">Setting up a special activity PendingIntent</a></li>

    </ol>

  </li>

  </li>

        <li>

  <li><a href="#Progress">Displaying Progress in a Notification</a>

            <a href="#CustomNotification">Custom Notification Layouts</a>

    <ol>

      <li><a href="#FixedProgress">Displaying a fixed-duration progress indicator</a></li>

      <li><a href="#ActivityIndicator">Displaying a continuing activity indicator</a></li>

    </ol>

  </li>

  </li>

  <li><a href="#CustomNotification">Custom Notification Layouts</a></li>

</ol>

</ol>



    <h2>Key classes</h2>

    <h2>Key classes</h2>

    <ol>

    <ol>

        <li>{@link android.app.NotificationManager}</li>

        <li>{@link android.app.NotificationManager}</li>
@@ -54,13 +71,12 @@ page.title=Notifications 
<img

<img

    id="figure1"

    id="figure1"

    src="{@docRoot}images/ui/notifications/iconic_notification.png"

    src="{@docRoot}images/ui/notifications/iconic_notification.png"

    height="32"

    height="120" alt="" />

    alt="" />

<p class="img-caption">

<p class="img-caption">

    <strong>Figure 1.</strong> Notifications in the notification area.

    <strong>Figure 1.</strong> Notifications in the notification area.

</p>

</p>

<img id="figure2" src="{@docRoot}images/ui/notifications/normal_notification.png"

<img id="figure2" src="{@docRoot}images/ui/notifications/normal_notification.png"

    height="240" alt="" />

     height="293" alt="" />

<p class="img-caption">

<p class="img-caption">

    <strong>Figure 2.</strong> Notifications in the notification drawer.

    <strong>Figure 2.</strong> Notifications in the notification drawer.

</p>

</p>
@@ -98,7 +114,7 @@ page.title=Notifications 
<img

<img

    src="{@docRoot}images/ui/notifications/normal_notification_callouts.png"

    src="{@docRoot}images/ui/notifications/normal_notification_callouts.png"

    alt=""

    alt=""

    height="204"

    height="153"

    id="figure3" />

    id="figure3" />

<p class="img-caption">

<p class="img-caption">

  <strong>Figure 3.</strong> Notification in normal view.

  <strong>Figure 3.</strong> Notification in normal view.

docs/html/guide/topics/ui/notifiers/toasts.jd

+17 −35
Original line number Original line Diff line number Diff line 
page.title=Toast Notifications

page.title=Toasts

parent.title=Notifications

parent.link=index.html

@jd:body

@jd:body





<div id="qv-wrapper">

<div id="qv-wrapper">

  <div id="qv">    

  <div id="qv">    

    <h2>Quickview</h2>

    <ol>

      <li>A toast is a message that appears on the surface of the screen for a moment, but it

does not take focus (or pause the current activity), so it cannot accept user input</li>

      <li>You can customize the toast layout to include images</li>

    </ol>

    

    <h2>In this document</h2>

    <h2>In this document</h2>

    <ol>

    <ol>

      <li><a href="#Basics">The Basics</a></li>

      <li><a href="#Basics">The Basics</a></li>
@@ -26,22 +17,17 @@ does not take focus (or pause the current activity), so it cannot accept user in 
  </div>

  </div>

</div>

</div>





<p>A toast notification is a message that pops up on the surface of the window.

<p>A toast provides simple feedback about an operation in a small popup.

It only fills the amount of space required for the message and the user's current

It only fills the amount of space required for the message and the current

activity remains visible and interactive. The notification automatically fades in and 

activity remains visible and interactive. 

out, and does not accept interaction events.</p>

For example, navigating away from an email before you send it triggers a 

"Draft saved" toast to let you know that you can continue editing later. 

Toasts automatically disappear after a timeout.</p>





<p>The screenshot below shows an example toast notification from the Alarm application.

Once an alarm is turned on, a toast is displayed to assure you that the 

alarm was set.</p>

<img src="{@docRoot}images/toast.png" alt="" />

<img src="{@docRoot}images/toast.png" alt="" />





<p>A toast can be created and displayed from an {@link android.app.Activity} or 

<p>If user response to a status message is required, consider instead using a 

{@link android.app.Service}. If you create a toast notification from a Service, it

<a href="{@docRoot}guide/topics/ui/notifiers/notifications.html">Notification</a>.</p>

appears in front of the Activity currently in focus.</p>



<p>If user response to the notification is required, consider using a 

<a href="notifications.html">Status Bar Notification</a>.</p>









<h2 id="Basics">The Basics</h2>

<h2 id="Basics">The Basics</h2>
@@ -90,8 +76,6 @@ To nudge it down, increase the value of the last parameter. 




<h2 id="CustomToastView">Creating a Custom Toast View</h2>

<h2 id="CustomToastView">Creating a Custom Toast View</h2>





<img src="{@docRoot}images/custom_toast.png" alt="" style="float:right" />



<p>If a simple text message isn't enough, you can create a customized layout for your

<p>If a simple text message isn't enough, you can create a customized layout for your

toast notification. To create a custom layout, define a View layout,

toast notification. To create a custom layout, define a View layout,

in XML or in your application code, and pass the root {@link android.view.View} object

in XML or in your application code, and pass the root {@link android.view.View} object
@@ -105,17 +89,17 @@ with the following XML (saved as <em>toast_layout.xml</em>):</p> 
              android:orientation="horizontal"

              android:orientation="horizontal"

              android:layout_width="fill_parent"

              android:layout_width="fill_parent"

              android:layout_height="fill_parent"

              android:layout_height="fill_parent"

              android:padding="10dp"

              android:padding="8dp"

              android:background="#DAAA"

              android:background="#DAAA"

              >

              >

    &lt;ImageView android:id="@+id/image"

    &lt;ImageView android:src="@drawable/droid"

               android:layout_width="wrap_content"

               android:layout_width="wrap_content"

               android:layout_height="fill_parent"

               android:layout_height="wrap_content"

               android:layout_marginRight="10dp"

               android:layout_marginRight="8dp"

               />

               />

    &lt;TextView android:id="@+id/text"

    &lt;TextView android:id="@+id/text"

              android:layout_width="wrap_content"

              android:layout_width="wrap_content"

              android:layout_height="fill_parent"

              android:layout_height="wrap_content"

              android:textColor="#FFF"

              android:textColor="#FFF"

              />

              />

&lt;/LinearLayout>

&lt;/LinearLayout>
@@ -126,13 +110,11 @@ ID to inflate the layout from the XML, as shown here:</p> 




<pre>

<pre>

LayoutInflater inflater = getLayoutInflater();

LayoutInflater inflater = getLayoutInflater();

View layout = inflater.inflate(R.layout.toast_layout,

View layout = inflater.inflate(R.layout.custom_toast,

                               (ViewGroup) findViewById(R.id.toast_layout_root));

                               (ViewGroup) findViewById(R.id.toast_layout_root));





ImageView image = (ImageView) layout.findViewById(R.id.image);

image.setImageResource(R.drawable.android);

TextView text = (TextView) layout.findViewById(R.id.text);

TextView text = (TextView) layout.findViewById(R.id.text);

text.setText("Hello! This is a custom toast!");

text.setText("This is a custom toast");





Toast toast = new Toast(getApplicationContext());

Toast toast = new Toast(getApplicationContext());

toast.setGravity(Gravity.CENTER_VERTICAL, 0, 0);

toast.setGravity(Gravity.CENTER_VERTICAL, 0, 0);

docs/html/images/toast.png

+39.9 KiB (46.3 KiB)
Loading image diff...

docs/html/images/ui/notifications/iconic_notification.png

+14.7 KiB (21.3 KiB)
Loading image diff...