How to make tablayout fixed below action bar?

Question

I have the following layout where I have an image slider above a tablayout:

But I want to have it fixed to top as shown in the following image:

This is my current code:

<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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"
android:scrollbars="none"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".MainActivity">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <com.daimajia.slider.library.SliderLayout
        android:id="@+id/slider"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        />

    <android.support.design.widget.TabLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/white"
        app:tabGravity="fill"
        android:layout_gravity="bottom"
        app:tabIndicatorColor="#000"
        app:tabMode="fixed"
        app:tabSelectedTextColor="@color/colorTextPrimary"
        app:tabTextColor="@color/colorTextDisable">

        <android.support.design.widget.TabItem
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="All"/>

        <android.support.design.widget.TabItem
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Casual"/>

        <android.support.design.widget.TabItem
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="WoMen"/>

        <android.support.design.widget.TabItem
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="New Jeans"/>

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

    <android.support.v4.view.ViewPager
        android:layout_width="match_parent"
        android:layout_height="800dp"/>

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/tablayout"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" >
    </android.support.v4.view.ViewPager>
</LinearLayout>

</ScrollView>

Answer 1

If you want to move your TabLayout up then you need to either make the visibilty of SliderLayout gone or set the height of SliderLayout to 0dp.

Use this below code it will fulfil your requirement as you want in second picture.

<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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"
    android:scrollbars="none"
    android:id="@+id/scrollView"
>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <com.daimajia.slider.library.SliderLayout
            android:id="@+id/slider"
            android:layout_width="match_parent"
            android:layout_height="200dp" //set this value to 0dp or set the visibilty GONE HERE(if you just want to hide visibilty)
            />

        <android.support.design.widget.TabLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            app:tabGravity="fill"
            app:tabIndicatorColor="#000"
            app:tabMode="fixed">

            <android.support.design.widget.TabItem
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="All" />

            <android.support.design.widget.TabItem
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="Casual" />


            <android.support.design.widget.TabItem
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="WoMen" />

            <android.support.design.widget.TabItem
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="New Jeans" />

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

        <android.support.v4.view.ViewPager
            android:layout_width="match_parent"
            android:layout_height="800dp" />

        <android.support.v4.view.ViewPager
            android:id="@+id/viewpager"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/tablayout"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"></android.support.v4.view.ViewPager>
    </LinearLayout>


</ScrollView>

and then do this Programatically

  scrollView.getViewTreeObserver().addOnScrollChangedListener(new ViewTreeObserver.OnScrollChangedListener() {
            @Override
            public void onScrollChanged() {
                if (scrollView != null) {
                    if (scrollView.getChildAt(0).getBottom() <= (scrollView.getHeight() + scrollView.getScrollY())) {
                        slider.setVisibility(View.VISIBLE);
                    }
                    else {
                        slider.setVisibility(View.GONE);
                    }
                }
            }
        });