Using RadioGroup in a RecyclerView

How to get the functionality you expect

In order to improve the performance of an app I made in my earlier Android days, I wanted to implement a RecyclerView to display multiple-choice questions. So I set up an `OnClickListener` in the `bind()` method of the `ViewHolder` to trigger a callback

//for each RadioButton
view.radioButton.isChecked = question.answer == 1
view.radioButton.setOnClickListener {
    interaction?.onItemSelected(adapterPosition, 1)            
}

But when I tried to run the code, this happened:

As you can see, when I scroll away from the items I’ve selected, they no longer display correctly. The code works, in that I get my callback just fine, but the visual glitch is certainly annoying. I don’t understand why this happens (it’s not a differ problem) and the Internet doesn’t seem to have a lot of resources to explain or fix it.

So how did I manage to solve the issue? By simply calling the following line of code before setting the correct value of the RadioButtons:

view.radioGroup.clearCheck()

This way, the RadioGroup clears its selection, ready to receive an input that will trigger the correct RadioButton as checked. Theoretically, this could work by changing the checked button as well, but this way is more efficient (and it is essentially what happens, the checked button becomes the one with id -1).

To find out more details about the context of this code, have a look at the app on GitHub:

adriantache/Big-Five-Personality-Test

Thanks for reading this article. You can connect with me on LinkedIn.

I’m currently looking for a job in the Geneva area, Switzerland, so please contact me if you know someone in need of a Developer with Kotlin/Java (Android) and JavaScript (React Native Android/iOS) experience.

If you liked this article, please hit the clap icon 👏 to show your support.