Reputation: 1760
I'm using the Android Design Support Library to create an Activity with a Collapsible Toolbar with a nice fading effect, just like Google Play or Whatsapp's Contact profile. I will put the activity layout at the end but bear in mind this is just the default Collapsible Activity layout to which I added an ImageView to the AppBarLayout to create the Toolbar <-> Image fade effect.
My problem with this implementation presents itself as 2 symptoms I will describe:
The activity content is long, when I want to scroll up quickly with a fast swipe the scroll will stop before expanding the Toolbar. I want it to continue, when I'm at the bottom of my NestedScrollView and I do a quick finger swipe to go all the way to the top of my activity I want this scroll to go and expand the Toolbar, this is the way the Google Play app behaves or Whatsapp's profile does.
Similarly when the Toolbar is expanded there is no inertia to the scroll, a quick swipe down will scroll a tiny bit, again this is not how Google Play or Whatsapp profile behaves. Once the Toolbar is collapsed the scroll behaves as it always has in ScrollViews, ListViews, etc. A quick swipe will allow you to go the bottom or top (unless there is a lot of content).
Is the behaviour I describe supported by the Design Support Library?
activity.xml:
<?xml version="1.0" encoding="utf-8"?>
<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=".ScrollingActivity">
<android.support.design.widget.AppBarLayout
android:id="@+id/app_bar"
android:fitsSystemWindows="true"
android:layout_height="@dimen/app_bar_height_custom"
android:layout_width="match_parent"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/toolbar_layout"
android:fitsSystemWindows="true"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="?attr/colorPrimary">
<ImageView
android:src="@drawable/cuthbert"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax"
android:minHeight="100dp"/>
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent"
app:layout_collapseMode="parallax"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="@style/AppTheme.PopupOverlay" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<include layout="@layout/content_scrolling"/>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="@dimen/fab_margin"
app:layout_anchor="@id/app_bar"
app:layout_anchorGravity="bottom|end"
android:src="@android:drawable/ic_dialog_email"/>
</android.support.design.widget.CoordinatorLayout>
content_scrolling.xml:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.NestedScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:showIn="@layout/activity_scrolling"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ScrollingActivity">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="@dimen/text_margin"
android:text="@string/large_text"/>
</android.support.v4.widget.NestedScrollView>
Upvotes: 11
Views: 1313
Reputation: 1422
Update support libraries to 26.0.0 ( especially design support library ). They finally fixed this issue after years of complaining.
Upvotes: 0
Reputation: 53
Try to add these lines in :
<android.support.design.widget.CollapsingToolbarLayout
app:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp"
app:expandedTitleTextAppearance="@android:color/transparent"
Upvotes: 0