---
title: "Leveraging Action bar in android : Tab Navigation"  
description: "Hi all  here we are going to implement Tab navigation modes on action bar items in android"  
author: "Anonymous User"  
published: 2015-02-17  
updated: 2019-09-07  
canonical: https://www.mindstick.com/articles/1583/leveraging-action-bar-in-android-tab-navigation  
category: "android"  
tags: ["android"]  
reading_time: 6 minutes  

---

# Leveraging Action bar in android : Tab Navigation

On my previous post, we learn some basic characteristics for Action bar : **Leveraging action bar in Android.** This post is the [extension](https://www.mindstick.com/articles/22/extension-method) of the same. Here we implement Tab [navigation](https://www.mindstick.com/blog/62/different-navigation-in-asp-dot-net) for action bar items in android\

One of the primary navigation mode of the action bar is **tab navigation**. In this mode, a secondary bar for tabs is displayed below the action bar when the device is in portrait [orientation](https://www.mindstick.com/interview/2604/what-is-orientation). In landscape orientation, the tabs move up into the main action bar. In both cases, however, if there are more tabs than the screen can display at once, the tab section of the bar can be horizontally scrolled to reveal the remaining tabs. In addition, as tabs are selected, they scroll themselves into a more centered location of the view, allowing the user to discover the remaining tabs.

**Note:** The [implementation](https://answers.mindstick.com/qa/44913/who-is-the-minister-of-statistics-and-programme-implementation) here is implemented using AppCompat Support Library v7 , but it can be easily modified to work with native API’s . The only changes are that each activity must extend Activity instead of ActionBarActivity, and each call to getSupportActionBar() should be replace to getActionBar().

## Pre-Requisites:

1. Ellipse SDK

2. Android SDK

3. ADT plugin

Or [Android Studio](https://www.mindstick.com/blog/10942/android-studio-vs-eclipse) and a compatible version of JAVA SDK

Install and configure the above utilities.

Now create a new Android project namely “**ActionBarApplicationTest**”.

## Implementation objective:

To show the tab navigation mode for Action bar items when the view is in **Portrait orientation** but will move in action bar when the device is in Landscape orientation

**Code Implementation:**

First of all [update your](https://answers.mindstick.com/qa/96426/how-can-you-update-your-profile-without-notifying-contacts) **activity_main. xml** as follows:

```
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    tools:context=".MainActivity">
    <TextView
        android:text="@string/hello_world"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/txt"
        android:textSize="28dp" />
</LinearLayout>
```

\

Now navigate to **MainActivity.java** and add this code:

```
package com.example.msclient010.actionbarapplicationtest;import android.os.Bundle;import android.support.v7.app.ActionBarActivity;import android.view.Menu;import android.view.MenuItem;import android.widget.TextView;
public class MainActivity extends ActionBarActivity implements android.support.v7.app.ActionBar.TabListener {
    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        //getting action bar instance;        android.support.v7.app.ActionBar actionbar = getSupportActionBar();        //Enables taps on the home logo
        actionbar.setHomeButtonEnabled(true);        //Display home with the "up" arrow indicator        actionbar.setDisplayHomeAsUpEnabled(true);        //create tabs        android.support.v7.app.ActionBar.Tab newTab0 = actionbar.newTab();        newTab0.setText("Tab 0 title");        android.support.v7.app.ActionBar.Tab newTab1 = actionbar.newTab();        newTab1.setText("Tab 1 title");        android.support.v7.app.ActionBar.Tab newTab2 = actionbar.newTab();        newTab2.setText("Tab 2 title");
        //set tab listener to new tabs        newTab0.setTabListener((android.support.v7.app.ActionBar.TabListener) this);        newTab1.setTabListener((android.support.v7.app.ActionBar.TabListener) this);        newTab2.setTabListener((android.support.v7.app.ActionBar.TabListener) this);
        //add tabs to action bar        actionbar.addTab(newTab0);        actionbar.addTab(newTab1);        actionbar.addTab(newTab2);        //apply navigation tab mode to action bar        actionbar.setNavigationMode(android.support.v7.app.ActionBar.NAVIGATION_MODE_TABS);
    }
    @Override    public boolean onCreateOptionsMenu(Menu menu) {        // Inflate the menu; this adds items to the action bar if it is present.        getMenuInflater().inflate(R.menu.menu_main, menu);        return true;
    }    @Override    public boolean onOptionsItemSelected(MenuItem item) {
        if (item.getItemId() == android.R.id.home) {            int current = getSupportActionBar().getSelectedTab().getPosition();            //select the next tab, or first if we at the end currently            if (++current >= getSupportActionBar().getTabCount()) {                current = 0;
            }            getSupportActionBar().selectTab(getSupportActionBar().getTabAt(current));
            return true;        }        return super.onOptionsItemSelected(item);    }   /* Tab Listener Callback methods */    @Override    public void onTabSelected(android.support.v7.app.ActionBar.Tab tab, android.support.v4.app.FragmentTransaction fragmentTransaction) {
        //getting text view reference        TextView txt = (TextView)findViewById(R.id.txt);        //setting tabs title to the text view        txt.setText(tab.getText());
    }
    @Override    public void onTabUnselected(android.support.v7.app.ActionBar.Tab tab, android.support.v4.app.FragmentTransaction fragmentTransaction) {
    }    @Override    public void onTabReselected(android.support.v7.app.ActionBar.Tab tab, android.support.v4.app.FragmentTransaction fragmentTransaction) {
    }}
```

**Code [Explanation](https://answers.mindstick.com/blog/94/neural-network-simple-explanation-with-real-life-examples):**

· Our [application](https://www.mindstick.com/articles/12824/calculator-application-in-android) can react to user tab selections by implementing an **ActionBar.TabListener**and passing that instance to each created tab. This interface provides the following methods

§ **onTabReselected****:** Called when a tab is selected again

§ **onTabSelected****:** Called when a tab is selected the first time

§ **onTabUnselected****:** Called when a tab is no longer selected

· First of all we need to create **tab instances**, there is a [factory method](https://www.mindstick.com/forum/34032/factory-method-design-pattern-using-c-sharp) on ActionBar called newTab() and set the text using setText() method.

· Now we need to register for callback event i.e. set listeners for each tab using **setTabListener()**

· Next, we use **addTab()** methods to add three tab in our action bar

· Finally we set tab navigation mode to action bar using **setNavigationMode()** method and passing NAVIGATION_MODE_TABS

· It is also possible to programmatically select a tab.Here, we override **onOptionsItemSelected()** to react to the user tapping the Home/Up button in the action bar. Each time the button is pressed, we find the next tab in line based on the position of the currently selected tab (**accessed via the** **getSelectedTab()** **method**) and select it by using selectTab().

· Implement the **onTabSelected()** to show the tabs title in the main content when the title is selected

##

## Running the Application:

Hit on Run button, the Emulators screen will be default showed in **Portrait orientation** consists of three tabs:

![Leveraging Action bar in android : Tab Navigation](https://www.mindstick.com/mindstickarticle/de3b3e4f-f6e3-4fcd-8254-5b96a13d3053/images/020c4101-949b-4a9f-8228-20ccd8f90d65.png)

Click on to the next tab and UI text will be changed. We can also navigate through tabs using up button from the action bar :

![Leveraging Action bar in android : Tab Navigation](https://www.mindstick.com/mindstickarticle/de3b3e4f-f6e3-4fcd-8254-5b96a13d3053/images/480befeb-f42d-424f-bbfa-66600484f003.png)

Now change the orientation of the emulator to **[Landscape mode](https://www.mindstick.com/forum/23288/orientation-issue-how-to-disable-landscape-mode-in-android)**, the tabs goes up to action bar:

![Leveraging Action bar in android : Tab Navigation](https://www.mindstick.com/mindstickarticle/de3b3e4f-f6e3-4fcd-8254-5b96a13d3053/images/526ef922-6d5d-4636-8d68-637d46d8892a.png)

Next, we are going to learn how to implement list navigation in action bar : **Leveraging Action bar in android : List Navigation**

Thanks for reading this post.

Happy Coding!! J

---

Original Source: https://www.mindstick.com/articles/1583/leveraging-action-bar-in-android-tab-navigation

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.