How specific a unique color to each row item of listview on android?

Question

I had a listview that fill from content of database, for that I wrote a custom arrayadapter. I need every item in listview have a unique color as ribbon on one side. same as down part of following photo Flat Design

but my list have 20 items therefore scrolled. when I scrolled down and up the position of color get change. This is happened while it just enter to switch/case just for a first time when rowItem.getIds() is equals to 0 or 1 or 2. I just see the the first System.out.println with the "UP" string every times that scrolled, but the others(Other system.out.println without "UP") just one times.for clearance I attached my codes:

public class CustomListViewAdapter extends ArrayAdapter<RowItem> {
Context context;
String fontType = "";
float fontSize;
int resourceID;

int colour = 0;
int dif = 0;

public CustomListViewAdapter(Context context, int resourceId,
        List<RowItem> items) {
    super(context, resourceId, items);
    this.context = context;
    resourceID = resourceId;

}

private class ViewHolder {
    TextView txtTitle;
    View img;
}

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

    ViewHolder holder = null;
    RowItem rowItem = getItem(position);

    System.out.println("UP " + rowItem.getIds() + "  " + rowItem.getTitle());

    Typeface type;

    LayoutInflater mInflater = (LayoutInflater) context
            .getSystemService(Activity.LAYOUT_INFLATER_SERVICE);

    if (convertView == null) {
        convertView = mInflater.inflate(R.layout.indexitem_row, null);
        holder = new ViewHolder();
        holder.txtTitle = (TextView) convertView
                .findViewById(R.id.textOfRowWithImage);

        if (colour == 0)
            switch (rowItem.getIds()) {
            case 0:
                holder.img = convertView.findViewById(R.id.sidebar);
                holder.img.setBackgroundColor(Color.rgb(52, 73, 92));
                System.out.println(rowItem.getIds() + "  "
                        + rowItem.getTitle());
                break;
            case 1:
                holder.img = convertView.findViewById(R.id.sidebar);
                holder.img.setBackgroundColor(Color.rgb(244, 179, 80));
                System.out.println(rowItem.getIds() + "  "
                        + rowItem.getTitle());
                break;
            case 2:
                holder.img = convertView.findViewById(R.id.sidebar);
                holder.img.setBackgroundColor(Color.rgb(92, 151, 191));
                System.out.println(rowItem.getIds() + "  "
                        + rowItem.getTitle());
                break;

            }
        else
            holder.img.setBackgroundColor(colour);

        convertView.setTag(holder);
    } else
        holder = (ViewHolder) convertView.getTag();



    holder.txtTitle.setTextSize(fontSize);

    holder.txtTitle.setText(rowItem.getTitle());

    return convertView;
}



public void setSidebarColor(int i) {
    colour = i;
}
   }

the RowItemClass:

public class RowItem {
    private String title;
    private String desc;
    int numbers;

    public RowItem(String title, int i) {
        this.title = title;
        this.numbers = i;
    }

    public RowItem(String title, String desc) {
        this.title = title;
        this.desc = desc;
    }

    public String getDesc() {
        return desc;
    }

    public void setDesc(String desc) {
        this.desc = desc;
    }

    public String getTitle() {
        return title;
    }

    public Integer getIds() {
        return numbers;
    }

    public void setTitle(String title) {
        this.title = title;
    }

    @Override
    public String toString() {
        if (desc != null)
            return title + "\n " + desc;
        else
            return title;
    }

}

and in main class I put rowItem as follow

rowItems = new ArrayList<RowItem>();
        for (int i = 0; i < poemtype.size(); i++) {
            RowItem item = new RowItem(poemtype.get(i), i);
            rowItems.add(item);
        }

I used position before used rowItem.getIds() but that was have same result, I tried "rowItem.getIds()" because I understand position depend on the move up and down get change and is the position of item that show on device.

where you changed value of `colour`? you need put that if (set color) outside of if else of checking `convertView` — Shayan Pourvatan, Jun 29 '14 at 07:07
I used colour!= 0 for colored all the part with the same color and change value of that on public void setSidebarColor(int i) method. — user3752236, Jun 29 '14 at 07:12
put `if (colour == 0) switch (rowItem.getIds()) {` out side of if statement, and put that after `else holder = (ViewHolder) convertView.getTag();` — Shayan Pourvatan, Jun 29 '14 at 07:13
You set the color value depend on the `rowItem.getIds()`.such as `Color(rowItem.getIds()%255,34,34)`,something like this. — penkzhou, Jun 29 '14 at 07:34
No guys none of them doesn't work for me. when I scrolled down and up colored more rows. Maybe I must change the position of that but I don't have any idea to where. — user3752236, Jun 29 '14 at 07:50

score 2 · Accepted Answer · answered Jun 29 '14 at 08:04

This problem is due to view recycling by ListView. Whenever items are scrolled out of the screen, their views are placed in a recycler, and are passed again to the Adapter's getView(), as the convertView parameter. This is a performance optimization.

A consequence of this is that you must "completely reset" any view properties that you customize in getView(). Otherwise, the properties from the recycled view will be shown.

In short, you should change the background color of img always, not only when convertView == null. Something like this:

if (convertView == null)
{
    convertView = mInflater.inflate(R.layout.indexitem_row, null);
    holder = new ViewHolder();
    holder.img = convertView.findViewById(R.id.sidebar);
    // ... assign other holder fields.
    convertView.setTag(holder);
}
else
    holder = (ViewHolder) convertView.getTag();

int color = getColorForRow(position);
holder.img.setBackgroundColor(color);
// continue ...

How specific a unique color to each row item of listview on android?

1 Answers1