Question

I have the following issue. I have a ListViewand I am using a custom adapter extending the ArrayAdapterclass. In each row there is a follow Button, when I click on it I need to change its style.

So far I have:

public View getView(final int position, View convertView, ViewGroup parent) {
        View vi = convertView;

        if (convertView == null) {  
            vi = inflater.inflate(R.layout.people_item, null);

            mViewHolder = new ViewHolder();              
            mViewHolder.follow = (Button) vi.findViewById(R.id.people_item_btn_follow);
            mViewHolder.name = (TextView)....
            vi.setTag(mViewHolder);         
        } else {
            mViewHolder = (ViewHolder) convertView.getTag();
        }

        mViewHolder.follow.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                // Changing the style of the button
                if(mData[position].getFollow().equals("0")) {
                    mViewHolder.follow.setBackgroundDrawable(mCtx.getResources().getDrawable(R.drawable.unfollow_button_border));
                    mViewHolder.follow.setText(mCtx.getString(R.string.unfollow));
                } else {
                    mViewHolder.follow.setBackgroundDrawable(mCtx.getResources().getDrawable(R.drawable.follow_button_border));
                    mViewHolder.follow.setText(mCtx.getString(R.string.follow));
                }

                mSharedAsyncTasks.getFollowerTask().execute(mData[position].getId());
            }
        });

        if(mData[position] != null) {
            // Setting data
        }

        return vi;
    }

private static class ViewHolder {
    TextView fullName;
    Button follow;
}

The problem is that when clicking on a button of any row, the new style is applied on the button of another row (although the effect of the following is being applied to the right row).

I know it has to do with the fact that the row are getting recycled/reused.

But how to actually solve this?

Thanks!

Answer 1

Not sure you want to do the following.

 public void onClick(View v) {
      mViewHolder.follow.setBackgroundDrawable(mCtx.getResources().getDrawable(R.drawable.unfollow_button_border));
      ...
 }

Specifically, the issue i think is your referencing mViewHolder which looks like its hanging around and could point to any button as you scroll. Its a scoping issue that you should be able to resolve with the following. in the onClick(View v) v i believe is the button you’ve clicked.

Instead you should be able to do the following

 public void onClick(View v) {
      ((Button)v).setBackgroundDrawable(mCtx.getResources().getDrawable(R.drawable.unfollow_button_border));
      ...
 }