Toolbar will not collapse with Scrollview as child of CoordinatorLayout

Question

I am trying to follow the Google Docs on using the CoordinatorLayout but i am having an issue with the ScrollView inside the CoordinatorLayout. Basically, the Toolbar normally would collapse with a RecyclerView or a Listview when scrolling down. Now with a ScrollView it will not collapse.

<android.support.design.widget.CoordinatorLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        >

        <TextView
            android:id="@+id/tv_View"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="center"
            android:gravity="center"
            android:text="@string/filler"
            style="@style/TextAppearance.AppCompat.Large"
            />

    </ScrollView>

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        >
        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_scrollFlags="scroll|enterAlways"
            />

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

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

Answer 1

The ScrollView does not cooperate with the CoordinatorLayout. You have to use NestedScrollView instead of ScrollView

Answer 2

Use NestedScrollView to collapse your scrollview as a child of Coordinator Layout. Replace your code with this code:

<android.support.design.widget.CoordinatorLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
                 android:layout_height="match_parent"
                 app:layout_behavior="@string/appbar_scrolling_view_behavior">

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

        <TextView
            android:id="@+id/tv_View"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="center"
            android:gravity="center"
            android:text="@string/filler"
            style="@style/TextAppearance.AppCompat.Large"
            />

    </LinearLayout>
    </android.support.v4.widget.NestedScrollView>

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        >
        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_scrollFlags="scroll|enterAlways"
            />

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

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

Answer 3

You can keep the ScrollView and add this XML property : android:nestedScrollingEnabled="true" so it knows the CoordinatorLayout as a sibling and keep in mind this property is supported just in lollipop version and above.

Answer 4

Use a NestedScrollView instead of a regular ScrollView when using CoordinatorLayout.

To make the CollapsingToolbarLayout scroll you can trigger the scroll behavior by setting a minimum height of the child Layout of the NestedScrollView to *1000dp.

android:minHeight="1000dp"

Layout:

<android.support.v4.widget.NestedScrollView
app:layout_behavior="@string/appbar_scrolling_view_behavior">

    <!--to trigger scroll behavior-->
    <LinearLayout android:minHeight="1000dp"/>

</android.support.v4.widget.NestedScrollView>

*SupportDesignDemos example here: https://github.com/android/platform_development/blob/master/samples/SupportDesignDemos/res/layout/include_appbar_scrollview.xml

Answer 5

The actual answer should be that CoordinatorLayout doesn't work with ScrollView, because ScrollView is not implementing NestedScrollingChild interface. NestedScrollView is a ScrollView with NestedScrollingChild implementation. If you want to learn more about nested scrolling I made a blog post about it.