RecyclerView inside NestedScrollView causing slow load and/or crashing

Question

I am working with a RecyclerView which will be used to load potentially many images and I'd like to have an actionbar above the RecyclerView like this:

But I'd also like the actionbar to only have that grayish background at the very top. If the user scrolls, it should be totally transparent like this:

I've accomplished what I wanted by using this as my layout (with one major issue):

fragment_recycler_gallery.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.NestedScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

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

    <!-- Gray bar at top -->
    <View
        android:id="@+id/gray_bar"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="@null" />

    <android.support.v7.widget.RecyclerView 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/recycler_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"/>
    </LinearLayout>
</android.support.v4.widget.NestedScrollView>

The NestedScrollView is key to getting my entire fragment to scroll instead of only the RecyclerView but it makes my app slow or unresponsive when loading a large set of images (500+). Is there a better way to create what I'm looking for? I've tried finding solutions but all I can find is "don't use recyclerviews inside nestedScrollViews" without any alternative solutions offered.

I'm using Glide to load the images into each ImageView(within the recyclerview) if that matters as well.

And I'm already using this on my RecyclerView as well:

mAlbumRecyclerView.setNestedScrollingEnabled(false);

Answer 1

Any time you use wrap_content on a RecyclerView, you're setting yourself up for performance problems. Using wrap_content completely defeats the performance improvements that you get from recycling views. So the question, then, is how you can do what you want without using wrap_content.

One thing you could do is use a FrameLayout to overlay a Toolbar on top of your RecyclerView, and then use padding on the RecyclerView (combined with android:clipToPadding="false") to make things appear to start below the actionbar. As long as your toolbar has a translucent background color, your recyclerview content will appear below it when you scroll.

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    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.support.v7.widget.RecyclerView
        android:id="@+id/recycler"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingTop="?attr/actionBarSize"
        android:clipToPadding="false"
        app:layoutManager="android.support.v7.widget.LinearLayoutManager"
        tools:listitem="@layout/itemview"/>

    <android.support.v7.widget.Toolbar
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="#1111"
        app:title="Hello world"/>

</FrameLayout>