On scrolling recyclerview changes disappeared

Question

I created a vocabulary android app where we can add words to favorites by clicking the star icon near the word. On clicking the star icon it changes to solid star icon but if we scroll the RecyclerView than the solid star icon will again change to the normal star icon.

Image before scrolling:

Image after scrolling:

Here is the code:

public class WordListAdapter extends RecyclerView.Adapter<WordListViewHolder> {

    TextToSpeech ttsObject;

    private List<WordListModel> mWordList;
    private Context context;
    private Activity activity;
    private int result;

    public WordListAdapter(TextToSpeech ttsObject, int result) {
        this.ttsObject = ttsObject;
        this.result = result;
    }

    public WordListAdapter(List<WordListModel> mWordList, Context context, TextToSpeech ttsObject, int result) {
        this.mWordList = mWordList;
        this.context = context;
        activity = (Activity)context;
        this.result = result;
        this.ttsObject = ttsObject;
    }

    @Override
    public WordListViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(parent.getContext())
                .inflate(R.layout.word_list_layout,parent,false);

        return new WordListViewHolder(view);
    }

    @Override
    public void onBindViewHolder(final WordListViewHolder holder, final int position) {

        final WordListModel wordmeaning = mWordList.get(position);
        holder.mNameTv.setText(wordmeaning.getmWord());
        holder.mNameTv.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {

                if (result == TextToSpeech.LANG_NOT_SUPPORTED || result == TextToSpeech.LANG_MISSING_DATA){
                    Toast.makeText(activity,"Feature Not Support in your Device",Toast.LENGTH_LONG).show();
                }else {
                    ttsObject.speak(wordmeaning.getmWord(), TextToSpeech.QUEUE_FLUSH, null);
                }
            }
        });
        holder.mMeaningTv.setText(wordmeaning.getmMeaning());
        holder.mMeaningTv.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                if (result == TextToSpeech.LANG_NOT_SUPPORTED || result == TextToSpeech.LANG_MISSING_DATA){
                    Toast.makeText(activity,"Feature Not Support in your Device",Toast.LENGTH_LONG).show();
                }else {
                    ttsObject.speak(wordmeaning.getmMeaning(), TextToSpeech.QUEUE_FLUSH, null);
                }
            }
        });

        holder.mFavIv.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {

                DatabaseHelper mydb = new DatabaseHelper(context);

                try {
                    if (wordmeaning.getIsFav().equals("false")){
                        boolean check = mydb.updateData("true",wordmeaning.getmWord(),wordmeaning.getDbTable());
                        if (check){
                            holder.mFavIv.setImageResource(R.drawable.ic_star_black_24dp);
                        }
                        Log.d("TAG",Boolean.toString(check));
                    }else {
                        boolean check = mydb.updateData("false",wordmeaning.getmWord(),wordmeaning.getDbTable());
                        if (check){
                            holder.mFavIv.setImageResource(R.drawable.ic_star_border_black_24dp);
                        }
                        Log.d("TAG",Boolean.toString(check));
                    }
                }catch (Exception e){
                    Log.d("TAG",e.toString());
                }

            }
        });

        if (wordmeaning.getIsFav().equals("false")){
            holder.mFavIv.setImageResource(R.drawable.ic_star_border_black_24dp);
        }else {
            holder.mFavIv.setImageResource(R.drawable.ic_star_black_24dp);
        }

    }

    @Override
    public int getItemCount() {
        return mWordList.size();
    }

Munir · Accepted Answer · 2017-12-11T19:23:26.607

it's beacuse the view is recycled when you scroll. Here you just updated value in db but not in list, so you also want to updated the value in arrayList as you want to keep track of items so change your code of mFavIv Onclick method like below

 holder.mFavIv.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {

            DatabaseHelper mydb = new DatabaseHelper(context);

            try {
                if (wordmeaning.getIsFav().equals("false")){
                    boolean check = mydb.updateData("true",wordmeaning.getmWord(),wordmeaning.getDbTable());
                    if (check){
                        holder.mFavIv.setImageResource(R.drawable.ic_star_black_24dp);
                        wordmeaning.setIsFav("true"); // updted your arryListvalue
                    }
                    Log.d("TAG",Boolean.toString(check));
                }else {
                    boolean check = mydb.updateData("false",wordmeaning.getmWord(),wordmeaning.getDbTable());
                    if (check){
                        holder.mFavIv.setImageResource(R.drawable.ic_star_border_black_24dp);
                       wordmeaning.setIsFav("false");  // updted your arryListvalue
                    }
                    Log.d("TAG",Boolean.toString(check));
                }
            }catch (Exception e){
                Log.d("TAG",e.toString());
            }

        }
    });

On scrolling recyclerview changes disappeared

Image before scrolling:

Image after scrolling:

Here is the code:

1 Answers1