I have an activity with a CoordinatorLayout
, AppBarLayout
, CollapsingToolbarLayout
and Toolbar
. So, basically, a view that collapses when scrolling a RecyclerView
.
What I need to do is to show a custom view when the view of the expanded layout is hidden due to collapsing.
This is my layout:
<android.support.design.widget.CoordinatorLayout 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:fitsSystemWindows="true"> <android.support.design.widget.AppBarLayout android:id="@+id/appbar" android:layout_width="match_parent" android:layout_height="192dp" android:fitsSystemWindows="true" android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> <android.support.design.widget.CollapsingToolbarLayout android:id="@+id/collapsing_toolbar" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" app:contentScrim="#2196F3" app:expandedTitleMarginBottom="32dp" app:expandedTitleMarginEnd="64dp" app:expandedTitleMarginStart="48dp" app:layout_scrollFlags="scroll|exitUntilCollapsed"> <include android:id="@+id/header" layout="@layout/header_big_first_screen" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" android:scaleType="centerCrop" app:layout_collapseMode="parallax"/> <android.support.v7.widget.CollapsingToolbarLayout android:id="@+id/anim_toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" app:layout_collapseMode="pin" app:popupTheme="@style/ThemeOverlay.AppCompat.Light"> <TextView android:layout_width="match_parent" android:layout_height="match_parent" android:text="Hello!"/> </android.support.v7.widget.CollapsingToolbarLayout> </android.support.design.widget.CollapsingToolbarLayout> </android.support.design.widget.AppBarLayout> <android.support.v7.widget.RecyclerView android:id="@+id/categories_recyclerview" android:layout_width="match_parent" android:layout_height="match_parent" app:layout_behavior="@string/appbar_scrolling_view_behavior"/> </android.support.design.widget.CoordinatorLayout>
In the end, when the toolbar is expanded the view loaded with the element is shown. When it is collapsed it doesn't . When it disappears the TextView
inside Toolbar
should be shown. Currently it shows all the time.
I've been looking in the events of CollapsingToolbarLayout
to add a listener when it changes size so I can check if that is smaller than a value and show that view.
This can be kind of tricky to explain but I believe I made myself clear. I've been googling around and cannot find anyone trying to do the same.
Android CollapsingToolbarLayout is a wrapper for Toolbar which implements a collapsing app bar. It is designed to be used as a direct child of a AppBarLayout. This type of layout is commonly seen in the Profile Screen of the Whatsapp Application.
CoordinatorLayout is a super-powered FrameLayout . CoordinatorLayout is intended for two primary use cases: As a top-level application decor or chrome layout. As a container for a specific interaction with one or more child views.
Taking a look at the CollapsingToolbarLayout
source, the content scrim animations are triggered via an OnOffsetChangedListener
on the AppBarLayout
. So you could add another one to trigger alpha animations on your text view:
mListener = new AppBarLayout.OnOffsetChangedListener() { @Override public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) { if(collapsingToolbar.getHeight() + verticalOffset < 2 * ViewCompat.getMinimumHeight(collapsingToolbar)) { hello.animate().alpha(1).setDuration(600); } else { hello.animate().alpha(0).setDuration(600); } } }; appBar.addOnOffsetChangedListener(mListener);
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With