doesn't display images after loading.

Glide Version: 4.4.0

Device/Android Version: pixel 4 XL / Android 12 API 31

I am trying to display multiple images on the chat screen using the recycleView. 10 images are displayed at a time, and when I scroll to the top, the additional 10 images are displayed.

The problem occurs when the additional 10 images are loaded. When I load the additional 10, I get a problem: The 10 loaded files may or may not have images. (Of the 10, those loaded first are most likely to have images displayed.) Images that were originally displayed may no longer be displayed at the time of loading.

thanks.

listAdapter

class ScheduleImageListAdapter(private val chatData: ChatData, private val viewModel: ChatViewModel): RecyclerView.Adapter<ScheduleImageListAdapter.ViewHolder>() {

    class ViewHolder (val binding: ViewChatScheduleCellItemBinding) :
    RecyclerView.ViewHolder(binding.root) {
        fun bind(file: ScheduleFile, viewModel: ChatViewModel) {
            binding.run {
                this.scheduleFile = file
                appCompatImageView.setOnClickListener {
                    viewModel.onClickScheduleFile(file)
                }

                executePendingBindings()
            }
        }
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
        val layoutInflater = LayoutInflater.from(parent.context)
        return ViewHolder(
            ViewChatScheduleCellItemBinding.inflate(
                layoutInflater,
                parent,
                false
            )
        )
    }

    override fun onBindViewHolder(viewHolder: ViewHolder, position: Int) {
        val file = chatData.schedule?.files?.get(position)
        viewHolder.bind(file!!, viewModel)
    }

    override fun getItemCount(): Int {
        val count = chatData.schedule?.files?.size ?: 0
        return when(chatData.showMoreType) {
            2 -> count
            else -> kotlin.math.min(count, 5)
        }
    }

    override fun getItemId(position: Int): Long {
        return position.toLong()
    }

    override fun getItemViewType(position: Int): Int {
        return position
    }
}

CustomBindingAdapter.kt

    @JvmStatic
    @BindingAdapter("android:imageUrl")
    fun AppCompatImageView.imageUrl(url: String?) {
        // Timber.d("test url ${url}")
        url?.let {
            val requestOptions = RequestOptions().apply {placeholder(R.drawable.image_loading)
                .error(android.R.color.holo_red_light)
                .fallback(android.R.color.holo_orange_light)}
            // Glide.with(this).load(url).apply(requestOptions).into(this)
            Glide.with(this).load(url).apply(requestOptions).listener(object : RequestListener<Drawable?> {
                override fun onLoadFailed(
                    e: GlideException?,
                    model: Any?,
                    target: Target<Drawable?>?,
                    isFirstResource: Boolean
                ): Boolean {
                    // Timber.d("test e ${e}")
                    // Timber.d("test model ${model}")
                    // Timber.d("test target ${target}")
                    // Timber.d("test isFirstResource ${isFirstResource}")
                    return true
                }

                override fun onResourceReady(
                    resource: Drawable?,
                    model: Any?,
                    target: Target<Drawable?>?,
                    dataSource: DataSource?,
                    isFirstResource: Boolean
                ): Boolean {
                    // Timber.d("test resource ${resource}")
                    // Timber.d("test model ${model}")
                    // Timber.d("test target ${target}")
                    // Timber.d("test isFirstResource ${isFirstResource}")
                    return false
                }
            }).into(this)
        } ?: run {
            setImageBitmap(null)
        }
    }

Layout XML: view_chat_schedule_cell_item.xml

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:android="http://schemas.android.com/apk/res/android">

    <data>
        <variable name="scheduleFile" type="******.ScheduleFile" />
        <variable name="viewModel" type="******.ChatViewModel" />
    </data>

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <androidx.appcompat.widget.AppCompatImageView
            android:id="@+id/appCompatImageView"
            android:layout_width="0dp"
            android:layout_height="50dp"
            android:layout_marginStart="2dp"
            android:layout_marginEnd="2dp"
            android:layout_weight="1"
            android:background="@drawable/image_border"
            android:imageUrl="@{scheduleFile.url}"
            android:scaleType="centerInside"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />
    </androidx.constraintlayout.widget.ConstraintLayout>
</layout>

bumptech / glide

doesn't display images after loading. #4711