Creating Tabs using Fragments

    Tabs are excellent way to provide user access to multiple functionality very easily. Tabs were earlier implemented  with multiple activity inside one activity however with Honeycomb(thats long time back) Android discourages use of Activity inside Activity.

    With HoneyComb Android Sdk introduced Fragment .Fragments are very powerful part of Android SDK. Fragment is UI component that provides better control.They provide more modular control of different functionality inside Activity.

     However to provide backwards compatibility you can use Compatibility Package .

The primary classes related to fragments are:

• android.support.v4.app.FragmentActivity

The base class for all activities using compatibility-based fragment (and loader) features

• android.support.v4.app.Fragment

The base class for all fragment definitions

• android.support.v4.app.FragmentManager 

The class for interacting with fragment objects inside an activity

• android.support.v4.app.FragmentTransaction

The class for performing an atomic set of fragment operations

Now lets start with our example,
We will create Application with two Tabs. So for each tab we will need two Fragment.

here is our sample fragment

import android.support.v4.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

public class FragmentA extends Fragment {

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
        Bundle savedInstanceState) {
      TextView textView=new TextView(getActivity());
      textView.setText("Hello I am fragment A");
      return textView;
   }
}

Similarly we can have FragmentB. Now we create our Activity that will be our tab container.For using Fragments inside Activity we must extend FragmentActivity.

import android.support.v4.app.FragmentActivity;
//Some more imports

public class MainActivity extends FragmentActivity {
      //More code to come later

Now its time for layout of our Activity

<tabhost  xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/tab_activity_bg" >


    <linearlayout 
 
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

        <tabwidget android:id="@android:id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0"
            android:orientation="horizontal" />



        <framelayout 
            android:id="@android:id/tabcontent" 
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_weight="0" />


        <framelayout android:id="@+android:id/realtabcontent" 
           android:layout_width="match_parent" 
           android:layout_height="0dp"
           android:layout_weight="1" />
           </tabwidget>
      </linearlayout>
</tabhost>

Please note the android:id it must be the same Now back to our Activity

    TabHost mTabHost;
    TabManager mTabManager;

    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mTabHost = (TabHost) findViewById(android.R.id.tabhost);
        mTabHost.setup();
        mTabManager = new TabManager(this, mTabHost, R.id.realtabcontent);
        setTabView();

        mTabManager.addTab(
             mTabHost.newTabSpec("tabA").setIndicator(TabAText),
             FragmentA.class, null);
        mTabManager.addTab(
             mTabHost.newTabSpec("tabB").setIndicator(TabBText),
             FragmentB.class, null);

Here TabManager mTabManager is only thing that we will we discussing
TabManager will manage our tabs for us.

    
import java.util.HashMap;

import android.content.Context;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentTransaction;
import android.view.View;

import android.widget.TabHost;
import android.widget.TabHost.OnTabChangeListener;

public class TabManager implements OnTabChangeListener {

    private final FragmentActivity mActivity;
    private final TabHost mTabHost;
    private final int mContainerId;
    private final HashMap mTabs = new  
             HashMap();
    TabInfo mLastTab;

   static final class TabInfo {
       private final String tag;
       private final Class clss;
       private final Bundle args;
       private Fragment fragment;

       TabInfo(String _tag, Class _class, Bundle _args) {
           tag = _tag;
           clss = _class;
           args = _args;
       }

   }

  static class DummyTabFactory implements TabHost.TabContentFactory {
  private final Context mContext;

   public DummyTabFactory(Context context) {
       mContext = context;
   }

   public View createTabContent(String tag) {
       View v = new View(mContext);
       v.setMinimumWidth(0);
       v.setMinimumHeight(0);
       return v;
  }

 }

  public TabManager(FragmentActivity activity, TabHost tabHost,
   int containerId) {
      mActivity = activity;
      mTabHost = tabHost;
      mContainerId = containerId;
      mTabHost.setOnTabChangedListener(this);
 }

  public void addTab(TabHost.TabSpec tabSpec, Class clss, Bundle args) {
      tabSpec.setContent(new DummyTabFactory(mActivity));
      String tag = tabSpec.getTag();

      TabInfo info = new TabInfo(tag, clss, args);

  // Check to see if we already have a fragment for this tab,probably
  // from a previously saved state. If so, deactivate it, because our
  // initial state is that a tab isn't shown.

      info.fragment = mActivity.getSupportFragmentManager().findFragmentByTag(tag);
      if (info.fragment != null && !info.fragment.isDetached()) {
          FragmentTransaction ft = mActivity.getSupportFragmentManager().beginTransaction();
          ft.detach(info.fragment);
          ft.commit();
      }

      mTabs.put(tag, info);
      mTabHost.addTab(tabSpec);
 }

  public void onTabChanged(String tabId) {
      TabInfo newTab = mTabs.get(tabId);
      if (mLastTab != newTab) {
      FragmentTransaction ft = mActivity.getSupportFragmentManager().beginTransaction();
      if (mLastTab != null) {
          if (mLastTab.fragment != null) {
              ft.detach(mLastTab.fragment);
          }
      }
      if (newTab != null) {
          if (newTab.fragment == null) {
              newTab.fragment = Fragment.instantiate(mActivity,newTab.clss.getName(),newTab.args);
              ft.add(mContainerId, newTab.fragment, newTab.tag);
          } else {
              ft.attach(newTab.fragment);
          }
      }
      mLastTab = newTab;
      ft.commit();
      mActivity.getSupportFragmentManager().executePendingTransactions();
  }
 }
}