Nothing show in Adapter when I use AsyncListDiffer and view binding

Question

I try to show data form api in Custom recycler view by using view binding and diffUtil

I try to use DiffUtil with Binding view in RecyclerView Adapter but when I send the data from fragment differ.submitList(the DATA) nothing the show in the list

when I debugging I found the data come from API and go to differ

class NewsAdapter : RecyclerView.Adapter<NewsAdapter.ItemViewHolder>() {

private val differCallBack = object : DiffUtil.ItemCallback<Article>() {
    override fun areItemsTheSame(oldItem: Article, newItem: Article): Boolean {
        return oldItem.url == newItem.url
    }

    override fun areContentsTheSame(oldItem: Article, newItem: Article): Boolean {
        return oldItem == newItem
    }
}

val differ = AsyncListDiffer(this, differCallBack)


override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ItemViewHolder {
    return ItemViewHolder(
        LayoutInflater.from(parent.context)
            .inflate(R.layout.item_article_preview, parent, false)
    )
}

inner class ItemViewHolder(private val view: View) :
    RecyclerView.ViewHolder(view) {
    var binding =
        ItemArticlePreviewBinding.bind(view)

    fun bind(article: Article) {
        Glide.with(view).load(article.urlToImage).into(binding.ivArticleImage)
        binding.tvTitle.text = article.title
        binding.tvSource.text = article.source.name
        binding.tvDescription.text = article.description
        binding.tvPublishedAt.text = article.publishedAt
    }
}


override fun onBindViewHolder(holder: ItemViewHolder, position: Int) {
    val article = differ.currentList[position]
    holder.itemView.apply {
        holder.bind(article)
        setOnClickListener {
            onItemClickListener?.let {
                it(article)
            }
        }
    }
}

private var onItemClickListener: ((Article) -> Unit)? = null

fun setOnClickListener(listener: (Article) -> Unit) {
    onItemClickListener = listener
}

override fun getItemCount(): Int {
    return differ.currentList.size
}

}

Answer 1

Inside ItemViewHolder, the itemView you are binding data to, and the itemView you are passing to the recyclerView are two different views.

The view which you have passed to ItemViewHolder after creating from onCreateViewHolder is being passed to the RecyclerView, but you are binding data to a different view that you are inflating using the viewBinding of the ItemArticlePreviewBinding.

You can change ViewHolder's constructor to accept a binding instance instead of a view and then bind data to that binding object.

inner class ItemViewHolder(private val binding: ItemArticlePreviewBinding) :
    RecyclerView.ViewHolder(binding.root) {

    fun bind(article: Article) {
        Glide.with(view).load(article.urlToImage).into(binding.ivArticleImage)
        binding.tvTitle.text = article.title
        binding.tvSource.text = article.source.name
        binding.tvDescription.text = article.description
        binding.tvPublishedAt.text = article.publishedAt
    }
}

Inside onCreateViewHolder inflate a ViewBinding object and pass that to the ItemViewHolder's constructor

override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ItemViewHolder {
    return ItemViewHolder(
        ItemArticlePreviewBinding.inflate(LayoutInflater.from(parent.context), parent, false)
    )
}