Coordinator Layout with RecyclerView & CollapsingToolbarLayout

Question

I am trying to implement CollapsingToolbar with RecyclerView using a small amount of guidance here: http://android-developers.blogspot.co.uk/2015/05/android-design-support-library.html and the project is here: https: // github. com / chrisbanes / cheesesquare , and currently I have the following 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:id="@+id/main_content" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.design.widget.AppBarLayout android:id="@+id/appbar" android:layout_width="match_parent" android:layout_height="@dimen/detail_backdrop_height" android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" android:fitsSystemWindows="true"> <android.support.design.widget.CollapsingToolbarLayout android:id="@+id/collapsing_toolbar" android:layout_width="match_parent" android:layout_height="match_parent" app:layout_scrollFlags="scroll|exitUntilCollapsed" android:fitsSystemWindows="true" app:theme="@style/Toolbar" app:contentScrim="@color/primary" app:expandedTitleMarginStart="48dp" app:expandedTitleMarginEnd="64dp"> <ImageView android:id="@+id/backdrop" android:layout_width="match_parent" android:layout_height="match_parent" android:scaleType="centerCrop" android:fitsSystemWindows="true" app:layout_collapseMode="parallax" /> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" app:theme="@style/Toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" app:popupTheme="@style/ThemeOverlay.AppCompat.Light" app:layout_collapseMode="pin" /> </android.support.design.widget.CollapsingToolbarLayout> </android.support.design.widget.AppBarLayout> <android.support.v7.widget.RecyclerView android:id="@+id/recyclerView" android:layout_width="match_parent" android:layout_height="match_parent" app:layout_behavior="@string/appbar_scrolling_view_behavior" /> <android.support.design.widget.FloatingActionButton android:layout_height="wrap_content" android:layout_width="wrap_content" app:layout_anchor="@id/appbar" app:layout_anchorGravity="bottom|right|end" android:src="@drawable/ic_directions" android:layout_margin="@dimen/fab_margin" android:clickable="true"/> </android.support.design.widget.CoordinatorLayout> 

The source is as follows:

  setContentView(R.layout.activity_details_image); final Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); setSupportActionBar(toolbar); getSupportActionBar().setDisplayHomeAsUpEnabled(true); loadImage(); CollapsingToolbarLayout collapsingToolbar = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar); collapsingToolbar.setTitle(formatName(getIntent().getStringExtra("name"))); RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recyclerView); recyclerView.setLayoutManager(new LinearLayoutManager(this)); ArrayList<DetailsAdapter.Detail> details = new ArrayList<DetailsAdapter.Detail>(); details.add(new DetailsAdapter.Detail("Main Facilities", "Children Play Area, Ecotricity Electric Vehicle Charging Point, Lucky Coin, Multi Faith Room (southbound only), Showers", R.drawable.ic_moto)); details.add(new DetailsAdapter.Detail("Restaurants", "Eat & Drink Co., Burger King, Costa, West Cornwall Pasty Co. (northbound only), Greggs, Costa Express, Krispy Kreme", R.drawable.ic_moto)); details.add(new DetailsAdapter.Detail("Shops", "WHSmith, M&S Simply Food, Fone Bitz, Cotton Traders, Ladbrokes (southbound only)", R.drawable.ic_moto)); details.add(new DetailsAdapter.Detail("Motel", "Travelodge", R.drawable.ic_moto)); details.add(new DetailsAdapter.Detail("Forecourt", "BP (with: LPG), Costa Express, Air1 AdBlue", R.drawable.ic_moto)); DetailsAdapter mAdapter = new DetailsAdapter(this, details); recyclerView.setAdapter(mAdapter); recyclerView.setItemAnimator(new DefaultItemAnimator()); 

I tested it without a folding toolbar and it scrolls in order

However, it does not scroll even if the list is longer than the visible parts. What did I do wrong?

Answer 1

Make sure you use com.android.support:recyclerview-v7:22.2.0

(This didn’t work with version up to 22.2.0 either)

Answer 2

im probably 1 year late to answer this question. I have found a solution. Here it is, add layout_marginBottom in the nested scroll view:

 <?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:id="@+id/main_coord_layout" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.example.android.minhnguyencv.MainActivity"> <android.support.design.widget.AppBarLayout android:layout_width="match_parent" android:layout_height="256dp" android:id="@+id/appbar" android:theme="@style/AppTheme.AppBarOverlay" app:elevation="4dp"> <android.support.design.widget.CollapsingToolbarLayout android:id="@+id/collapse_toolbar" android:layout_width="match_parent" android:layout_height="match_parent" app:layout_scrollFlags = "scroll|exitUntilCollapsed" app:contentScrim="@color/colorPrimary" android:fitsSystemWindows="true" app:expandedTitleTextAppearance="@android:color/transparent"> <ImageView android:id="@+id/coverPhoto" android:layout_width="match_parent" android:layout_height="match_parent" android:scaleType="fitXY" android:fitsSystemWindows="true" android:src="@drawable/coverphoto" app:layout_collapseMode="parallax" android:clickable="true" /> <ImageView android:id="@+id/profilePhoto" android:layout_width="150dp" android:layout_height="150dp" android:layout_gravity="center_horizontal|bottom" android:scaleType="fitXY" android:fitsSystemWindows="true" app:layout_collapseMode="parallax" android:clickable="true" /> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" app:popupTheme="@style/AppTheme.PopupOverlay" app:layout_collapseMode = "pin" /> </android.support.design.widget.CollapsingToolbarLayout> </android.support.design.widget.AppBarLayout> <android.support.v4.widget.NestedScrollView android:id="@+id/main_nested_scroll_view" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_gravity = "fill_vertical" android:layout_marginBottom="?attr/actionBarSize" app:layout_behavior = "@string/appbar_scrolling_view_behavior"> <include layout="@layout/content_main" /> </android.support.v4.widget.NestedScrollView> <include layout="@layout/floating_button_menu"/> </android.support.design.widget.CoordinatorLayout>