Image from URL not loading in custom adapter

Question

I'm loading data from web service and showing it in ListView. ListView item has only two views - text for item description and image for item image. Data is downloaded and passed to custom adapter in AsyncTask which is executed in onCreate method. Everything works fine except ImageViews are empty.

For downloading images I use ImageLoader class I found on the web. It works fine within example I downloaded, it takes only two parameters - image url and imageview, so I think all is right here.

Am I doing something fundamentally wrong here?

 // Fetch latest items for home screen based on selected city
        private class LatestItems extends AsyncTask<String, Void, String> {

        @Override
        protected String doInBackground(String... loc_id) {

            // For storing data from web service
            String data = "";

            // Downloader object
            UrlDownloader downloader = new UrlDownloader();

            // Building the url to the web service
            String url = "http://www.mywebsite.com/web_services/home_screen_latest_items.php?loc_id="
                    + loc_id[0];

            try {
                // Fetching the data from web service in background
                data = downloader.downloadUrl(url);

            } catch (Exception e) {
                Log.d("Downloader exception", e.toString());
            }
            return data;
        }

        @Override
        protected void onPostExecute(String downloadedData) {
            super.onPostExecute(downloadedData);

            //If web service returned data
            if (downloadedData != null) {
                JSONObject jObject;
                List<HashMap<String, String>> items = null;

                // Instantiate parser
                ItemJSONParser placeJsonParser = new ItemJSONParser();

                try {
                    // Put data into JSON Object and pass it to parser
                    jObject = new JSONObject(downloadedData);
                    items = placeJsonParser.parse(jObject);

                } catch (Exception e) {
                    Log.d("Exception", e.toString());
                }

                // Instantiate adapter. Provide Context, Item layout and
                // DataSource (result)
                ItemPreviewAdapter itemPreview = new ItemPreviewAdapter(
                        getApplicationContext(), R.layout.lvitem_homepage_item,
                        items);

                // Pass each data to from list into to adapter
                for (HashMap<String, String> data : items) {
                    itemPreview.add(data);
                }

                // Set adapter
                latestItemsList.setAdapter(itemPreview);
            }
        }

    }

Item layout:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="#fff"
    android:orientation="vertical"
    android:padding="5dp" >

    <ImageView
        android:id="@+id/ivItemImage"
        android:layout_width="75dp"
        android:layout_height="100dp"
        android:scaleType="centerCrop"
        android:src="@drawable/ic_launcher" />

    <TextView
        android:id="@+id/tvItemName"
        android:layout_width="fill_parent"
        android:layout_height="40dp"
        android:gravity="center_horizontal"
        android:lines="2"
        android:textColor="#000"
        android:textSize="10sp" />

</LinearLayout>

Custom Adapter:

public class ItemPreviewAdapter extends ArrayAdapter<HashMap<String, String>> {

    private final List<HashMap<String, String>> items;
    private final LayoutInflater mLayoutInflater;

    static class ViewHolder {
        TextView tvIname;
        ImageView image;
    }

    public ItemPreviewAdapter(final Context context,
            final int textViewResourceId, List<HashMap<String, String>> map) {
        super(context, textViewResourceId);
        mLayoutInflater = LayoutInflater.from(context);
        this.items = map;

        Log.i("Adapter", items.toString());
    }

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

        ViewHolder holder;

        if (convertView == null) {
            convertView = mLayoutInflater.inflate(
                    R.layout.lvitem_homepage_item, parent, false);

            holder = new ViewHolder();
            holder.tvIname = (TextView) convertView
                    .findViewById(R.id.tvItemName);
            holder.image = (ImageView) convertView
                    .findViewById(R.id.ivItemImage);

            convertView.setTag(holder);

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

        HashMap<String, String> item = items.get(position);

        String id = item.get("id");
        String item_name = item.get("iname");

        holder.tvIname.setText(item_name);

        String image_url = "http://www.mywebsite.com/images/items/cropped_image_list_id_"
                + id + ".png";

        ImageLoader imgLoader = new ImageLoader(getContext());
        imgLoader.DisplayImage(image_url, holder.image);

        return convertView;
    }
}

Answer 1

Please use the context of the activity instead of using getContext() of Adapter class

Context context;


public ItemPreviewAdapter(final Context context,final int textViewResourceId, List<HashMap<String, String>> map) 
{
    super(context, textViewResourceId);
    mLayoutInflater = LayoutInflater.from(context);
    this.items = map;
    this.context=context;

    Log.i("Adapter", items.toString());
}

and use this context to initailize the ImageLoader class in getView method

ImageLoader imgLoader = new ImageLoader(context);

Answer 2

Declare your image loader class to globally and initialize in Constructor.

ImageLoader imgLoader;

 public ItemPreviewAdapter(final Context context,
            final int textViewResourceId, List<HashMap<String, String>> map) {
        super(context, textViewResourceId);
        .....
        .....

       imgLoader = new ImageLoader(context);
    }

Also Remove it from getView Thsts it....