Layout not disappearing completely when using coordinator Layout in fragment

Question

I'm trying to use a coordinator layout and an AppBarLayout inside a fragment. My goal is to have a header than can be hidden when scrolling but to keep the title bar which is inside the activity and is necessary for other fragments.

My issue is that, when I scroll down, the header is not completely hidden. There a part that has status bar height that remains visible. I don't know how to make it completely disappear.

Here are some scrren capture to make it more understandable:

header fully displayed

scrolled down

Here is the layout xml:

<?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:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@android:color/holo_blue_dark"
        android:fitsSystemWindows="true">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                app:contentScrim="?attr/colorPrimary"
                app:expandedTitleMarginStart="@dimen/general_padding"
                app:layout_scrollFlags="scroll|exitUntilCollapsed"
                app:layout_behavior="@string/appbar_scrolling_view_behavior"
                android:fitsSystemWindows="true">

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="25dp"
                    android:layout_marginTop="100dp"
                    android:layout_margin="@dimen/general_padding"
                    android:background="@android:color/holo_green_light"
                    android:orientation="vertical">
                </LinearLayout>

            </LinearLayout>

        <android.support.design.widget.TabLayout
            android:id="@+id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabMode="fixed"
            app:tabGravity="fill"/>

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

    <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.support.design.widget.CoordinatorLayout>

And the onCreateView() method from the fragment which uses this layout:

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

    View view = inflater.inflate(R.layout.fragment_tabs, container, false);
    mUnbinder = ButterKnife.bind(this, view);

    mTabsPresenter.subscribe(this);

    TabsPagerAdapter adapter = new TabsPagerAdapter(getChildFragmentManager());
    mPager.setAdapter(adapter);
    mTabs.setupWithViewPager(mPager);
    mTabs.getTabAt(0).setText("_Maintenance");
    mTabs.getTabAt(1).setText("_History");
    mTabs.getTabAt(2).setText("_Costs");

    setHasOptionsMenu(true);

    return view;
}

Can someone help me with this issue ?

Thank you

Answer 1

Please try using "layout_marginTop=-8dp" in your tablayout. An easy workaround.