Hi dear android developer, hope you are doing well.
I'm having problem to achieve one thing while i'm working on my project.
When I scroll my RecyclerView, then the CollapsingToolbarLayout collapsed and expanded, but my title Toolbar shows on the top of the LinearLayout (id: "search_header"). And in the background of Toolbar, the LinearLayout keeps showing, but it should be hidden. And another problem is, when CollapsingToolbarLayout is expanded, the title should show by taking more space in bottom of LinearLayout . Let me share two screenshot.
My XML Code:
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_centerInParent="true">
<com.google.android.material.appbar.AppBarLayout
android:id="@+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="@+id/collapsingToolbarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:toolbarId="@id/fakeTitle"
app:titleCollapseMode="scale"
app:collapsedTitleTextAppearance="@color/white"
app:collapsedTitleGravity="start"
app:expandedTitleGravity="center"
app:contentScrim="@color/light_background"
app:titleTextEllipsize="middle"
app:collapsedTitleTextColor="@color/white"
app:expandedTitleTextColor="@color/white"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed|snap">
<com.google.android.material.appbar.MaterialToolbar
android:id="@+id/fakeTitle"
android:layout_width="match_parent"
android:layout_height="60dp"
app:title="Result List"
app:layout_collapseMode="pin"
/>
<LinearLayout
android:id="@+id/result_search_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/light_background"
android:gravity="center_vertical"
android:orientation="horizontal"
android:foreground="@color/transparent"
android:paddingHorizontal="16dp"
app:layout_collapseMode="parallax">
<androidx.appcompat.widget.AppCompatSpinner
android:id="@+id/cityNameSpinner"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="6"
android:foreground="?selectableItemBackground"
android:gravity="start"
android:paddingVertical="16dp"
android:spinnerMode="dialog" />
<Spinner
android:id="@+id/bloodGroupSpinner"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="4"
android:foreground="?selectableItemBackground"
android:paddingVertical="16dp"
android:spinnerMode="dialog" />
<Button
android:id="@+id/searchDonors"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:backgroundTint="@color/deep_background"
android:text="Search" />
</LinearLayout>
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/rv_results_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
As I told you my problem, or I'm not being able to achieve my target, I need your help to finalize my project.
- I need the title Toolbar shown bottom of my LinearLayout by taking more space on top.
- And secondly, when CollapsingToolbarLayout collapsed, the Toolbar should be shown on left, and the LinearLayout should be hidden.
And I don't want to use programming language (Java or Kotlin here) here. I need to complete this with XML. And I think it's possible.
Thanks in advance. Hope you will find me the best solution.

