Chage button text after clicking it in android each listview item

Question

I have a listview which set up by using a custom listAdapter. There is a 'Like' button in each listView item to like. After clicking button I need to change the text of this button to 'Unlike'. But the following code changes the text of all items buttons to 'Unlike'. How to solve it.

@Override
public View getView(int position, View convertView, final ViewGroup parent) {

    final HomeItem hi = itemsArrayList.get(position);
    String type = hi.getType();

    final ViewHolder viewHolder;

    if(convertView==null) { 

        if(type.equalsIgnoreCase("Job")) {
            convertView = mInflater.inflate(R.layout.home_row, null);
        } else if(type.equalsIgnoreCase("Work")) {
            convertView = mInflater.inflate(R.layout.home_row_work, null);
        }

        viewHolder = new ViewHolder();
        viewHolder.pic = (ImageView) convertView.findViewById(R.id.pic);
        viewHolder.lblCaptionName = (TextView) convertView.findViewById(R.id.caption_name);
        viewHolder.lblCaptionText = (TextView) convertView.findViewById(R.id.caption_text);
        viewHolder.lblCaptionItem = (TextView) convertView.findViewById(R.id.caption_item);
        viewHolder.lblTime = (TextView) convertView.findViewById(R.id.time);

        if(type.equalsIgnoreCase("Job")) {
            JobViewHolder jobHolder;
            jobHolder = new JobViewHolder();
            jobHolder.lblCategory = (TextView) convertView.findViewById(R.id.category);
            jobHolder.lblPost = (TextView) convertView.findViewById(R.id.post);
            jobHolder.btnLike = (Button) convertView.findViewById(R.id.likeBtn);
            viewHolder.jobViewHolder = jobHolder;
        } else {
            WorkViewHolder workHolder;
            workHolder = new WorkViewHolder();
            workHolder.lblTitle = (TextView) convertView.findViewById(R.id.title);
            workHolder.lblDescription = (TextView) convertView.findViewById(R.id.description);
            workHolder.btnLike = (Button) convertView.findViewById(R.id.likeBtn);
            viewHolder.workViewHolder = workHolder;
        }
        convertView.setTag(viewHolder);
    } else {
        viewHolder = (ViewHolder) convertView.getTag();
    }

    viewHolder.lblCaptionName.setText(app.buildString(context, "<u>"+hi.getName()+"</u>",hi.getName()));
    viewHolder.lblCaptionName.setMovementMethod(LinkMovementMethod.getInstance());
    viewHolder.lblCaptionName.setLinkTextColor(Color.BLACK);

    viewHolder.lblCaptionText.setText(hi.getCaption());

    viewHolder.lblCaptionItem.setText(app.buildStringToOpenJobActivity(context, "<u>"+hi.getPost()+"</u>",hi.getUid()));
    viewHolder.lblCaptionItem.setMovementMethod(LinkMovementMethod.getInstance());
    viewHolder.lblCaptionItem.setLinkTextColor(Color.BLACK);

    viewHolder.lblTime.setText(hi.getDate());

    if(type.equalsIgnoreCase("Job")) {
        if(viewHolder.jobViewHolder!=null) {
            viewHolder.jobViewHolder.lblCategory.setText(hi.getJobItem().getCategory());
            viewHolder.jobViewHolder.lblPost.setText(hi.getJobItem().getPost());

            viewHolder.jobViewHolder.btnLike.setOnClickListener(new View.OnClickListener() {
                public void onClick(View v) {

                    viewHolder.jobViewHolder.btnLike.setText("Unlike");

                }
            });
        }

    } else if(type.equalsIgnoreCase("Work")) {
        if(viewHolder.workViewHolder!=null) {
            viewHolder.workViewHolder.lblTitle.setText(hi.getWorkItem().getTitle());
            viewHolder.workViewHolder.lblDescription.setText(hi.getWorkItem().getDescription());

            viewHolder.workViewHolder.btnLike.setOnClickListener(new View.OnClickListener() {
                public void onClick(View v) {

                    viewHolder.workViewHolder.btnLike.setText("Unlike");

                }
            });
        }
    }

    if (hi.getImage() != null) {
        viewHolder.pic.setImageBitmap(hi.getImage());
    } else {
        viewHolder.pic.setImageResource(R.drawable.user);
    }     

    return convertView;
}


static class ViewHolder {
    ImageView pic;
    TextView lblCaptionName;
    TextView lblCaptionText;
    TextView lblCaptionItem;
    TextView lblTime;
    JobViewHolder jobViewHolder;
    WorkViewHolder workViewHolder;
}

static class JobViewHolder {
    TextView lblCategory;
    TextView lblPost;
    Button btnLike;
}

static class WorkViewHolder {
    TextView lblTitle;
    TextView lblDescription;
    Button btnLike;
}

Answer 1

You need to save the like status in your data source. The ListView 's rows are reused once they are out of view, so as soon as you set one to be liked, it will be reused for another row that will seem liked as well.

Just add a class member called liked or similar to your datasource class (seems to be HomeItem in your case), set that in your onClickListener (you might want to set btnLike 's tag to the row index, so you know which item you have to modify), and then call notifyDataSetChanged() on your adapter.

You'll also have to add code that marks a row as liked depending on the datasource item's value.