开发者

Create colorcoded ListView in Android

My vision is to create a color coded listView, where I want to have a slim colored bar in each item's layout. This bar should be a certain color based on an int I pass to the activity. How do I create such a bar(essentially a filled rectangle) and set its color. Currently, I am using a custom layout for my list and using a SimpleAdapter with an ArrayList.

I know I will have to use

if (integerForColor == someNumber)
    //set the color of the shape, bar

I am sure this is a simple thing that I simply cannot think of at the moment, or must be missing a fundamental. Thank you in advance for your effort.

EDIT 1:

Trying to decode some of the answers that were here, I realized that you guys need my code on how I am building my list:

public开发者_运维问答 class AddScreen extends Activity implements OnClickListener,
    OnItemClickListener, OnItemLongClickListener {
SimpleAdapter adapter;
List<HashMap<String, String>> painItems = new ArrayList<HashMap<String, String>>();
ListView listthings;

public void onCreate(Bundle savedInstanceState) {
from = new String[] { "row_1", "row_2" };
to = new int[] { R.id.row1, R.id.row2 };

adapter = new SimpleAdapter(this, painItems, R.layout.mylistlayout,
            from, to);

listthings.setAdapter(adapter);

}

I have added the getView() Method:

public View getView (int position, View convertView, ViewGroup parent){
    convertView.setBackgroundColor(R.drawable.red);
    return convertView;
      //I have no inflater as of now...
}

Create colorcoded ListView in Android

EDIT 2: As per @huntsfromshadow 's suggestion, I have created a new activity and overridden the getView() method there.

//Imports
 public class Adapter extends SimpleAdapter{

public Adapter(Context context, List<? extends Map<String, ?>> data,
        int resource, String[] from, int[] to) {
    super(context, data, resource, from, to);
    // TODO Auto-generated constructor stub
}
@Override
public View getView(int position, View convertView, ViewGroup parent){
    View row = convertView;
    row.setBackgroundColor(0xFF0000FF);
    return row;

}

}

Unfortunately, it still does not work.


Assuming you have everything else setup, it's probably easiest to define your colored backgrounds in xml like so (red.xml):

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <gradient
        android:startColor="#DD0000"
        android:endColor="#EE0000"
        android:angle="270" />
 </shape>

And then use it like this:

context.getResources().getColor(R.drawable.red).

You'll have to pass in and save a context object from the parent Activity.

Look at the answer I gave on how to create a ListView (yes it's parsing data from JSON - ignore that) here


Create a custom adapter and override getView. That is the point where you can do any complicated layout decisions based on values and logic.

A google search for custom adapter will give you a lot of resources.


As @CaspNZ said, use .xml shape files.

In your code extend a 'ListAdapter' (probably either BaseAdapter or ArrayAdapter). Override the getView function like this:

public View getView (int position, View convertView, ViewGroup parent){
    if (convertView == null){
        //assuming you already have inflater initilized somewhere
        convertView = inflater.inflate(you_layout_file.xml, parent, false);
    }

    //some logic to determine what color the background should be
    convertView.setBackgroundDrawable(R.drawable.the_file_you_want_to_use.xml)
}


I hacked together something very similar to color code the text of each item differently. You could adapt it pretty easily to change the color of a bar instead.

Since each element in the list has a different color, you have to remember which color is associated with which location in the array. I just used a simple integer array as a member of my ColorItemsAdapter.

private class ColorItemsAdapter extends ArrayAdapter<String>
{
    /*
     * For each line to be added to the log, the text is stored in "items"
     * and the text color is stored in "colors"
     */
    ArrayList<String> items = new ArrayList<String>();
    ArrayList<Integer> colors = new ArrayList<Integer>();
    int length = 0;

    public ColorItemsAdapter(Context context, int textViewResourceId, List<String> stringObj)
    {
        super(context, textViewResourceId, stringObj);
        if(stringObj != null)
        {
            length = stringObj.size();
        }
    }

    /**
     * Adds an item to the adapter, and specifies what color the item should be
     * @param item
     * The text to be added
     * @param color
     * The color of the text to be added
     */
    public void add(String item, Integer color)
    {
        items.add(item);
        colors.add(color);
        length++;
        super.add(item);
    }

    /**
     * Adds an item to the adapter at position <i>index</i>
     * @param item
     * The text to be inserted
     * @param index
     * The index at which to insert the text
     * @param color
     * The color of the text to be inserted
     */
    public void insert(String item, int index, Integer color)
    {
        items.add(index, item);
        colors.add(index, color);
        length++;
        super.insert(item, index);
    }

    /*
     * Changes the color of the TextView appropriately before calling the super
     */
    public View getView(int position, View convertView, ViewGroup parent)
    {
        TextView v = (TextView) convertView;
        if (v == null)
        {
            LayoutInflater vi = (LayoutInflater)getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            v = (TextView) vi.inflate(R.layout.log_list_item, null);
        }

        /*
         * Here I am setting the text color
         * but you could set some other attribute instead.
         */
        v.setTextColor(colors.get(position));

        return super.getView(position, v, parent);
    }
}

Then, to add an item to your list (in this case a red one), you could just use

myColorItemsAdapter.insert(message, 0, Color.RED);
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜