14
Chapter 16 Action Bar and Notifications By Dr. Ramkumar Lakshminarayanan Introduction The action bar is a window feature that identifies the application and user location, and provides user actions and navigation modes. A notification is a message you can display to the user outside of your application's normal UI. When you tell the system to issue a notification, it first appears as an icon in the notification area. In this unit we will discuss about the action bar and notification usage in Android. Action Bar Action bar is used in most activities that need to prominently present user actions or global navigation, because the action bar offers users a consistent interface across applications and the system gracefully adapts the action bar's appearance for different screen configurations. You can control the behaviors and visibility of the action bar with the ActionBar APIs, which were added in Android 3.0 (API level 11). The primary goals of the action bar are to: Provide a dedicated space for identifying the application brand and user location. This is accomplished with the app icon or logo on the left side and the activity title. You might choose to remove the activity title, however, if the current view is identified by a navigation label, such as the currently selected tab. Provide consistent navigation and view refinement across different applications.

Android action bar and notifications-chapter16

Embed Size (px)

DESCRIPTION

The action bar is a window feature that identifies the application and user location, and provides user actions and navigation modes. A notification is a message you can display to the user outside of your application's normal UI. When you tell the system to issue a notification, it first appears as an icon in the notification area. In this unit we will discuss about the action bar and notification usage in Android.

Citation preview

Page 1: Android action bar and notifications-chapter16

Chapter 16

Action Bar and Notifications

By

Dr. Ramkumar Lakshminarayanan

Introduction

The action bar is a window feature that identifies the application and user location, and provides user actions and navigation modes. A notification is a message you can display to the user outside of your application's normal UI. When you tell the system to issue a notification, it first appears as an icon in the notification area. In this unit we will discuss about the action bar and notification usage in Android.

Action Bar

Action bar is used in most activities that need to prominently present user actions or global navigation, because the action bar offers users a consistent interface across applications and the system gracefully adapts the action bar's appearance for different screen configurations. You can control the behaviors and visibility of the action bar with the ActionBar APIs, which were added in Android 3.0 (API level 11).

The primary goals of the action bar are to:

Provide a dedicated space for identifying the application brand and user location.

This is accomplished with the app icon or logo on the left side and the activity title. You might choose to remove the activity title, however, if the current view is identified by a navigation label, such as the currently selected tab.

Provide consistent navigation and view refinement across different applications.

The action bar provides built-in tab navigation for switching between fragments. It also offers a drop-down list you can use as an alternative navigation mode or to refine the current view (such as to sort a list by different criteria).

Make key actions for the activity (such as "search", "create", "share", etc.) prominent and accessible to the user in a predictable way.

You can provide instant access to key user actions by placing items from the options menu directly in the action bar, as "action items." Action items can also provide an "action view," which provides an embedded widget for even more immediate action behaviors. Menu items that are not promoted to an action item are available in the overflow menu, revealed by either the device Menu button (when available) or by an "overflow menu" button in the action bar (when the device does not include a Menu button).

Page 2: Android action bar and notifications-chapter16

Figure 16.1 Action Bar

Example Action Bar

is a menu bar that is positioned at the top of the screen and is used as a replacement for the title bar. Google is really pushing developers to use ActionBars and move away from using the hardware menu button. To enable ActionBar in your application you will have to include things like android:targetSdkVersion=”11″ or greater as part of your aspect in the Androidmanifest.xml.

The code in AndroidManifest.xml is as follows:

Ensure the following codes are changed in your AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?><manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.mjs.actionbar" android:versionCode="1" android:versionName="1.0" >

<uses-sdk android:minSdkVersion="11" android:targetSdkVersion="17" />

<application android:allowBackup="true" android:icon="@drawable/ic_launcher" android:label="@string/app_name" android:theme="@android:style/Theme.Holo" > <activity android:name="com.mjs.actionbar.MainActivity" android:label="@string/app_name" > <intent-filter> <action android:name="android.intent.action.MAIN" />

<category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> </application>

<uses-sdk android:minSdkVersion="11" android:targetSdkVersion="17" />

<application android:allowBackup="true" android:icon="@drawable/ic_launcher" android:label="@string/app_name" android:theme="@android:style/Theme.Holo" >

Page 3: Android action bar and notifications-chapter16

Now for the MainActivity. The only thing that should be new is in the onCreate method.

package com.mjs.actionbar;

import android.os.Bundle;import android.app.ActionBar;import android.app.Activity;import android.view.Menu;import android.view.MenuItem;import android.widget.Toast;

public class MainActivity extends Activity {

@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); // gets the activity's default ActionBar ActionBar actionBar = getActionBar(); actionBar.show(); // set the app icon as an action to go home // we are home so we don't need it // actionBar.setDisplayHomeAsUpEnabled(true); }

@Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.activity_main, menu); return true; } @Override public boolean onOptionsItemSelected(MenuItem item){ // same as using a normal menu switch(item.getItemId()) { case R.id.item_refresh: makeToast("Refreshing..."); break; case R.id.item_save: makeToast("Saving..."); break; } return true; } public void makeToast(String message) { Toast.makeText(this, message, Toast.LENGTH_SHORT).show(); } }

Page 4: Android action bar and notifications-chapter16

The code of res\menu\activity_main.xml will be as follows:

This is just a normal menu xml. The only thing that might be new is the last line of each item. This line just says, if there is enough room, the title will be shown.

Figure 16.2 Action Bar

<menu xmlns:android="http://schemas.android.com/apk/res/android" >

<itemandroid:id="@+id/item_refresh"android:title="Refresh"android:showAsAction="ifRoom|withText" />

<itemandroid:id="@+id/item_save"android:title="Save"android:showAsAction="ifRoom|withText" />

</menu>

Page 5: Android action bar and notifications-chapter16

When the user selects an action item, your activity receives a call to onOptionsItemSelected(), passing the ID supplied by the android:id attribute—the same callback received for all items in the options menu.

It's important that you always define android:title for each menu item—even if you don't declare that the title appear with the action item—for three reasons:

If there's not enough room in the action bar for the action item, the menu item appears in the overflow menu and only the title appears.

Screen readers for sight-impaired users read the menu item's title.

If the action item appears with only the icon, a user can long-press the item to reveal a tool-tip that displays the action item's title.

Notifications

A notification is a message you can display to the user outside of your application's normal UI. When you tell the system to issue a notification, it first appears as an icon in the notification area.

Notification Display Elements

Notifications in the notification drawer can appear in one of two visual styles, depending on the version and the state of the drawer:

Normal view

The standard view of the notifications in the notification drawer.

Figure 16.2 Notifications in Normal View

The callouts in the Figure 16.2 refer to the following:

1. Content title

2. Large icon

3. Content text

4. Content info

5. Small icon

Page 6: Android action bar and notifications-chapter16

6. Time that the notification was issued. You can set an explicit value with setWhen(); if you don't it defaults to the time that the system received the notification.

Big view

A large view that's visible when the notification is expanded. Big view is part of the expanded notification feature available as of Android 4.1.

Figure 16.3 Big View Notifications

Notice that the big view shares most of its visual elements with the normal view. The only difference is callout number 7, the details area. Each big view style sets this area in a different way. The available styles are:

Big picture style

The details area contains a bitmap up to 256 dp tall in its detail section.

Big text style

Displays a large text block in the details section.

Inbox style

Displays lines of text in the details section.

All of the big view styles also have the following content options that aren't available in normal view:

Big content title

Allows you to override the normal view's content title with a title that appears only in the expanded view.

Page 7: Android action bar and notifications-chapter16

Summary text

Allows you to add a line of text below the details area.

Example – Notifications

Android allows to put notification into the titlebar of your application. The user can expand the notification bar and by selecting the notification the user can trigger another activity. Notifications in Android are represented by the Notification class. To create notifications you use theNotificationManager class which can be received from the Context, e.g. an activity or a Service, via the getSystemService() method.

The Notification.Builder provides an builder interface to create an Notification object. You use a PendingIntent to specify the action which should be performed once the user select the notification. Notification.Builder allows to add up two three buttons with definable actions to the notification. For the icon we have used the default icon ic_launcher available in res/drawable.

NotificationManager notificationManager = (NotificationManager)

getSystemService(NOTIFICATION_SERVICE);

// Prepare intent which is triggered if the// notification is selected

Intent intent = new Intent(this, NotificationReceiver.class);PendingIntent pIntent = PendingIntent.getActivity(this, 0, intent, 0);

// Build notification// Actions are just fakeNotification noti = new Notification.Builder(this) .setContentTitle("New mail from " + "[email protected]") .setContentText("Subject").setSmallIcon(R.drawable.ic_launcher) .setContentIntent(pIntent) .addAction(R.drawable.ic_launcher, "Call", pIntent) .addAction(R.drawable.ic_launcher, "More", pIntent) .addAction(R.drawable.ic_launcher, "And more", pIntent).build(); NotificationManager notificationManager = (NotificationManager) getSystemService(NOTIFICATION_SERVICE);

// Hide the notification after its selectednoti.flags |= Notification.FLAG_AUTO_CANCEL;

notificationManager.notify(0, noti);

Page 8: Android action bar and notifications-chapter16

Figure 16.4 Notification

Android 4.1 supports expandable notifications. In addition to normal notification view it is now possible to define a big view which gets shown when notification is expanded. There are three styles to be used with the big view: big picture style, big text style, Inbox style. The following code demonstrates the usage of theBigTextStyle() which allows to use up to 256 dp.

The user can dismiss all notification or if you set your notification to auto-cancel it is also removed once the user selects it. You can also call the cancel() for a specific notification ID on the NotificationManager. ThecancelAll() method call removes all of the notifications you previously issued.

Create a new Project com.mjs.notificationmanager with the activity class called MainActivity. This activity should use the activity_main.xml layout file.

String longText = "...";Notification noti = new Notification.Builder(this).......setStyle(new Notification.BigTextStyle().bigText(longText))

Page 9: Android action bar and notifications-chapter16

Create the following result.xml layout file.

Create a new activity called NotificationReceiverActivity with the following coding. Don't forget to register the activity in the AndroidManifest.xml.

In order to create NotificationReceiverActivity.java copy the MainActivity.java and Save as a Copy with the respective name and add the following code.

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" >

<Button android:id="@+id/button1" android:layout_width="match_parent" android:layout_height="match_parent" android:onClick="createNotification" android:text="Create Notification" > </Button>

</LinearLayout>

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" >

<TextView android:id="@+id/textView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="This is the result activity opened from the notification" > </TextView>

</LinearLayout>

<activity android:name="com.mjs.notificationmanager.NotificationReceiverActivity"> </activity>

package com.mjs.notificationmanager;

import android.os.Bundle;import android.app.Activity;

public class NotificationReceiverActivity extends Activity {

@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.result); }}

Page 10: Android action bar and notifications-chapter16

Change the MainActivity.java to the following code:

package com.mjs.notificationmanager;

import android.app.Activity;import android.app.Notification;import android.app.NotificationManager;import android.app.PendingIntent;import android.content.Intent;import android.os.Bundle;import android.view.View;import android.app.Activity;import android.view.Menu;

public class MainActivity extends Activity {

@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); } public void createNotification(View view) { // Prepare intent which is triggered if the // notification is selected Intent intent = new Intent(this, NotificationReceiverActivity.class); PendingIntent pIntent = PendingIntent.getActivity(this, 0, intent, 0);

// Build notification // Actions are just fake Notification noti = new Notification.Builder(this) .setContentTitle("New mail from " + "[email protected]") .setContentText("Subject").setSmallIcon(R.drawable.ic_launcher) .setContentIntent(pIntent) .addAction(R.drawable.ic_launcher, "Call", pIntent) .addAction(R.drawable.ic_launcher, "More", pIntent) .addAction(R.drawable.ic_launcher, "And more", pIntent).build(); NotificationManager notificationManager = (NotificationManager) getSystemService(NOTIFICATION_SERVICE); // Hide the notification after its selected noti.flags |= Notification.FLAG_AUTO_CANCEL;

notificationManager.notify(0, noti);

} @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.activity_main, menu); return true; } }

Page 11: Android action bar and notifications-chapter16

Run your application and press the button. A new notification is created. If you select it your second activity will be displayed.

Summary

In this unit we have discussed about Action Bar and Notifications. Android support various design practices to create an enhanced user interface. Beginning with Android 3.0 (API level 11), the action bar appears at the top of an activity's window when the activity uses the system's Holo theme (or one of its descendant themes), which is the default. Notifications, as an important part of the Android UI, have their own design guidelines. We have discussed and designed application based on the Action Bar and Notifications.