Cant see tablayout with viewpager

Question

this my code to link tablayout with viewpager it was working fine but now it is not working i am unable to see tab layout in my device can any one tell what is causing this problem i think my code is right

<android.support.design.widget.CoordinatorLayout 
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/arootLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.blipclap.creativegraphy.HomeActivity"
tools:showIn="@layout/app_bar_home">

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@android:color/white">

    <android.support.design.widget.TabLayout
        android:id="@+id/tabLayout"
        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"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        android:layout_below="@+id/tabLayout"> 
</android.support.v4.view.ViewPager>

</RelativeLayout>

    <android.support.design.widget.BottomNavigationView
        android:id="@+id/navigation"
        android:layout_gravity="bottom"
        app:layout_behavior=".Helper.BottomNavigationBehaviour"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:background="@color/colorPrimary"
        app:itemIconTint="@android:color/background_dark"
        app:itemTextColor="@android:color/background_dark"
        app:menu="@menu/bottom_navigation_menu"> 
</android.support.design.widget.BottomNavigationView>


</android.support.design.widget.CoordinatorLayout>

over here i have may adapter

public class MyFragmentAdapter extends FragmentPagerAdapter {

    private Context context;

    public MyFragmentAdapter(FragmentManager fm, Context context) {
        super(fm);
        this.context = context;
    }

    @Override
    public Fragment getItem(int position) {
        if (position == 0)
            return CategoryFragment.getInstance();
        else if (position == 1)
            return TrendingFragment.getInstance();
        else if (position == 2)
            return RecentsFragment.getInstance(context);
        else
            return null;
    }

    @Override
    public int getCount() {
        return 3;
    }

    @Override
    public CharSequence getPageTitle(int position) {
        switch (position) {
            case 0:
                return "Category";
            case 1:
                return "Trending";
            case 2:
                return "Recents";
        }
        return "";
    }}

this is activity code i used

 viewPager = (ViewPager)findViewById(R.id.viewPager);
            MyFragmentAdapter adapter = new 
 MyFragmentAdapter(getSupportFragmentManager(), this);
            viewPager.setAdapter(adapter);

            tabLayout = (TabLayout) findViewById(R.id.tabLayout);
            tabLayout.setupWithViewPager(viewPager);

this is the screenshot as you can see i am unable to see tab layout in my phone can any help what is the problem

my layout uses bottom navigation behavior so coordinate layout is necessary and bottom navigation need to be out has it should be child of coordinator layout

I figured out tab layout is hidden behind the app bar

<android.support.constraint.ConstraintLayout 
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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.blipclap.creativegraphy.HomeActivity">

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.AppBarOverlay">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:popupTheme="@style/AppTheme.PopupOverlay"
        app:theme="@style/ToolbarColoredBackArrow" />

</android.support.design.widget.AppBarLayout>

<include layout="@layout/content_home" />


</android.support.constraint.ConstraintLayout>

Try taking `TabLayout` out of the `RelativeLayout`, or better, delete the `RelativeLayout` and put `LinearLayout` instead of `CoordinatorLayout` — Suleyman, May 27 '18 at 16:11
not working i cant change coordinator has you can see i am using helper class but i changed relative layout it say linearlayout is not valid layout — vinit, May 27 '18 at 16:44
i have edited the question has you can see my layout is included in app_bar_layout can i use android:layout_below="@+id/" — vinit, May 27 '18 at 20:27
I don't think you can use `android:layout_below` because it's a `ConstraintLayout` you need to rearrange your constraints, or just try replacing `CoordinatorLayout` with `LinearLayout` — Suleyman, May 27 '18 at 20:34
i solved the problem has i saw tab layout was there so i just added android:layout_marginTop="?attr/actionBarSize" worked for me — vinit, May 27 '18 at 21:02

score 0 · Answer 1 · answered May 27 '18 at 16:15

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/arootLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:background="@android:color/white"
        android:orientation="vertical">

        <android.support.design.widget.TabLayout
            android:id="@+id/tabLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />

        <android.support.v4.view.ViewPager
            android:id="@+id/viewPager"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_below="@+id/tabLayout"
            android:layout_weight="1"
            app:layout_behavior="@string/appbar_scrolling_view_behavior" />

    </LinearLayout>

    <android.support.design.widget.BottomNavigationView
        android:id="@+id/navigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/colorPrimary"
        app:itemIconTint="@android:color/background_dark"
        app:itemTextColor="@android:color/background_dark"
        app:layout_behavior=".Helper.BottomNavigationBehaviour"
        app:menu="@menu/bottom_navigation_menu" />

</LinearLayout>

not working i cant change coordinator has you can see i am using helper class but i changed relative layout it say not valid layout — vinit, May 27 '18 at 16:42
Which helper class, you can modify the helper class according to you. If helper class was related to this question, then you should have posted that along with question too. — Khemraj Sharma, May 27 '18 at 16:46
[bottom navigation behavior](https://stackoverflow.com/questions/50495852/when-scroll-bottom-navigation-bar-does-not-hide-bottomnavigationbehavior/50506149?noredirect=1#comment88117464_50506149) it only works for coordinator layout — vinit, May 27 '18 at 17:09
Okay okay, you are using bottom navigation behaviour, wait i edit my answer for your solution. — Khemraj Sharma, May 27 '18 at 17:10
i have edited the question has you can see my layout is included in app_bar_layout can i use android:layout_below="@+id/" — vinit, May 27 '18 at 20:27

score 0 · Answer 2 · answered May 27 '18 at 17:30

try this it will help you

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
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/arootLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <android.support.design.widget.TabLayout
        android:id="@+id/tab_host"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@android:color/holo_red_light"> 
   </android.support.design.widget.TabLayout>
    <android.support.v4.view.ViewPager
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@id/tab_host"
        android:layout_above="@id/design_navigation_view"> 
   </android.support.v4.view.ViewPager>
    <android.support.design.widget.BottomNavigationView
        android:id="@+id/design_navigation_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:background="@android:color/darker_gray"> 
   </android.support.design.widget.BottomNavigationView>
    </RelativeLayout>

i have edited the question has you can see my layout is included in app_bar_layout can i use android:layout_below="@+id/" — vinit, May 27 '18 at 20:28

score 0 · Accepted Answer · answered May 27 '18 at 21:09

solution for this is

     <android.support.design.widget.TabLayout
            android:id="@+id/tabLayout"
android:layout_marginTop="?attr/actionBarSize"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />

tab layout was actually under appbar so i just

Cant see tablayout with viewpager

3 Answers3