Tab with ListView

In this sample we are going to create an application which includes two tabs under with two custom listview for each tabs.

import android.app.TabActivity;
import android.content.Intent;
import android.content.res.TypedArray;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ListView;
import android.widget.TabHost;

public class TabListActivity extends TabActivity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.homescreen);
     
        TabHost mTabHost = getTabHost();
     
        final ListView one=(ListView)findViewById(R.id.listOne);
        final ListView two=(ListView)findViewById(R.id.listTwo);
     
        String[] listItemsone = new String[] {"one","two","three"};
        String[] listItemstwo = new String[] {"A","B","C"};
     
//Typed array which contains array values be stored in an separate xml file
        TypedArray itemsOneIcons = getResources().obtainTypedArray(R.array.listOneicons);
        TypedArray itemsTwoIcons = getResources().obtainTypedArray(R.array.listTwoicons);
       
         one.setAdapter(new ImageAndTextAdapter(getApplicationContext(), R.layout.listrow, listItemsone, itemsOneIcons));
         two.setAdapter(new ImageAndTextAdapter(getApplicationContext(), R.layout.listrow, listItemstwo, itemsTwoIcons));
     
        mTabHost.addTab(mTabHost.newTabSpec("tab_test1").setIndicator("Tab1").setContent(R.id.tab1));
mTabHost.addTab(mTabHost.newTabSpec("tab_test2").setIndicator("Tab ").setContent(R.id.tab2));
     
        //Used to reduce the height of the Tabs
        mTabHost.getTabWidget().getChildAt(0).getLayoutParams().height /=2;
        mTabHost.getTabWidget().getChildAt(1).getLayoutParams().height /=2;   
  
        mTabHost.setCurrentTab(0);   
         one.setOnItemClickListener(new OnItemClickListener() {
            public void onItemClick(AdapterView<?> myAdapter, View myView, int myItemInt, long mylng) {
           //Used to get selected Item
              String selectedFromList = (String) ( one.getItemAtPosition(myItemInt));           
             //Navigation
              Intent  selectedItem  = new Intent (CurrentActivity, Navigation Activity);
              //Sending value to next screen
               selectedItem.putExtra("Choice", selectedFromList);
              startActivity( selectedItem);
            }              
      }
        );     
         two.setOnItemClickListener(new OnItemClickListener() {
            public void onItemClick(AdapterView<?> myAdapter, View myView, int myItemInt, long mylng) {

                //Used to get selected Item
              String selectedFromList = (String) ( two.getItemAtPosition(myItemInt));
                //Navigation
               Intent  selectedItem  = new Intent (CurrentActivity, Navigation Activity);
              //Sending value to next screen
               selectedItem.putExtra("Choice", selectedFromList);
              startActivity( selectedItem);
            }              
      }
        );
    }
}

Custom Image and Text List adapter

import android.content.Context;
import android.content.res.TypedArray;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.TextView;

public class ImageAndTextAdapter extends ArrayAdapter<String> {

private LayoutInflater mInflater;
private String[] mStrings;
private TypedArray mIcons;
private int mViewResourceId;

public ImageAndTextAdapter(Context ctx, int viewResourceId,
String[] strings, TypedArray icons) {
super(ctx, viewResourceId, strings);

mInflater = (LayoutInflater)ctx.getSystemService(
Context.LAYOUT_INFLATER_SERVICE);

mStrings = strings;
mIcons = icons;
mViewResourceId = viewResourceId;
}

@Override
public int getCount() {
return mStrings.length;
}

@Override
public String getItem(int position) {
return mStrings[position];
}

@Override
public long getItemId(int position) {
return 0;
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {
convertView = mInflater.inflate(mViewResourceId, null);

ImageView iv = (ImageView)convertView.findViewById(R.id.option_icon);
iv.setImageDrawable(mIcons.getDrawable(position));

TextView tv = (TextView)convertView.findViewById(R.id.option_text);
tv.setText(mStrings[position]);

return convertView;
}
}

homescreen.xml file

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    android:background="@drawable/quickkal" >
 
 <RelativeLayout
        android:id="@+id/home_header"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:background="@drawable/background_gradient"
         >
        <Button
            android:id="@+id/map_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_alignParentTop="true"
            android:layout_margin="5dp"          
            android:padding="5dp"
            android:text="Map"
            android:textColor="#fff"
            android:background="@drawable/btn_custom" />     
        <ImageView
      android:id="@+id/maestro_header"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_alignParentTop="true"
      android:layout_centerHorizontal="true"
            android:layout_margin="5dp"
            android:src="@drawable/header"
      />
 </RelativeLayout>


<TabHost
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_margin="10dip"
    android:foreground="@null">
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">
        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:tabStripEnabled="false"/>
        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_marginTop="10dp">
         
            <ListView android:id="@+id/animals"
               android:layout_width="fill_parent"
               android:layout_height="wrap_content"
               android:background="#000000"
               android:layout_weight="1"
               android:drawSelectorOnTop="false"/>

        <ListView android:id="@+id/birds"
               android:layout_width="fill_parent"
               android:layout_height="wrap_content"
               android:background="#000000"
               android:layout_weight="1"
               android:drawSelectorOnTop="false"/>
       
        </FrameLayout>
    </LinearLayout>
</TabHost>

</LinearLayout>

Icons.xml file ------- Used to store typed array


<?xml version="1.0" encoding="utf-8"?>

<resources>
    <array name=" listTwoicons">
        <item>@drawable/icon</item>
        <item>@drawable/icon</item>
        <item>@drawable/icon</item>
     
    </array>
    <array name=" listOneicons">
        <item>@drawable/icon</item>
        <item>@drawable/icon</item>
        <item>@drawable/icon</item>
     
    </array>
</resources>

listrow.xml file

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView
android:id="@+id/option_icon"
android:layout_width="48dp"
android:layout_height="fill_parent"/>
<TextView
  android:id="@+id/option_text"
   android:layout_width="fill_parent"
   android:layout_height="fill_parent"
   android:padding="10dp"
   android:textSize="16dp" >
</TextView>
</LinearLayout>