Android ListView with ImageView from URL and TextView

Question

I've currently got a ListView that gets the information from a SimpleAdapter where it feeds the text into TextViews. However, I now want to add an ImageView to the ListView and load the image from a URL and still load the text to the TextView.

Does anyone know how I could do this? Maybe a SimpleAdapter is not to be used in this case?

Thanks, Daniel

Answer 1

Used this tutorial to do it and modified the LazyAdapter class to also edit TextViews.

http://www.technotalkative.com/android-asynchronous-image-loading-in-listview/

Answer 2

You will have to do the following things:

1. create a xml layout for the listview row containing a imageview and a textview.
2. in your activity drop the listview element.
3. write a custom adapter extending the baseadapter to populate the view as you want to.
4. for loading image from url use an image loader library as Android AQuery.

an example for the adapter.

public class Onadapter extends BaseAdapter {
String[] label;
String[] image;

public Onadapter(Context context,String[] label,String[] image)
{

    this.context=context;
    this.image = image;
    this.label = label;

}

private class ViewHolder{
    ImageView img;
    TextView label;

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

    LayoutInflater mInflater = (LayoutInflater) context.getSystemService(Activity.LAYOUT_INFLATER_SERVICE);
    if (convertView == null) {
        convertView = mInflater.inflate(R.layout.list_layout, null);
        holder = new ViewHolder();
        holder.label=(TextView) convertView.findViewById(R.id.textview);
        holder.img = (ImageView) convertView.findViewById(R.id.imageview);
        convertView.setTag(holder);
    }
    else {
        holder = (ViewHolder) convertView.getTag();
    }

     AQuery aq = new AQuery(convertView);

     aq.id(holder.label).text(label[position]);
     aq.id(holder.img).image(image[position], true, true, 0, 0, null, AQuery.FADE_IN_NETWORK, 1.0f);

    return convertView;
}


@Override
    public int getCount() {
        // TODO Auto-generated method stub
        return image1.length;
    }


    @Override
    public long getItemId(int position) {
        // TODO Auto-generated method stub
        return position;
    }


    @Override
    public Object getItem(int position) {
        // TODO Auto-generated method stub
        return null;
    }

Import the AQuery library by downloading the jar version (preferred) and paste it in your libs folder.

Pass in two string arrays for the label and image url. The AQuery library does caching of images too!

Answer 3

SimpleAdapter can handle text only. If you want a list in which each item contains a different image, you must create a custom adapter.

Answer 4

You have to extend BaseAdapter using a new layout where you display ImageView and TextView according to your needs. There are lot of examples in internet. For example:

http://www.technotalkative.com/tag/android-listview-with-two-textview-and-imageview/