Collapsing toolbar not pin the card view

Question

I have created a XML with appbar layout, collapsing toolbar layout with imageview and nested scroll view in order to preform parallax scrolling.

However, I want to add a cardview inside the collapsing toolbar and pin it using the collapsing mode. It can't pin after scroll up. I have no idea what I made wrong. Anyone can help?

Here is my XML code:

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.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">


    <com.google.android.material.appbar.AppBarLayout

        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#00FFFFFF">


        <com.google.android.material.appbar.CollapsingToolbarLayout
            android:id="@+id/collapsingtoolbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">


            <androidx.cardview.widget.CardView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:layout_collapseMode="pin">

                //textview
            </androidx.cardview.widget.CardView>
            <ImageView
                        android:id="@+id/imageView7"
                        android:layout_width="360dp"
                        android:layout_height="360dp"
                        android:scaleType="centerCrop"
                        app:srcCompat="@drawable/logo"
                        tools:srcCompat="@drawable/logo" />




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

    <androidx.core.widget.NestedScrollView
        android:id="@+id/scrollview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fillViewport="false"
        android:overScrollMode="always"
        app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior">

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


            //my content
        </LinearLayout>
    </androidx.core.widget.NestedScrollView>


</androidx.coordinatorlayout.widget.CoordinatorLayout>

Answer 1

As far as I know, only Toolbar can be pinned inside of CollapsingToolbarLayout. Everything else collapses. So you either put your layout you want to pin inside of Toolbar Layout (not recommended, will change size of toolbar, and positions of nav buttons, etc.) or you move it outside of CollapsingToolbar.

Just remember that AppBarLayout acts like a vertical LinearLayout.

One possible idea, if you design allows it, is to remove CollapsingToolbarLayout and try to build your UI inside of AppBarLayout. You can control what goes away and what stays using layout_scrollFlags.