When selecting a cell in GridView/ListView, it selects another cell too

I have a GridView where each cell contains an ImageView and TextView. When a user clicks on a cell, it changes the background color of that cell to Gray. However, when I scroll down, another cell is also selected (i.e. the background color is gray).

My guess is that this is because the cell reuses the same view as the cell that was just hidden when scrolling down.

This also happens when I change the orientation. If I select cell 1, when I change the orientation, another cell is now selected and cell 1 is not.

Th开发者_JS百科anks in advance.

public class LazyFeaturedTopicItemAdapter extends BaseAdapter {

private Activity activity;
private ArrayList<Topic> topics;
private static LayoutInflater inflater=null;
public PostItemImageLoader imageLoader; 

public LazyFeaturedTopicItemAdapter(Activity a, ArrayList<Topic> d) {
    activity = a;
    topics=d;
    inflater = (LayoutInflater)activity.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    imageLoader=new PostItemImageLoader(activity.getApplicationContext());
}

public int getCount() {
    return topics.size();
}

public Object getItem(int position) {
    return position;
}

public long getItemId(int position) {
    return position;
}

public static class ViewHolder{
    public ImageView imgThumbnail;
    public TextView txtName;
}

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

    final Topic topicItem = topics.get(position);

    if(convertView==null){
        vi = inflater.inflate(R.layout.featured_topic_item, null);
        holder=new ViewHolder();
        holder.txtName = (TextView) vi.findViewById(R.id.featured_topic_item_name);
        holder.imgThumbnail = (ImageView)vi.findViewById(R.id.featured_topic_item_thumbnail);

        vi.setTag(holder);
    }
    else
        holder=(ViewHolder)vi.getTag();
        holder.txtName.setText(topicItem.getName());                                     

    holder.imgThumbnail.setTag(topicItem.getPictureLink());
    imageLoader.DisplayImage(topicItem.getPictureLink(), activity, holder.imgThumbnail);

    vi.setOnClickListener(
            new View.OnClickListener() {

                @Override
                public void onClick(final View v) {

                    if (topicItem.isSelected) {
                        v.setBackgroundColor(Color.WHITE);
                        topicItem.isSelected = false;
                    }
                    else {
                        v.setBackgroundColor(Color.GRAY);
                        topicItem.isSelected = true;
                    }
                }

            }
    );
    return vi;
}
}

Here is the solution in case anybody is interested. I added the following code before the listener.

    if (topicItem.isSelected) {
        vi.setBackgroundColor(Color.GRAY);
    }
    else {
        vi.setBackgroundColor(Color.WHITE);
    }

You are right in your guess, the view is being reused In order to solve the problem, you could add

vi.setBackgroundColor(Color.WHITE);
topicItem.isSelected = false;

just before setting the listener, see it as the 'default' behavior

I hope that helps