About Francesco Azzola

I'm a senior software engineer with more than 15 yrs old experience in JEE architecture. I'm SCEA certified (Sun Certified Enterprise Architect), SCWCD, SCJP. I'm an android enthusiast and i've worked for long time in the mobile development field.

Android Action Bar with Tab

Action bar was introduced from API level 11. In this post I will explain how to create tab in action bar with fragments. The final result is shown below where user can move between tabs.

Creating the Action bar and the tabs

The first step is getting the action bar reference and add the tab to it:

protected void onCreate(Bundle savedInstanceState) {
    ActionBar bar = getActionBar();

    for (int i=1; i <= 3; i++) {
        Tab tab = bar.newTab();
        tab.setText("Tab " + i);


Notice that first of all we don’t use any “main” layout. Second at line 3 we get the reference to the action bar simply using the method getActionBar. At line 4 we set the navigation mode in our case
NAVIGATION_MODE_TABS. There three different navigation type supported:

  • Navigation mode list
  • Navigation mode standard
  • Navigation mode tabs

After these steps we have to create our tabs and add it to the action bar. In our example we create three different tabs. What we want is when user touches one of the tab the UI content changes. To achieve it we need two things:

  • Fragment that fills the UI when user changes the tab according to the tab selected
  • A listener that gets notification when user interacts with the tabs

Tab Fragment

In our example fragment will be very simple, it just shows a text in the middle of the screen. The layout looks like:

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

    <TextView android:id="@+id/msg"


While the fragment source code is very simple:

public void onCreate(Bundle savedInstanceState) {        
    Bundle data = getArguments();
    index = data.getInt("idx");

public View onCreateView(LayoutInflater inflater, ViewGroup container,
        Bundle savedInstanceState) {

    View v = inflater.inflate(R.layout.fragment, null);
    TextView tv = (TextView) v.findViewById(R.id.msg);
    tv.setText("Fragment " + (index + 1));

    return v;


Just notice that we pass the fragment index using arguments bundle (line 2,3).Now we have our fragment we have simply to implement the listener.

Tab listener

We can make our Activity implements the listener so that when user selects a tab we show the relative fragment.

public class MainActivity extends Activity implements TabListener {

    public void onTabSelected(Tab tab, FragmentTransaction ft) {
        Fragment f = null;
        TabFragment tf = null;

        if (fragList.size() > tab.getPosition())

        if (f == null) {
            tf = new TabFragment();
            Bundle data = new Bundle();
            data.putInt("idx",  tab.getPosition());
            tf = (TabFragment) f;

        ft.replace(android.R.id.content, tf);


    public void onTabUnselected(Tab tab, FragmentTransaction ft) {
        if (fragList.size() > tab.getPosition()) {


TabListener has several methods we have to override. The most important is onTabSelected that is called when user selects a tab. In this method first we check if we have our fragment in the fragment list (line 9-10), if so we reuse it and show the fragment (see line 20). If not, we create our fragment line (12-18) and add it to our fragment list. At the end (line 22), we simply replace the UI content (android.R.id.content) with the right fragment. The result is shown below:



Reference: Android Action Bar with Tab from our JCG partner Francesco Azzola at the Surviving w/ Android blog.

Do you want to know how to develop your skillset to become a Java Rockstar?

Subscribe to our newsletter to start Rocking right now!

To get you started we give you our best selling eBooks for FREE!

1. JPA Mini Book

2. JVM Troubleshooting Guide

3. JUnit Tutorial for Unit Testing

4. Java Annotations Tutorial

5. Java Interview Questions

6. Spring Interview Questions

7. Android UI Design

and many more ....

9 Responses to "Android Action Bar with Tab"

  1. Rajesh says:

    HI ,
    I need full source code, can u please send it..

  2. Sagar Mundhe says:

    Thank you for sharing your source code…

  3. Vikram says:

    How do i add the the tab bar at the bottom….

  4. Jon says:

    Um, I think your code for TabListener is way off.

    Fragment f = null;
    TabFragment tf = null;

    if (fragList.size() > tab.getPosition())

    if (f == null) {

    ‘f’ will literally always equal null.

  5. Mahmoud ELshamy says:

    Thanks very much.
    It is very simple and clear, you have really helped me

  6. Sushant Kaura says:

    Hi , Thank you for the great tutorial.

    What if I want to add a button on layout of fragment 1 that takes me to fragment 3. How can I achieve this? Thank you for your help.

    Sushant Kaura

Leave a Reply

nine − 4 =

Java Code Geeks and all content copyright © 2010-2015, Exelixis Media Ltd | Terms of Use | Privacy Policy | Contact
All trademarks and registered trademarks appearing on Java Code Geeks are the property of their respective owners.
Java is a trademark or registered trademark of Oracle Corporation in the United States and other countries.
Java Code Geeks is not connected to Oracle Corporation and is not sponsored by Oracle Corporation.
Do you want to know how to develop your skillset and become a ...
Java Rockstar?

Subscribe to our newsletter to start Rocking right now!

To get you started we give you two of our best selling eBooks for FREE!

Get ready to Rock!
You can download the complementary eBooks using the links below: