View color changing on click changes at every 8th position RecyclerView

Question

So when i click on the 0 position of recyclerview to change the color of the view it also changes the color at 8th, 16th and 24th position (i have a total of 26 items in recyclerview), if i click on position 1 it changes color at 1st, 9th, 17th and 25th and so on. how do i fix this

My recyclerview adapter is

public class AdapterOccupiedRoomCleaning extends RecyclerView.Adapter<AdapterOccupiedRoomCleaning.ViewHolder> {
    private List<ItemsAdapter> mList;
    private Context mContext;

    public AdapterOccupiedRoomCleaning(List<ItemsAdapter> list, Context context){
        super();
        mList = list;
        mContext = context;
    }
    @NonNull
    @Override
    public AdapterOccupiedRoomCleaning.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int i) {
        View v = LayoutInflater.from(parent.getContext()).inflate(R.layout.occupiedrooms_cleaning_item, parent, false);
        ViewHolder viewHolder = new ViewHolder(v);

        return viewHolder;
    }
    @Override
    public void onBindViewHolder(@NonNull AdapterOccupiedRoomCleaning.ViewHolder viewHolder, int position) {
        ItemsAdapter itemAdapter = mList.get(position);
        ((ViewHolder) viewHolder).setUrduText.setText(itemAdapter.getUrdutext());
        ((ViewHolder) viewHolder).setEnglishText.setText(itemAdapter.getEnglishText());
        ((ViewHolder) viewHolder).setCleaningImage.setImageResource(itemAdapter.getImage());
//        ((ViewHolder) viewHolder).background.setOnClickListener(new View.OnClickListener() {
//            @Override
//            public void onClick(View v) {
//
//                //viewHolder.background.setBackgroundColor(Color.parseColor("#08A467"));
//                
//                Toast.makeText(mContext, "Recycle Click " + viewHolder.setEnglishText.getText().toString(), Toast.LENGTH_SHORT).show();
//            }
//        });

        viewHolder.itemView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

                viewHolder.background.setBackgroundColor(Color.parseColor("#08A467"));
            }
        });
    }

    @Override
    public int getItemCount() {
        //notifyDataSetChanged();
        return mList.size();
    }


    class ViewHolder extends RecyclerView.ViewHolder{
        public TextView setUrduText, setEnglishText;
        public ImageView setCleaningImage;
        public View background;
        public ViewHolder(View itemView) {
            super(itemView);
            setUrduText = (TextView) itemView.findViewById(R.id.urduTextView);
            setEnglishText = (TextView) itemView.findViewById(R.id.englishTextView);
            setCleaningImage = (ImageView) itemView.findViewById(R.id.imageCleaning);
            background = (View) itemView.findViewById(R.id.backgroundColor);
        }
    }
}

My java class is

public class OccupiedRoomCleaning extends AppCompatActivity {

    String getQrCode, patientMRNO, roomNumber;
    private RecyclerView mRecycleview;
    private List<ItemsAdapter> mList = new ArrayList<>();
    private AdapterOccupiedRoomCleaning mAdapter;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_occupied_room_cleaning);


        getQrCode = getIntent().getExtras().getString("qrcode");

        init();
        addList();
        adapter();
    }
    private void init(){
        mRecycleview = findViewById(R.id.recyclerview);
    }
    private void addList(){

        ItemsAdapter itemAdapter = new ItemsAdapter();
        itemAdapter.setImage(R.drawable.pillowclean);
        itemAdapter.setUrdutext("sdf");
        itemAdapter.setEnglishText("Pillow Parachute Cover Cleaning");
        mList.add(itemAdapter);

        itemAdapter = new ItemsAdapter();
        itemAdapter.setImage(R.drawable.bedclean);
        itemAdapter.setUrdutext("sdfs");
        itemAdapter.setEnglishText("Patient Bed Cleaning(Blood Spots)");
        mList.add(itemAdapter);

       //... more items




    }
    private void adapter(){
        Log.d("anhtt","mlist : " +mList.size());
        mAdapter = new AdapterOccupiedRoomCleaning(mList, this);
       
        mRecycleview.setAdapter(mAdapter);
        mRecycleview.setLayoutManager(new LinearLayoutManager(this));

    }

}

what am i doing wrong here that it changes color at every 8th item

Answer 1

Since, a Recycler view reuses the views and do not create new views, you need to set default color in onBindViewHolder function.

@Override
public void onBindViewHolder(@NonNull AdapterOccupiedRoomCleaning.ViewHolder viewHolder, int position) {
    ItemsAdapter itemAdapter = mList.get(position);
    ((ViewHolder) viewHolder).setUrduText.setText(itemAdapter.getUrdutext());
    ((ViewHolder) viewHolder).setEnglishText.setText(itemAdapter.getEnglishText());
    ((ViewHolder) viewHolder).setCleaningImage.setImageResource(itemAdapter.getImage());

    // Add this line
    ((ViewHolder) viewHolder).background.setBackgroundColor(Color.parseColor("default color"));

    viewHolder.itemView.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
             viewHolder.background.setBackgroundColor(Color.parseColor("#08A467"));
        }
    });
}

Answer 2

This seems likely to be a problem with the view recycling behavior of RecyclerView .

Generally, you're going to run into problems like this one any time you have some property of your ViewHolder that you only conditionally set inside onBindViewHolder() . That is, because you do not always update the background color of your ViewHolder , you'll get the "wrong" color when it is recycled and reused.

You will have to somehow store the "clicked" or "selected" state in your list of items, and then update the background color of your ViewHolder every time in onBindViewHolder() . Something like this:

@Override
public void onBindViewHolder(@NonNull AdapterOccupiedRoomCleaning.ViewHolder viewHolder, int position) {
    ItemsAdapter itemAdapter = mList.get(position);
    ...

    if (itemAdapter.isSelected()) {
        viewHolder.background.setBackgroundColor(Color.parseColor("#08A467"));
    } else {
        viewHolder.background.setBackgroundColor(Color.parseColor("#FFFFFF"));
    }

    viewHolder.itemView.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            itemAdapter.setSelected(true);
            viewHolder.background.setBackgroundColor(Color.parseColor("#08A467"));
        }
    });
}

Note that it would be better to define the click listener inside onCreateViewHolder() and to use notifyItemChanged() instead of manually updating the background color, but that's outside the scope of this question.