SlideShare a Scribd company logo
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).
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>
</manifest>
<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" >
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();
}
}
The code of resmenuactivity_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" >
<item
android:id="@+id/item_refresh"
android:title="Refresh"
android:showAsAction="ifRoom|withText" />
<item
android:id="@+id/item_save"
android:title="Save"
android:showAsAction="ifRoom|withText" />
</menu>
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
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.
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 fake
Notification noti = new Notification.Builder(this)
.setContentTitle("New mail from " + "test@gmail.com")
.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);
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))
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);
}
}
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 " + "test@gmail.com")
.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;
}
}
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.

More Related Content

What's hot

Android UI Fundamentals part 1
Android UI Fundamentals part 1Android UI Fundamentals part 1
Android UI Fundamentals part 1
Marcos Paulo Souza Damasceno
 
Android Training (Notifications)
Android Training (Notifications)Android Training (Notifications)
Android Training (Notifications)
Khaled Anaqwa
 
Android notifications
Android notificationsAndroid notifications
Android notificationsKetan Raval
 
Android session 2
Android session 2Android session 2
Android session 2
Ahesanali Suthar
 
Android apps development
Android apps developmentAndroid apps development
Android apps development
Raman Pandey
 
Android session 3
Android session 3Android session 3
Android session 3
Ahesanali Suthar
 
Android session 1
Android session 1Android session 1
Android session 1
Ahesanali Suthar
 
Android Tutorial For Beginners Part-1
Android Tutorial For Beginners Part-1Android Tutorial For Beginners Part-1
Android Tutorial For Beginners Part-1
Amit Saxena
 
Getting the Magic on Android Tablets
Getting the Magic on Android TabletsGetting the Magic on Android Tablets
Getting the Magic on Android Tablets
Motorola Mobility - MOTODEV
 
Event App - Features at a glance
Event App - Features at a glanceEvent App - Features at a glance
Event App - Features at a glance
Darren Edwards
 
How to create ui using droid draw
How to create ui using droid drawHow to create ui using droid draw
How to create ui using droid drawinfo_zybotech
 
Android views and layouts-chapter4
Android views and layouts-chapter4Android views and layouts-chapter4
Android views and layouts-chapter4
Dr. Ramkumar Lakshminarayanan
 
Android user interface design-chapter13
Android user interface design-chapter13Android user interface design-chapter13
Android user interface design-chapter13
Dr. Ramkumar Lakshminarayanan
 
A comprehensive guide on developing responsive and common react filter component
A comprehensive guide on developing responsive and common react filter componentA comprehensive guide on developing responsive and common react filter component
A comprehensive guide on developing responsive and common react filter component
Katy Slemon
 

What's hot (15)

android menus
android menusandroid menus
android menus
 
Android UI Fundamentals part 1
Android UI Fundamentals part 1Android UI Fundamentals part 1
Android UI Fundamentals part 1
 
Android Training (Notifications)
Android Training (Notifications)Android Training (Notifications)
Android Training (Notifications)
 
Android notifications
Android notificationsAndroid notifications
Android notifications
 
Android session 2
Android session 2Android session 2
Android session 2
 
Android apps development
Android apps developmentAndroid apps development
Android apps development
 
Android session 3
Android session 3Android session 3
Android session 3
 
Android session 1
Android session 1Android session 1
Android session 1
 
Android Tutorial For Beginners Part-1
Android Tutorial For Beginners Part-1Android Tutorial For Beginners Part-1
Android Tutorial For Beginners Part-1
 
Getting the Magic on Android Tablets
Getting the Magic on Android TabletsGetting the Magic on Android Tablets
Getting the Magic on Android Tablets
 
Event App - Features at a glance
Event App - Features at a glanceEvent App - Features at a glance
Event App - Features at a glance
 
How to create ui using droid draw
How to create ui using droid drawHow to create ui using droid draw
How to create ui using droid draw
 
Android views and layouts-chapter4
Android views and layouts-chapter4Android views and layouts-chapter4
Android views and layouts-chapter4
 
Android user interface design-chapter13
Android user interface design-chapter13Android user interface design-chapter13
Android user interface design-chapter13
 
A comprehensive guide on developing responsive and common react filter component
A comprehensive guide on developing responsive and common react filter componentA comprehensive guide on developing responsive and common react filter component
A comprehensive guide on developing responsive and common react filter component
 

Viewers also liked

Android canvas-chapter20
Android canvas-chapter20Android canvas-chapter20
Android canvas-chapter20
Dr. Ramkumar Lakshminarayanan
 
Discovering the value of the cloud for the business
Discovering the value of the cloud for the business Discovering the value of the cloud for the business
Discovering the value of the cloud for the business Dr. Ramkumar Lakshminarayanan
 
Web technology today
Web technology todayWeb technology today
Web technology today
Dr. Ramkumar Lakshminarayanan
 
Spc Ardmona
Spc ArdmonaSpc Ardmona
Spc Ardmona
DavidCarver
 

Viewers also liked (6)

Android canvas-chapter20
Android canvas-chapter20Android canvas-chapter20
Android canvas-chapter20
 
Discovering the value of the cloud for the business
Discovering the value of the cloud for the business Discovering the value of the cloud for the business
Discovering the value of the cloud for the business
 
Web technology today
Web technology todayWeb technology today
Web technology today
 
Css advanced – session 5
Css advanced – session 5Css advanced – session 5
Css advanced – session 5
 
Amazon web services session 4
Amazon web services   session 4Amazon web services   session 4
Amazon web services session 4
 
Spc Ardmona
Spc ArdmonaSpc Ardmona
Spc Ardmona
 

Similar to Android action bar and notifications-chapter16

Chapter 2 lesson-1 adding the action bar
Chapter 2 lesson-1 adding the action barChapter 2 lesson-1 adding the action bar
Chapter 2 lesson-1 adding the action bar
Kalluri Vinay Reddy
 
How to create android push notifications with custom view
How to create android push notifications with custom viewHow to create android push notifications with custom view
How to create android push notifications with custom view
PushApps - Content Recommendation in Push Notifications
 
Notification android
Notification androidNotification android
Notification android
ksheerod shri toshniwal
 
Using android's action bar
Using android's action barUsing android's action bar
Using android's action bar
Danilo Freitas de Souza
 
Android Wearables ii
Android Wearables iiAndroid Wearables ii
Android Wearables ii
Ketan Raval
 
Action Bar in Android
Action Bar in AndroidAction Bar in Android
Action Bar in Android
Prof. Erwin Globio
 
Android Bootcamp Tanzania:understanding ui in_android
Android Bootcamp Tanzania:understanding ui in_androidAndroid Bootcamp Tanzania:understanding ui in_android
Android Bootcamp Tanzania:understanding ui in_android
Denis Minja
 
iOS Development (Part 2)
iOS Development (Part 2)iOS Development (Part 2)
iOS Development (Part 2)
Asim Rais Siddiqui
 
Lab3-Android
Lab3-AndroidLab3-Android
Lab3-Android
Lilia Sfaxi
 
Lab1-android
Lab1-androidLab1-android
Lab1-android
Lilia Sfaxi
 
Android 3
Android 3Android 3
Android 3
Robert Cooper
 
Android App Development - 05 Action bar
Android App Development - 05 Action barAndroid App Development - 05 Action bar
Android App Development - 05 Action bar
Diego Grancini
 
android activity
android activityandroid activity
android activityDeepa Rani
 
Implementation of Push Notification in React Native Android app using Firebas...
Implementation of Push Notification in React Native Android app using Firebas...Implementation of Push Notification in React Native Android app using Firebas...
Implementation of Push Notification in React Native Android app using Firebas...
naseeb20
 
Google calendar integration in iOS app
Google calendar integration in iOS appGoogle calendar integration in iOS app
Google calendar integration in iOS app
Ketan Raval
 
Activity
ActivityActivity
Activity
NikithaNag
 
Activity
ActivityActivity
Activity
roopa_slide
 
Activity
ActivityActivity
Activity
NikithaNag
 

Similar to Android action bar and notifications-chapter16 (20)

Chapter 2 lesson-1 adding the action bar
Chapter 2 lesson-1 adding the action barChapter 2 lesson-1 adding the action bar
Chapter 2 lesson-1 adding the action bar
 
How to create android push notifications with custom view
How to create android push notifications with custom viewHow to create android push notifications with custom view
How to create android push notifications with custom view
 
Twitter trends
Twitter trendsTwitter trends
Twitter trends
 
Notification android
Notification androidNotification android
Notification android
 
Using android's action bar
Using android's action barUsing android's action bar
Using android's action bar
 
Android Wearables ii
Android Wearables iiAndroid Wearables ii
Android Wearables ii
 
Action Bar in Android
Action Bar in AndroidAction Bar in Android
Action Bar in Android
 
Android Bootcamp Tanzania:understanding ui in_android
Android Bootcamp Tanzania:understanding ui in_androidAndroid Bootcamp Tanzania:understanding ui in_android
Android Bootcamp Tanzania:understanding ui in_android
 
iOS Development (Part 2)
iOS Development (Part 2)iOS Development (Part 2)
iOS Development (Part 2)
 
Lab3-Android
Lab3-AndroidLab3-Android
Lab3-Android
 
Lab1-android
Lab1-androidLab1-android
Lab1-android
 
Android 3
Android 3Android 3
Android 3
 
Android App Development - 05 Action bar
Android App Development - 05 Action barAndroid App Development - 05 Action bar
Android App Development - 05 Action bar
 
Lesson 9
Lesson 9Lesson 9
Lesson 9
 
android activity
android activityandroid activity
android activity
 
Implementation of Push Notification in React Native Android app using Firebas...
Implementation of Push Notification in React Native Android app using Firebas...Implementation of Push Notification in React Native Android app using Firebas...
Implementation of Push Notification in React Native Android app using Firebas...
 
Google calendar integration in iOS app
Google calendar integration in iOS appGoogle calendar integration in iOS app
Google calendar integration in iOS app
 
Activity
ActivityActivity
Activity
 
Activity
ActivityActivity
Activity
 
Activity
ActivityActivity
Activity
 

More from Dr. Ramkumar Lakshminarayanan

IT security awareness
IT security awarenessIT security awareness
IT security awareness
Dr. Ramkumar Lakshminarayanan
 
IT Security Awareness Posters
IT Security Awareness PostersIT Security Awareness Posters
IT Security Awareness Posters
Dr. Ramkumar Lakshminarayanan
 
Windows mobile programming
Windows mobile programmingWindows mobile programming
Windows mobile programming
Dr. Ramkumar Lakshminarayanan
 
Concurrency control
Concurrency controlConcurrency control
Concurrency control
Dr. Ramkumar Lakshminarayanan
 
Php Tutorial
Php TutorialPhp Tutorial
Phonegap for Android
Phonegap for AndroidPhonegap for Android
Phonegap for Android
Dr. Ramkumar Lakshminarayanan
 
Create and Sell Android App (in tamil)
Create and Sell Android App (in tamil)Create and Sell Android App (in tamil)
Create and Sell Android App (in tamil)
Dr. Ramkumar Lakshminarayanan
 
Android app - Creating Live Wallpaper (tamil)
Android app - Creating Live Wallpaper (tamil)Android app - Creating Live Wallpaper (tamil)
Android app - Creating Live Wallpaper (tamil)
Dr. Ramkumar Lakshminarayanan
 
Android Tips (Tamil)
Android Tips (Tamil)Android Tips (Tamil)
Android Tips (Tamil)
Dr. Ramkumar Lakshminarayanan
 
Android Animation (in tamil)
Android Animation (in tamil)Android Animation (in tamil)
Android Animation (in tamil)
Dr. Ramkumar Lakshminarayanan
 
Creating List in Android App (in tamil)
Creating List in Android App (in tamil)Creating List in Android App (in tamil)
Creating List in Android App (in tamil)
Dr. Ramkumar Lakshminarayanan
 
Single Touch event view in Android (in tamil)
Single Touch event view in Android (in tamil)Single Touch event view in Android (in tamil)
Single Touch event view in Android (in tamil)
Dr. Ramkumar Lakshminarayanan
 
Android Application using seekbar (in tamil)
Android Application using seekbar (in tamil)Android Application using seekbar (in tamil)
Android Application using seekbar (in tamil)
Dr. Ramkumar Lakshminarayanan
 
Rating Bar in Android Example
Rating Bar in Android ExampleRating Bar in Android Example
Rating Bar in Android Example
Dr. Ramkumar Lakshminarayanan
 
Creating Image Gallery - Android app (in tamil)
Creating Image Gallery - Android app (in tamil)Creating Image Gallery - Android app (in tamil)
Creating Image Gallery - Android app (in tamil)
Dr. Ramkumar Lakshminarayanan
 
Create Android App using web view (in tamil)
Create Android App using web view (in tamil)Create Android App using web view (in tamil)
Create Android App using web view (in tamil)
Dr. Ramkumar Lakshminarayanan
 
Hardware Interface in Android (in tamil)
Hardware Interface in Android (in tamil)Hardware Interface in Android (in tamil)
Hardware Interface in Android (in tamil)
Dr. Ramkumar Lakshminarayanan
 
GPS in Android (in tamil)
GPS in Android (in tamil)GPS in Android (in tamil)
GPS in Android (in tamil)
Dr. Ramkumar Lakshminarayanan
 

More from Dr. Ramkumar Lakshminarayanan (20)

IT security awareness
IT security awarenessIT security awareness
IT security awareness
 
Basics of IT security
Basics of IT securityBasics of IT security
Basics of IT security
 
IT Security Awareness Posters
IT Security Awareness PostersIT Security Awareness Posters
IT Security Awareness Posters
 
Normalisation revision
Normalisation revisionNormalisation revision
Normalisation revision
 
Windows mobile programming
Windows mobile programmingWindows mobile programming
Windows mobile programming
 
Concurrency control
Concurrency controlConcurrency control
Concurrency control
 
Php Tutorial
Php TutorialPhp Tutorial
Php Tutorial
 
Phonegap for Android
Phonegap for AndroidPhonegap for Android
Phonegap for Android
 
Create and Sell Android App (in tamil)
Create and Sell Android App (in tamil)Create and Sell Android App (in tamil)
Create and Sell Android App (in tamil)
 
Android app - Creating Live Wallpaper (tamil)
Android app - Creating Live Wallpaper (tamil)Android app - Creating Live Wallpaper (tamil)
Android app - Creating Live Wallpaper (tamil)
 
Android Tips (Tamil)
Android Tips (Tamil)Android Tips (Tamil)
Android Tips (Tamil)
 
Android Animation (in tamil)
Android Animation (in tamil)Android Animation (in tamil)
Android Animation (in tamil)
 
Creating List in Android App (in tamil)
Creating List in Android App (in tamil)Creating List in Android App (in tamil)
Creating List in Android App (in tamil)
 
Single Touch event view in Android (in tamil)
Single Touch event view in Android (in tamil)Single Touch event view in Android (in tamil)
Single Touch event view in Android (in tamil)
 
Android Application using seekbar (in tamil)
Android Application using seekbar (in tamil)Android Application using seekbar (in tamil)
Android Application using seekbar (in tamil)
 
Rating Bar in Android Example
Rating Bar in Android ExampleRating Bar in Android Example
Rating Bar in Android Example
 
Creating Image Gallery - Android app (in tamil)
Creating Image Gallery - Android app (in tamil)Creating Image Gallery - Android app (in tamil)
Creating Image Gallery - Android app (in tamil)
 
Create Android App using web view (in tamil)
Create Android App using web view (in tamil)Create Android App using web view (in tamil)
Create Android App using web view (in tamil)
 
Hardware Interface in Android (in tamil)
Hardware Interface in Android (in tamil)Hardware Interface in Android (in tamil)
Hardware Interface in Android (in tamil)
 
GPS in Android (in tamil)
GPS in Android (in tamil)GPS in Android (in tamil)
GPS in Android (in tamil)
 

Android action bar and notifications-chapter16

  • 1. 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).
  • 2. 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> </manifest> <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" >
  • 3. 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(); } }
  • 4. The code of resmenuactivity_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" > <item android:id="@+id/item_refresh" android:title="Refresh" android:showAsAction="ifRoom|withText" /> <item android:id="@+id/item_save" android:title="Save" android:showAsAction="ifRoom|withText" /> </menu>
  • 5. 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
  • 6. 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.
  • 7. 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 fake Notification noti = new Notification.Builder(this) .setContentTitle("New mail from " + "test@gmail.com") .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);
  • 8. 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))
  • 9. 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); } }
  • 10. 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 " + "test@gmail.com") .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; } }
  • 11. 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.