How to Create ActionBar Tabs with Fragments in Android

In Android  |  Last Updated on Sun, 08 May 2016

Hi , Today I am going to share How to Make ActionBar Tabs with Fragment, it give you clear concept of making How to create Tabs using Fragment having  Actionbar .   ActioBarTab Application helps  you to navigate to different menu of a Android Application


Prerequisites:
 

• JDK 6.0 or above
• Android Studio

Steps to follow:  
 

1. Create a New Android Studio project name ActionBarTabDemo.
2. Select minimum  API level 14 so it will run Maximum of Android device that are Active on google Play then click next.
3. Select Blank Activity and your Activity name is MainActivity click next > click finish.
4. Inside MainActivity Class write the following code:

 

 public class MainActivity extends Activity {
 /** Called when the activity is first created. */
 @Override
 public void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);

 ActionBar action = getActionBar();
 action.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
 action.setDisplayShowTitleEnabled(true);
 Tab tab = action.newTab()
 .setText("facebook")
 .setTabListener(new CustomTabListener<Fragment1>(this,"facebook",Fragment1.class))
 .setIcon(R.drawable.facebook);
  action.addTab(tab);
                
  tab = action.newTab()
 .setText("youtube")
 .setTabListener(new CustomTabListener<Fragment2>(this, "youtube", Fragment2.class))
 .setIcon(R.drawable.youtube);
  action.addTab(tab);       
 }
 }

 

 5. MainActivity  will ask you to  Create   Fragment1.java and  Fragment2 .java  class . Inside Fragment1.java    class
 Write the following  code.
 

public class Fragment1 extends ListFragment{
 String country[] = new String[]{
"USA", "INDIA", "AUSTRALIA", "ENGLAND", "MEXICO", "GERMANY",
};
 /* (non-Javadoc)
* @see android.app.ListFragment#onCreateView(android.view.LayoutInflater,android.view.ViewGroup,              android.os.Bundle) */

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// TODO Auto-generated method stub
ArrayAdapter<String> adapter = new ArrayAdapter<String>(getActivity().getBaseContext(),       android.R.layout.simple_list_item_multiple_choice,country);
setListAdapter(adapter);
return super.onCreateView(inflater, container, savedInstanceState);
}
/* (non-Javadoc)
* @see android.app.Fragment#onStart() */

 @Override
public void onStart() {
// TODO Auto-generated method stub
super.onStart();
getListView().setChoiceMode(ListView.CHOICE_MODE_MULTIPLE);
}
}
 

 


6. Inside  Fragment2.java  class write the following code
 

 public class Fragment2 extends ListFragment{
 String country1[] = new String[]{
 "USA", "INDIA", "CANADA","PAKISTAN","RUSSIA","NEWZELAND",
 };
 /* (non-Javadoc)
* @see android.app.ListFragment#onCreateView(android.view.LayoutInflater, android.view.ViewGroup,      android.os.Bundle)
*/
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// TODO Auto-generated method stub
 ArrayAdapter<String> adapter = new ArrayAdapter<String>(getActivity().getBaseContext(),     android.R.layout.simple_list_item_multiple_choice,country1);
setListAdapter(adapter);
return super.onCreateView(inflater, container, savedInstanceState);
}
 /* (non-Javadoc)
* @see android.app.Fragment#onStart() */
@Override
public void onStart() {
 // TODO Auto-generated method stub
super.onStart();
getListView().setChoiceMode(ListView.CHOICE_MODE_MULTIPLE);
}
}
 

 7. And  you  will be asked to create  CustomTabListener.Java  class . write  down the following
 

 public class CustomTabListener<T extends Fragment> implements TabListener {
 private Fragment fragment;
 private final Activity mActivity;
 private final String mTag;
 private final Class<T> mClass;
 public CustomTabListener(Activity activity, String tag,Class<T> clz) {
 // TODO Auto-generated constructor stub
 mActivity = activity;
 mTag = tag;
 mClass = clz;
 }
 @Override
public void onTabReselected(Tab tab, FragmentTransaction ft) {
// TODO Auto-generated method stub
}
 @Override
public void onTabSelected(Tab tab, FragmentTransaction ft) {
if(fragment==null){
fragment= Fragment.instantiate(mActivity,mClass.getName());
ft.add(android.R.id.content, fragment,mTag);
 }else{
ft.attach(fragment);
}
}
 @Override
public void onTabUnselected(Tab tab, FragmentTransaction ft) {
// TODO Auto-generated method stub
if(fragment!=null){
ft.detach(fragment);
 }
}
}

 

8. Inside drawable  folder  write create facebook.xml file and write the following code
 

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
 <item
  android:state_selected="true"
  android:state_pressed="false"
  android:drawable="@drawable/facebook_selected"
 />
 <item
  android:drawable="@drawable/facebook_unselected" />
 </selector>
 

 


 9.inside drawable  folder  write create youtube.xml file and write the following code.
 

<?xml version="1.0" encoding="utf-8"?>
 <selector xmlns:android="http://schemas.android.com/apk/res/android">
 <item
  android:state_selected="true"
  android:state_pressed="false"
  android:drawable="@drawable/youtube_selected" />
 <item
android:drawable="@drawable/youtube_unselected" />
</selector>