Performance issue while using BlurView in RecyclerView items

Please include:

1. 1.6.6
2. Pixel 2 API 30
3. Lagging occurs when using blurview in recyclerview. Every recyclerview item has a blurview. I setup blurview in onBindViewHolder method.
4. Xml and blurview setup

// CustomRecyclerViewAdapter.kt

override fun onBindViewHolder(holder: RecyclerView.ViewHolder, position: Int) {
blurView.setupWith(rootBlurView)
          .setBlurAlgorithm(renderScriptBlur)
          .setBlurRadius(4f)
          .setHasFixedTransformationMatrix(false)
}

// item_recyclerview.xml

<FrameLayout
            android:id="@+id/rootBlurView"
            android:layout_width="match_parent"
            android:layout_height="40dp"
            android:layout_marginHorizontal="16dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent">

            <eightbitlab.com.blurview.BlurView
              android:id="@+id/blurView"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              app:blurOverlayColor="#78ffffff"/>

          </FrameLayout>

1. Stacktrace in case of a crash There isn’t any crash only occurs lagging and slow performance while scrolling recyclerview. What is the correct way setup BlurView ? Where can i setup BlurView ?

[Dimezis]

I can suggest you to make list item much simpler, right now it has plenty of redundant Views that serve no purpose. Something like that, just add elevation and rounded corners drawable to the ConstraintLayout.

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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/blurViewRoot"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="8dp"
    app:elevation="@dimen/item_photo_card_view_elevation">

    <ImageView
        android:id="@+id/ivBackground"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:scaleType="centerCrop"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintDimensionRatio="H,10:5"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/img_item_background" />

    <eightbitlab.com.blurview.BlurView
        android:id="@+id/blurView"
        android:layout_width="0dp"
        android:layout_height="@dimen/item_photo_blur_view_height"
        android:layout_gravity="bottom"
        android:layout_marginHorizontal="@dimen/item_photo_blur_view_margin_horizontal"
        android:layout_marginBottom="@dimen/item_photo_blur_view_margin_bottom"
        android:background="@drawable/bg_blur_item_photo"
        app:blurOverlayColor="@color/blur_overlay"
        app:layout_constraintBottom_toBottomOf="@id/ivBackground"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent">

        <TextView
            android:id="@+id/tvTitle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:textAppearance="@style/TextAppearance.AppCompat.Headline"
            android:textColor="@color/white"
            tools:text="Title" />

    </eightbitlab.com.blurview.BlurView>

</androidx.constraintlayout.widget.ConstraintLayout>

Items will inflate faster and also BlurView will have much less work to do. Generally, try to keep your View hierarchy simple and set the root of the BlurView as close as possible.

This will not completely fix your problem, because as I said, having multiple BlurViews like this is a performance hit no matter what.

You can also try to create a custom LinearLayoutManager and override calculateExtraLayoutSpace to sort of preload off-screen Views of the list because during fast scrolling RecyclerView can create additional ViewHolders, which is a heavy operation with a BlurView. This trick, in theory, can pre-create enough ViewHolders on start when scrolling is not yet started.

But your best bet would be not to use it in the list

[yusufonderd]

Unfortunately, when i’m trying to real project, it is not working as expected. Because i have to use Coordinator layout and cardview in my view holder. I can’t fix the problem yet but i will write below this issue if there is an improvent.