Why this tab layout doesn't stay in the bottom?

Question

I've created my application with Navigation Drawer. In my Activity I put this code:

public class MenuActivity extends AppCompatActivity
implements NavigationView.OnNavigationItemSelectedListener
{

 protected void onCreate(Bundle savedInstanceState)
 {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_menu);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);

DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close)
{
    public void onDrawerOpened(View view)
    {
        super.onDrawerOpened(view);
    }
    public void onDrawerClosed(View v)
    {
        super.onDrawerClosed(v);
    }
};
drawer.setDrawerListener(toggle);
toggle.syncState();

NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
onNavigationItemSelected(navigationView.getMenu().getItem(0));
navigationView.setNavigationItemSelectedListener(this);
}

 public boolean onCreateOptionsMenu(Menu menu) {

 getMenuInflater().inflate(R.menu.menu, menu);
return true;
}

public boolean onOptionsItemSelected(MenuItem item) 
{
int id = item.getItemId();

if (id == R.id.action_settings) 
{
    return true;
}

 return super.onOptionsItemSelected(item);
}


 public boolean onNavigationItemSelected(MenuItem item) {

  Fragment fragment = null;
   String title = null;
int id = item.getItemId();
Class fragmentClass=null;

if (id == R.id.Home)
{
  fragmentClass = HomeFragment.class;
  title="Home";

}
else if (id == R.id.Profile)
{
  fragmentClass= ProfileFragment.class;
  title="Profile";
}
try {
    fragment = (Fragment) fragmentClass.newInstance();
} catch (InstantiationException e) {

    e.printStackTrace();
} catch (IllegalAccessException e) {
    e.printStackTrace();
}


FragmentManager fragmentManager = getSupportFragmentManager();
fragmentManager.beginTransaction().replace(R.id.content_frame,      fragment).commit();


if (getSupportActionBar() != null)
{
    getSupportActionBar().setTitle(title);
}

DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
drawer.closeDrawer(GravityCompat.START);


return true;
}

now in the HomeFragment I want to put a tab in the bottom of the screen. So i put this code:

public class HomeFragment extends Fragment {


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

public void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);

}


public View onCreateView(LayoutInflater inflater, ViewGroup       container, Bundle savedInstanceState) {

View inflatedView = inflater.inflate(R.layout.fragment_home, null);


tabLayout = (TabLayout) inflatedView.findViewById(R.id.tabs);
viewPager = (ViewPager) inflatedView.findViewById(R.id.viewpager);


viewPager.setAdapter(new MyAdapter(getChildFragmentManager()));


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

return inflatedView;

 }

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 SearchFragment();
        case 1 : return new CardFragment();
        case 2 : return new MapFragment();
    }
    return null;
}

public int getCount() {

    return int_items;

}

This is fragment_home.xml:

 <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    tools:context=".HomeFragment">
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:orientation="vertical"
    android:layout_height="wrap_content">

    <android.support.design.widget.TabLayout
        android:id="@+id/tabs"
        app:tabGravity="fill"
        app:tabMode="fixed"
        android:background="@color/material_blue_grey_800"
        app:tabIndicatorColor="@color/black_overlay"
        app:tabSelectedTextColor="#000"
        app:tabTextColor="#FFFFFF"
        android:layout_gravity="bottom"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true">
    </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:layout_above="@+id/tabs">

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

    </RelativeLayout>
</FrameLayout>

and this the activity xml:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:openDrawer="start">

    <include
        layout="@layout/app_bar_menu"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <FrameLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/containerView">
    </FrameLayout>


    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:headerLayout="@layout/nav_header_menu"
        app:menu="@menu/activity_menu_drawer" />


</android.support.v4.widget.DrawerLayout>

But finally I get this result:

How could I put this tabLayout in the toolbar?

Answer 1

You don't need to take frame layout for fragment_home as root layout. Simplify your xml file as:

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:orientation="vertical"
    android:layout_height="wrap_content">

    <android.support.design.widget.TabLayout
        android:id="@+id/tabs"
        app:tabGravity="fill"
        app:tabMode="fixed"
        android:background="@color/material_blue_grey_800"
        app:tabIndicatorColor="@color/black_overlay"
        app:tabSelectedTextColor="#000"
        app:tabTextColor="#FFFFFF"
        android:layout_gravity="bottom"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true">
    </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:layout_above="@+id/tabs">

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

    </RelativeLayout>