Hello Guys.Today we discuss about Simple Clickable Android  tabs with ListViews.Suitable for beginners. If you would do with more explanations then what about our video here :

SECTION 1 : Our MainActivity

package com.tutorials.tabswithlistview;

import android.app.ActionBar;
import android.app.ActionBar.Tab;
import android.app.FragmentTransaction;
import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.view.Menu;

public class MainActivity extends FragmentActivity implements ActionBar.TabListener {

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

       //GET AND SETUP ACTIONBAR
        final ActionBar ab=getActionBar();
        ab.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);

      //ADD THE TABS
        ab.addTab(ab.newTab().setText("Man Utd").setTabListener(this));
        ab.addTab(ab.newTab().setText("Chelsea").setTabListener(this));
        ab.addTab(ab.newTab().setText("Arsenal").setTabListener(this));
    }

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

  @Override
  public void onTabReselected(Tab arg0, FragmentTransaction arg1) {
    // TODO Auto-generated method stub

  }

  @Override
  public void onTabSelected(Tab tab, FragmentTransaction ft) {
    // TODO Auto-generated method stub

    //FIRST TAB SHOW MAN UTD
    if(tab.getPosition()==0)
    {
      ManUtdFragment mu=new ManUtdFragment();
      getSupportFragmentManager().beginTransaction().replace(R.id.container, mu).commit();
    }else if(tab.getPosition()==1)
    {
       ChelseaFragment c=new ChelseaFragment();
       getSupportFragmentManager().beginTransaction().replace(R.id.container, c).commit();
    }else if(tab.getPosition()==1)
    {
       ArsenalFragment a=new ArsenalFragment();
       getSupportFragmentManager().beginTransaction().replace(R.id.container, a).commit();
    }

  }

  @Override
  public void onTabUnselected(Tab arg0, FragmentTransaction arg1) {
    // TODO Auto-generated method stub

  }
}

SECTION 2 : Our Fragments

Man Utd Fragment

To display man utd players.

package com.tutorials.tabswithlistview;

import android.os.Bundle;
import android.support.v4.app.ListFragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ListAdapter;
import android.widget.ListView;
import android.widget.Toast;

public class ManUtdFragment  extends ListFragment{

    String[] players={"Ander Herera","Wayne Rooney","David DeGea","Robin Van Persie",
            "Juan Mata","Michael Carrick","Chris Smalling","Phil Jones"};

  @Override
  public View onCreateView(LayoutInflater inflater, ViewGroup container,
      Bundle savedInstanceState) {
    // TODO Auto-generated method stub
    View rootView=inflater.inflate(R.layout.manu, container,false);

    //CREATE ADAPTER AND SET IT TO LV
    ListAdapter adapter=new ArrayAdapter<String>(getActivity(), android.R.layout.simple_list_item_1,players);
    setListAdapter(adapter);

    return rootView;
  }

  @Override
  public void onListItemClick(ListView l, View v, int position, long id) {
    // TODO Auto-generated method stub

        Toast.makeText(getActivity(), getListView().getItemAtPosition(position).toString(), Toast.LENGTH_SHORT).show();
  }

}

Chelsea Fragment

Will display Chelsea Players in a ListFragment.

We have a string array which will populate our ListView which will define in thechelsea.xml layout.

package com.tutorials.tabswithlistview;

import android.os.Bundle;
import android.support.v4.app.ListFragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ListAdapter;
import android.widget.ListView;
import android.widget.Toast;

public class ChelseaFragment extends ListFragment {

  String[] players={"Thibout Courtouis","John Terry","Oscar","Eden Hazard","Diego Costa","Petr Cech",
         "Didier Drogba","Branislav Ivanovic"};

  @Override
  public View onCreateView(LayoutInflater inflater, ViewGroup container,
      Bundle savedInstanceState) {
    // TODO Auto-generated method stub
    View rootView=inflater.inflate(R.layout.chelsea, container,false);

    //CREATE ADAPTER AND SET IT TO LV
    ListAdapter adapter=new ArrayAdapter<String>(getActivity(), android.R.layout.simple_list_item_1,players);
    setListAdapter(adapter);

    return rootView;
  }

  @Override
  public void onListItemClick(ListView l, View v, int position, long id) {
    // TODO Auto-generated method stub

        Toast.makeText(getActivity(), getListView().getItemAtPosition(position).toString(), Toast.LENGTH_SHORT).show();
  }

}

Arsenal Fragment

This class will be deriving from ListFragment:

That ListFragment will render our Arsenal Players in a ListView. It will inflate the associated
arsenal layout.

package com.tutorials.tabswithlistview;

import android.os.Bundle;
import android.support.v4.app.ListFragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ListAdapter;
import android.widget.ListView;
import android.widget.Toast;

public class ArsenalFragment extends ListFragment {

  String[] players={"Aaron Ramsey","Jack Wilshere","Mesut Ozil","Alexis Sanchez",
      "Per Metesacker","Keiron Gibbs","Laurent Koscielny","Olivier Giroud"};

  @Override
  public View onCreateView(LayoutInflater inflater, ViewGroup container,
      Bundle savedInstanceState) {
    // TODO Auto-generated method stub
    View rootView=inflater.inflate(R.layout.arsenal, container,false);

    //CREATE ADAPTER AND SET IT TO LV
    ListAdapter adapter=new ArrayAdapter<String>(getActivity(), android.R.layout.simple_list_item_1,players);
    setListAdapter(adapter);

    return rootView;
  }

  @Override
  public void onListItemClick(ListView l, View v, int position, long id) {
    // TODO Auto-generated method stub

        Toast.makeText(getActivity(), getListView().getItemAtPosition(position).toString(), Toast.LENGTH_SHORT).show();
  }

}

SECTION 3  : Our Layouts

MainActivity Layout
Our main activity layout.

Basically empty.

<RelativeLayout 
    
    android_id="@+id/container"
    android_layout_width="match_parent"
    android_layout_height="match_parent"
    android_paddingBottom="@dimen/activity_vertical_margin"
    android_paddingLeft="@dimen/activity_horizontal_margin"
    android_paddingRight="@dimen/activity_horizontal_margin"
    android_paddingTop="@dimen/activity_vertical_margin"
    tools_context=".MainActivity" >

</RelativeLayout>

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 
    android_layout_width="match_parent"
    android_layout_height="match_parent"
    android_orientation="vertical" >

    <ListView
        android_id="@id/android:list"
        android_layout_width="match_parent"
        android_layout_height="wrap_content" >
    </ListView>

</LinearLayout>

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 
    android_layout_width="match_parent"
    android_layout_height="match_parent"
    android_orientation="vertical" >

    <ListView
        android_id="@id/android:list"
        android_layout_width="match_parent"
        android_layout_height="wrap_content" >
    </ListView>

</LinearLayout>

Man Utd Fragment Layout
Will display Man Utd data in a ListView.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 
    android_layout_width="match_parent"
    android_layout_height="match_parent"
    android_orientation="vertical" >

    <ListView
        android_id="@id/android:list"
        android_layout_width="match_parent"
        android_layout_height="wrap_content" >
    </ListView>

</LinearLayout>

Our Manifest
We specify our minimum sdk version.

<?xml version="1.0" encoding="utf-8"?>
<manifest 
    package="com.tutorials.tabswithlistview"
    android_versionCode="1"
    android_versionName="1.0" >

    <uses-sdk
        android_minSdkVersion="19"
        android_targetSdkVersion="19" />

    <application
        android_allowBackup="true"
        android_icon="@drawable/ic_launcher"
        android_label="@string/app_name"
        android_theme="@style/AppTheme" >
        <activity
            android_name="com.tutorials.tabswithlistview.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>

Best Regards.