Action Bar
Action Bar
INSTRUCTOR: MUHAMMAD
NAEEM KHAN
ActionBar
1. In Android applications, ActionBar is the element present at the top of the activity screen. It is a
salient feature of a mobile application that has a consistent presence over all its activities. It
provides a visual structure to the app and contains some of the frequently used elements for the
users. Android ActionBar was launched by Google in 2013 with the release of Android 3.0(API
11). Before that, the name of this top most visual element was AppBar. AppBar contains only the
name of the application or current activity. It was not very much useful for the users and developers
also have negligible option to customize it.
Components included in the ActionBar are:
App Icon: Display the branding logo/icon of the application.
View Controls: Section that displays the name of the application or current activity. Developers can
also include spinner or tabbed navigation for switching between views.
Action Button: Contains some important actions/elements of the app that may be required to the
users frequently.
Action Overflow: Include other actions that will be displayed as a menu.
Designing a Custom ActionBar
Step 1: Default ActionBar
As mentioned earlier, every android app contains an ActionBar by default.
This pre-included ActionBar display title for the current activity that is
managed by the AncdroidManifest.xml file. The string value of the
application’s title is provided by @string/app_name resource present
under the application nodes.
<application
…..
…..
android:label=”@string/app_name”
…..
</application>
Output:
Designing a Custom ActionBar
Step 2: Creating a new directory and design items of
ActionBar
To code the elements of ActionBar, create a new directory in the resource
folder of the application project files. Right-click on the res folder and
selects New -> Directory. Give the name “menu” to the new directory.
Further, create a new Menu Resource File by right click on the menu
directory. As the ActionBar is being created for the main Activity, type the
name as “main” to the Menu Resource File. With this, a new file
named “main.xml” must be created under the menu directory. In this file,
one can declare the items which will be displayed as the action
buttons of the ActionBar.
Designing a Custom ActionBar
For every menu items, the following attributes are needed to be configured:
android:title: Its value contains the title of the menu item that will be displayed when a user clicks and
holds that item in the app.
android:id: A unique ID for the menu item that will be used to access it anywhere in the whole
application files.
android:orderInCategory: The value of this attribute specify the item’s position in the ActionBar. There
are two ways to define the position of different menu items. The first one is to provide the same value of
this attribute for all items and the position will be defined in the same order as they are declared in the
code. The second way is to provide a different numeric value for all items and then the items will
position themselves according to ascending order of this attribute’s value.
app:showAsAction: This attribute defines how the item is going to be present in the action bar. There
are four possible flags to choose from:
a. always: To display the item in the ActionBar all the time.
b. ifRoom: To keep the item if space is available.
c. never: With this flag, the item will be not be displayed as an icon in ActionBar, but will be present
in the overflow menu.
d. withText: To represent an item as both icon and the title, one can append this flag with the
always or ifRoom flag(always|withText or ifRoom|withText).
android:icon: The icon of an item is referenced in the drawable directories through this attribute.
How to create ActionBar?
XML Code
<?xml version="1.0" encoding="utf-8"?> <item android:title="refresh"
<menu android:id="@+id/refresh"
xmlns:app="http://schemas.android.com/ap
k/res-auto" android:orderInCategory="100"
xmlns:android="http:// app:showAsAction="ifRoom"
schemas.android.com/apk/res/android"> android:icon="@drawable/
refresh_icon"/>
<!-- action button for search -->
<item android:title="search" <!-- action button for copy -->
android:id="@+id/search" <item android:title="copy"
android:id="@+id/copy"
android:orderInCategory="100"
app:showAsAction="ifRoom" android:orderInCategory="100"
android:icon="@drawable/ app:showAsAction="never"
search_icon"/> android:icon="@drawable/
copy_icon"/>
<!-- action button for refresh --> </menu>
How to create ActionBar?
Java Code
@Override @Override
public boolean onCreateOptionsMenu( Menu public boolean
menu ) { onOptionsItemSelected(@NonNull
MenuItem item) {
getMenuInflater().inflate(R.menu.main, int id = item.getItemId();
menu); if(id==R.id.Add)
return super.onCreateOptionsMenu(menu); {
} Toast.makeText(this, "Search",
Toast.LENGTH_SHORT).show();
}
return
super.onOptionsItemSelected(item);
}
Thank You