How To Highlight Selected Child Item In A Nested RecyclerView

Question

I have a Child recyclerView nested in a parent recyclerView giving me the concept of topics in different Chapters as seen in the attached photo below.

MY CHALLENGE is highlighting a single selected child item (Topic) in any given section or Chapter(nested child RecyclerView).

As can be seen in the photo, items (or Topic) previously selected in any other section (chapter) does not de-select when a topic from another section is selected. Can someone please give a hint on HOW best to highlight a selected item in a nested recyclerView.

HERE is my code snippet for the Child RecyclerView.

   @Override
public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
    Topic topic = topicList.get(position);
    holder.clearSelection();

    if (currentItemPosition == position) {
        holder.position.setTextColor(holder.itemView.getResources().getColor(R.color.red));
        holder.title.setTextColor(holder.itemView.getResources().getColor(R.color.red));
        holder.description.setTextColor(holder.itemView.getResources().getColor(R.color.blue));

    } else {
        holder.position.setTextColor(holder.itemView.getResources().getColor(R.color.black));
        holder.title.setTextColor(holder.itemView.getResources().getColor(R.color.black));
        holder.description.setTextColor(holder.itemView.getResources().getColor(R.color.black));
    }

    holder.position.setText(String.valueOf(topic.getPosition()));
    holder.title.setText(topic.getTitle());
    holder.description.setText(topic.getDescription());
    holder.duration.setText(topic.getDuration());

    if (downloadedTopics.contains(topic.getTitle())) {
        holder.downloadIcon.setImageResource(R.drawable.downloaded_icon);
    } else {
        holder.downloadIcon.setImageResource(R.drawable.undownloaded_icon);
    }

}

HERE is the OnBindViewHolder of the Parent (or Main RecyclerView)

@Override
public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
    ArrayList<View> topicViewList = new ArrayList<>();
    RootTopic topicGroup = rootTopicsGroupList.get(position);
    ArrayList<Topic>topicList = topicGroup.getTopicGroup();

    String titleConstruct = "Chapter " + (position + 1) + "- " + topicGroup.getRootTopicName();
    holder.SectionTitle.setText(titleConstruct);
    setUpTopicGroupRec(topicList,downloadedTopicList,holder.groupedTopicsRV,holder.itemView.getContext());
    
}

Here Is the setUpTopicGroupRec method called

 private void setUpTopicGroupRec(ArrayList<Topic> topicList, ArrayList<String>downloads, RecyclerView recyclerView, Context context, ArrayList<RootTopic> rootTopicsGroupList){
    LinearLayoutManager linearLayoutManager = new LinearLayoutManager(context,RecyclerView.VERTICAL,false);
    topicAdapter = new TopicAdapter(topicList, downloads);
    recyclerView.setHasFixedSize(true);
    recyclerView.setLayoutManager(linearLayoutManager);
    recyclerView.setAdapter(topicAdapter);

    topicAdapter.setOnItemClickListener(new TopicAdapter.OnItemClickListener() {
        @Override
        public void onTopicClick(int position, Topic topic) {
            currentTopic = topic;
            onTopicClickLD.postValue(currentTopic);
            int currentTopicPos = topic.getPosition();
           
        }

        @Override
        public void onDownloadIconClick(int position, Topic topic) {
            currentTopic = topic;
            onDownloadIconClickLD.postValue(currentTopic);
            
        }
    });

}

Using the material recyclerView will just do fine by itself. — Nathan Getachew, Dec 20 '20 at 23:42
I wish that was an option @NathanGetachew, but It is imperative that the items be sectioned hence the reason for the Nested recycler view option. — Eric, Dec 21 '20 at 12:28

score 2 · Accepted Answer · answered Dec 21 '20 at 01:42

2

On child recycler view adapter add a code that listens the onClick event on the specific item and see its position and finally apply change in the item at that position.

answered Dec 21 '20 at 01:42

Sulav Parajuli

143
2
11

I have done that @Sulav but because I am using a nested recyclerView, previously selected items in other sections of the parent recyclerView don't get de-selected when the items in another section are selected. – Eric Dec 21 '20 at 12:32
Can you add the code of what you have tried so far? – Sulav Parajuli Dec 21 '20 at 12:58
I have edited the question to add the code and photo off what I have tried as advised – Eric Dec 21 '20 at 15:33
1

You can make a livedata and change its value to 1 or 0. 1 if parent item is selected 0 if child is selected and use that livedata In binder to toggle automatically. – Sulav Parajuli Dec 22 '20 at 01:12
Many thanks, @Sulav, you've been more than helpful – Eric Dec 22 '20 at 16:12
Welcome bruh Happy coding – Sulav Parajuli Dec 23 '20 at 01:18
@Sulav Parajuli I am facing the same issue and there is no proper answer in this post. The accepted one doesn't work for nested recycler views. Could you help? – M. Azyoksul Apr 22 '21 at 18:59

How To Highlight Selected Child Item In A Nested RecyclerView

1 Answers1