CODEWITHSUNDEEP
androidlistview
tokis
tokis

Reputation: 125

Android Listview load imageview from url

I am loading an image from url and input it to my listview. The problem is that the imageview is changing it's image everytime I'm scrolling the listview.

I used this code from: How to load an ImageView by URL in Android? to load images from url:

public class ImageLoadTask extends AsyncTask<Void, Void, Bitmap> {

    private String url;
    private ImageView imageView;

    public ImageLoadTask(String url, ImageView imageView) {
        this.url = url;
        this.imageView = imageView;
    }

    @Override
    protected Bitmap doInBackground(Void... params) {
        try {
            URL urlConnection = new URL(url);
            HttpURLConnection connection = (HttpURLConnection) urlConnection
                    .openConnection();
            connection.setDoInput(true);
            connection.connect();
            InputStream input = connection.getInputStream();
            Bitmap myBitmap = BitmapFactory.decodeStream(input);
            return myBitmap;
        } catch (Exception e) {
            e.printStackTrace();
        }
        return null;
    }

    @Override
    protected void onPostExecute(Bitmap result) {
        super.onPostExecute(result);
        imageView.setImageBitmap(result);
    }

}

In my ListAdapter i use this code to load up the image:

public View getView(int position, View convertView, ViewGroup parent){
    ViewHolderItem holder = new ViewHolderItem();
    if (convertView == null) {
     LayoutInflater inflater = (LayoutInflater) main.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        convertView = inflater.inflate(R.layout.cell, null);

        holder.name = (TextView) convertView.findViewById(R.id.name);
        holder.thumb = (ImageView) convertView.findViewById(R.id.thumb);
        holder.duration = (TextView) convertView.findViewById(R.id.duration);
        //holder.code = (TextView) convertView.findViewById(R.id.code);
        convertView.setTag(holder);
    }
    else{
         holder = (ViewHolderItem) convertView.getTag();
    }


    holder.name.setText(this.main.countries.get(position).title);
    if (holder.thumb != null) {
        new DownloadImageTask(holder.thumb).execute(this.main.countries.get(position).thumb);
    }
    return convertView;
}

In my main activity:

   public void get_data(String data){
        try {
            JSONArray data_array=new JSONArray(data);
            for (int i = 0 ; i < data_array.length() ; i++){
                JSONObject obj=new JSONObject(data_array.get(i).toString());

                Countries add=new Countries();
                add.title = obj.getString("title");
                add.thumb = obj.getString("artwork_url");

                countries.add(add);
            }

            adapter.notifyDataSetChanged();

        } catch (JSONException e) {
            e.printStackTrace();
        }
    }

Upvotes: 1

Views: 4520

Answers (4)

Rohit Suthar
Rohit Suthar

Reputation: 2693

You need to try image downloading and caching library for ListView. which can make performance faster and load image into ImageView easily.

Picasso and Glide are the best example to load image in ImageView into ListView

Upvotes: 1

dieter_h
dieter_h

Reputation: 2727

Try to use Picasso library. It is very simple to use, eg.

Picasso.with(context).load("http://i.imgur.com/DvpvklR.png").into(imageView);

Picasso has automatic memory and disk caching. It is very important in ListView.

Where can I get the variable name context?

Get context:

@Override
public View getView(int position, View convertView, ViewGroup parent) {
    Context context = parent.getContext();
    [...]
}

Upvotes: 5

Mark O&#39;Sullivan
Mark O&#39;Sullivan

Reputation: 10778

I agree with the existing two answers, the best approach to avoid any headaches and make your life easier would be to use one of the image libraries which are currently available: Picasso and Glide

Glide which is equally as easy to use when compared to Picasso. I have seen a video where the images take longer to load on Picasso when using a list view than compared to Glide however this may be down to configuration settings. Glide also enables the use of GIFs which may or may not be important to you.

Here's an example of using Glide:

ImageView imageView = (ImageView) findViewById(R.id.my_image_view);

Glide.with(this).load("https://lh6.ggpht.com/9SZhHdv4URtBzRmXpnWxZcYhkgTQurFuuQ8OR7WZ3R7fyTmha77dYkVvcuqMu3DLvMQ=w300").into(imageView);

Hope this helps!

Upvotes: 1

Eric B.
Eric B.

Reputation: 4702

You should use an image loading library like Picasso. It makes loading images from URLs really simple and does caching too.

Upvotes: 1

Related Questions