hide tablayout of appbarlayout Android

Question

I have AppBarLayout with searchbar and tablayout inside coordinator layout. also below appbarlayout I have viewpager. Fragment inside view pager has scroll view. I want to scroll content till it's height also scroll AppBarLayout with it. if fragment has more content then it should scroll AppBarLayout out of view.

Below is my code

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout 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"
android:background="@color/purple"
android:orientation="vertical"
tools:context=".ui.BottomNavigationActivity">

<com.google.android.material.appbar.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/search_toolbar"
    android:background="@color/purple"
    android:elevation="0dp"
    android:fitsSystemWindows="true"
    android:layout_marginTop="@dimen/fragment_top_margin"
    android:paddingBottom="19dp"
    android:orientation="vertical"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

    <androidx.appcompat.widget.Toolbar
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true"
        app:layout_scrollFlags="scroll|enterAlways">

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

    </androidx.appcompat.widget.Toolbar>

    <com.google.android.material.tabs.TabLayout
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabRippleColor="@null"
        app:tabIndicatorColor="@null"
        app:tabTextAppearance="@style/TabTheme"
        app:tabSelectedTextColor="@android:color/white"
        app:tabTextColor="@color/whiteOpacity40"
        app:tabMode="fixed"
        app:tabGravity="fill"
        app:layout_scrollFlags="scroll|enterAlways"
        app:tabMaxWidth="0dp"
        app:tabPaddingStart="0dp"
        app:tabPaddingEnd="0dp">

    </com.google.android.material.tabs.TabLayout>
        </com.google.android.material.appbar.AppBarLayout>

<androidx.viewpager.widget.ViewPager
    android:id="@+id/pager"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/background_white_round_top_corners20"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

</androidx.coordinatorlayout.widget.CoordinatorLayout>

What happens is is scroll only searchbar bit not tablayout. how can I scroll tablayout as well. Also I have noticed that scroll overlaps status bar. I want scroll to happen below status bar like this - http://i.imgur.com/QHe92y7.gif

Answer 1

I am able to solve issue by moving margins and padding of AppBarLayout to Toolbar and TabLayout

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout 
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"
android:background="@color/purple"
android:orientation="vertical"
tools:context=".ui.BottomNavigationActivity">

<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/search_toolbar"
android:background="@color/purple"
android:elevation="0dp"
android:fitsSystemWindows="true"
android:orientation="vertical"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

<androidx.appcompat.widget.Toolbar
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:fitsSystemWindows="true"
    app:layout_scrollFlags="scroll|enterAlways"
    **android:layout_marginTop="@dimen/fragment_top_margin"**>

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

</androidx.appcompat.widget.Toolbar>

<com.google.android.material.tabs.TabLayout
    android:id="@+id/tabs"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:tabRippleColor="@null"
    app:tabIndicatorColor="@null"
    app:tabTextAppearance="@style/TabTheme"
    app:tabSelectedTextColor="@android:color/white"
    app:tabTextColor="@color/whiteOpacity40"
    app:tabMode="fixed"
    app:tabGravity="fill"
    app:layout_scrollFlags="scroll|enterAlways"
    app:tabMaxWidth="0dp"
    app:tabPaddingStart="0dp"
    app:tabPaddingEnd="0dp"
    **android:paddingBottom="19dp"**>

</com.google.android.material.tabs.TabLayout>
    </com.google.android.material.appbar.AppBarLayout>

<androidx.viewpager.widget.ViewPager
android:id="@+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/background_white_round_top_corners20"
app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

</androidx.coordinatorlayout.widget.CoordinatorLayout>