An example of how to create tabs within a fragment?

Question

I am trying to create tabs within a fragment. I have a fragment named "Food_layout.xml"

here is the xml file.

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

    <TextView
        android:text="Food Layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_marginLeft="149dp"
        android:layout_marginStart="149dp"
        android:layout_marginTop="199dp"
        android:id="@+id/textView3" />

</RelativeLayout>

Here is the java class for the fragment

package com.example.crims.plfitness;

import android.app.Fragment;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class FoodFragment extends Fragment{
    View myView;

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        myView = inflater.inflate(R.layout.food_layout, container, false);
        return myView;
    }
}

I tried adding a TabHost but when I run the program it was not displayed. I was told I need to use a child fragment manager. I looked into it but I really did not find anything on how to implement it. I am new to android development.

http://stackoverflow.com/questions/20469877/adding-tab-inside-fragment-in-android http://stackoverflow.com/questions/25479980/creating-tabs-inside-fragment http://stackoverflow.com/questions/23988654/how-to-add-tab-inside-fragment-in-android http://stackoverflow.com/questions/34778063/viewpager-tabs-fragment-normal-fragments http://stackoverflow.com/questions/34428511/tablayout-with-viewpager-not-working-inside-fragment-android http://stackoverflow.com/questions/35058819/android-tablayout-inside-fragment — Mike M., Dec 20 '16 at 06:53
do the same way as if you added it to Activity, but everywhere, where you'd write `getSupportFragmentManager()` write `getChildFragmentManager()` instead — Vladyslav Matviienko, Dec 20 '16 at 06:53
@RuchaBhatt An example of how to add tabs inside of a fragment as stated in the heading. — crims, Dec 20 '16 at 06:57
@MikeM. I saw those previously, they did not help much I will look over them again. Maybe i learned some things since i last saw them. — crims, Dec 20 '16 at 06:58

score 1 · Answer 1 · answered Dec 20 '16 at 06:54

I done this way, This fragment contains two tabs as you can see.(With Adapter)

public class TabFragment extends Fragment {

public static TabLayout tabLayout;
public static ViewPager viewPager;
public static int int_items = 2;

@Nullable
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    /**
     *Inflate tab_layout and setup Views.
     */
        View x =  inflater.inflate(R.layout.tab_layout,null);
        tabLayout = (TabLayout) x.findViewById(R.id.tabs);
        viewPager = (ViewPager) x.findViewById(R.id.viewpager);

    /**
     *Set an Apater for the View Pager
     */
    viewPager.setAdapter(new MyAdapter(getChildFragmentManager()));


    /**
     * Now , this is a workaround ,
     * The setupWithViewPager dose't works without the runnable .
     * Maybe a Support Library Bug .
     */

    tabLayout.post(new Runnable() {
        @Override
        public void run() {
                tabLayout.setupWithViewPager(viewPager);
               }
    });

    return x;

}

class MyAdapter extends FragmentPagerAdapter{

    public MyAdapter(FragmentManager fm) {
        super(fm);
    }

    /**
     * Return fragment with respect to Position .
     */

    @Override
    public Fragment getItem(int position)
    {
      switch (position){
          case 0: return new Fragment1();
          case 1 : return new Fragment2();

      }
    return null;
    }

    @Override
    public int getCount() {

        return int_items;

    }

    /**
     * This method returns the title of the tab according to the position.
     */

    @Override
    public CharSequence getPageTitle(int position) {

        switch (position){
            case 0 :
                return "frg1";
            case 1 :
                return "frg2";

        }
            return null;
    }
}

}

Here is the layout of the TabFragment.

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

<android.support.design.widget.TabLayout
    android:id="@+id/tabs"
    app:tabGravity="fill"
    app:tabMode="fixed"
    android:background="@color/green_1"
    app:tabIndicatorColor="@color/green_1"
    app:tabSelectedTextColor="@color/white"
    app:tabTextColor="@color/green_2"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
</android.support.design.widget.TabLayout>

<android.support.v4.view.ViewPager
    android:id="@+id/viewpager"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

</android.support.v4.view.ViewPager>

You can add your Fragment

thank you. I am slightly confused by the "TabFragment" is that the java file of the fragment? i.e. would that be my "FoodFragment.java"? — crims, Dec 20 '16 at 07:01
The `TabFragment` is the one in which you want to add two `Fragments`/`Tab`. — Devendra Singh, Dec 20 '16 at 07:06
I am still having problems with the java file. setAdapter (android.support.v4.view.PagerAdapter) in ViewPager cannot be applied to (com.example.crims.plfitness.FoodFragment.MyAdapter) — crims, Dec 20 '16 at 09:41

An example of how to create tabs within a fragment?

1 Answers1