ListView from XML with custom ImageView

Question

I'm populating a layout from an XML. I don't really understand the tutorial so I can only get TextViews populated. How do I dynamically assign an image resource to the ImageView each list item has?

What I'm currently doing:

    ArrayList<HashMap<String, String>> menuItems = new ArrayList<HashMap<String, String>>();

    XMLParser parser = new XMLParser();
    String xml = parser.getXmlFromResource(getApplicationContext(),
            R.raw.symbols);
    Document doc = parser.getDomElement(xml); // getting DOM element

    NodeList nl = doc.getElementsByTagName(KEY_SYMBOL);
    // looping through all item nodes <item>
    for (int i = 0; i < nl.getLength(); i++) {
        // creating new HashMap
        HashMap<String, String> map = new HashMap<String, String>();
        Element e = (Element) nl.item(i);
        // adding each child node to HashMap key => value
        map.put(KEY_NAME, parser.getValue(e, KEY_NAME));
        map.put(KEY_FILENAME, parser.getValue(e, KEY_FILENAME));
        map.put(KEY_ABBR, parser.getValue(e, KEY_ABBR));
        map.put(KEY_ELEMENT, parser.getValue(e, KEY_ELEMENT));

        // adding HashList to ArrayList
        menuItems.add(map);
    }

    // Adding menuItems to ListView
    ListAdapter adapter = new SimpleAdapter(this, menuItems,
            R.layout.symbol_list_item, new String[] { KEY_NAME,
                    KEY_FILENAME, KEY_ABBR, KEY_ELEMENT }, new int[] {
                    R.id.name, R.id.filename, R.id.abbr, R.id.element });

    setListAdapter(adapter);

And if it matters, I'm not simply setting a drawable for an ImageView. I'm using the custom SVGImageView from the androidSVG library. What I have working on a different activity for dynamically pulling the SVG file is this:

symbolImageView = (SVGImageView) findViewById(R.id.symbolImage);
symbolImageView.setImageResource(this.getResources().getIdentifier(symbol.getFilename(), "raw", this.getPackageName()));

And this is what it looks like currently with my placeholder ImageViews:

enter image description here

You need to make a custom adapter, a class that extends, likely, BaseAdapter. Within that classes getView() method you need to determine the text string and then set your background image based on that. — zgc7009, Apr 10 '14 at 20:10
Here is a good sample adapter for a simple list http://stackoverflow.com/questions/8166497/custom-adapter-for-list-view — zgc7009, Apr 10 '14 at 20:10
Using a custom adapter is what I needed to do. I can't set your comment as an answer though. — Zeek Aran, Apr 11 '14 at 15:00

score 1 · Accepted Answer · edited May 23 '17 at 11:49

Just to have the answer up, your issue was in lacking an adapter that determined the view in the list and dynamically set that view's background. The Simple Adapter provided by Android doesn't really expand past the basics. It takes a list and represents it visually on the screen, there isn't a lot of flexibility with it. However, you can create a class that extends an Adapter, like BaseAdapter, and then expands on its basic functionality. This is mostly done in getView(). A basic layout is something like:

public class ListAdapter extends BaseAdapter {
    Context context;
    int resource;
    List<Item> items = new List<Item>();

public ListAdapter(Context context, int resource, List<Item> items) {
    super(context, resource, items);
    this.context = context;
    this.resource = resource;
    this.items = items;
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {
    if(convertView == null){
        LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        convertView = inflater.inflate(resource, parent, false);
    }

    // Dynamically work with each view in the list
}

A more complex example can be seen in this stack answer Custom Adapter for List View

score 0 · Answer 2 · answered Apr 10 '14 at 20:07

0

Try to use setBackgroundResource instead of setImageResource:

symbolImageView.setBackgroundResource(this.getResources().getIdentifier(symbol.getFilename(), "raw", this.getPackageName()));

answered Apr 10 '14 at 20:07

betteroutthanin

7,148
8
29
48

Where does this code go? That's the part I'm confused about. – Zeek Aran Apr 10 '14 at 20:09
You are using `setImageResource`, try to use `setBackgroundResource` – betteroutthanin Apr 10 '14 at 20:10
1

I don't think that is the problem, I think the problem is that he needs to be able to dynamically set the background based on other values in the list – zgc7009 Apr 10 '14 at 20:27

ListView from XML with custom ImageView

2 Answers2