Persistent BottomSheet using NestedScrollView, it contains top padding? support-lib 24.2.1

Question

There are a lot of nice tutorials talking about BottomSheet using NestedScrollView. But After I try it with my current support library version 24.2.1, it took me few days with no clue about why mine contains top padding.

Here is my Activity's layout xml:

<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"
    tools:context=".ui.MainActivity">

    <!-- AppBar -->
    <include
        android:id="@+id/appBar"
        layout="@layout/app_bar_layout_with_tab"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabPager="@{tabPager}" />

    <!-- Content -->
    <android.support.v4.widget.SwipeRefreshLayout
        android:id="@+id/swipeRefresh"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <FrameLayout
            android:id="@+id/container"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
    </android.support.v4.widget.SwipeRefreshLayout>

    <!-- [START] BottomSheet -->
    <include
        android:id="@+id/bottomSheetMain"
        layout="@layout/fragment_bottom_sheet_song"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true"
        app:behavior_hideable="false"
        app:behavior_peekHeight="0dp"
        app:layout_behavior="@string/bottom_sheet_behavior" />
    <!-- [END BottomSheet] -->

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

And the BottomSheet's layout fragment_bottom_sheet_song.xml:

<android.support.v4.widget.NestedScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/bgBottomSheetPlayer">

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

        <include
            android:id="@+id/bottomSheetPlayer"
            layout="@layout/view_bottom_sheet_player_dark"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:playAction="@{playAction}"
            app:playObject="@{playSong}" />

        <include
            android:id="@+id/bottomSheetContent"
            layout="@layout/view_action_detail_song"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:playSong="@{playSong}"
            app:songActionHandler="@{songActionHandler}" />
    </LinearLayout>
</android.support.v4.widget.NestedScrollView>

Then this is the result:

Why there is top padding? How can I fix this?

Thanks.

Answer 1

After trying for several days, I found out that to fix this, the persistent bottom sheet layout container must be a FrameLayout. If not (like my case, I included the NestedScrollView direct and made it become a bottom sheet), it will contain the default top padding, and I still do not know why.

So here is my new Activity's xml layout code to fix:

<!-- [START] BottomSheet -->
<FrameLayout
    android:id="@+id/bottomSheetParent"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:fitsSystemWindows="true"
    app:behavior_hideable="false"
    app:behavior_peekHeight="0dp"
    app:layout_behavior="@string/bottom_sheet_behavior">

    <include
        android:id="@+id/bottomSheetMain"
        layout="@layout/fragment_bottom_sheet_song"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
</FrameLayout>
<!-- [END BottomSheet] -->

Hope this help you too.