Categories
android image listview universal-image-loader url

How to lazy load images in ListView in Android

2048

I am using a ListView to display some images and captions associated with those images. I am getting the images from the Internet. Is there a way to lazy load images so while the text displays, the UI is not blocked and images are displayed as they are downloaded?

The total number of images is not fixed.

6

  • 13

    You can use GreenDroid’s AsyncImageView. Just call setUrl.

    Dec 9, 2011 at 15:11

  • 8

    I have used it. It is a wonderful implementation. Bad news that AsyncImageView is a part of a large GreenDroid project, which make your application larger even in the case all you need is AsyncImageView. Also, seems, GreenDroid project is not updated since 2011.

    – borisstr

    Apr 15, 2012 at 11:06

  • 6

    You can even give a try to this library : Android-http-image-manager which in my opinion is the best for asynchronous loading of images.

    Nov 9, 2012 at 11:43

  • 36

    Just use Picasso, it will do all itself. ‘Picasso.with(yourContext).load(img src/path/drawable here).into(imageView i.e your target);’ Thats it!

    Jan 23, 2014 at 6:40


  • 9

    try using :github.com/nostra13/Android-Universal-Image-Loader , this library is very fast and efficient for lazy loading and image caching

    Aug 16, 2014 at 5:44

1141

Here’s what I created to hold the images that my app is currently displaying. Please note that the “Log” object in use here is my custom wrapper around the final Log class inside Android.

package com.wilson.android.library;

/*
 Licensed to the Apache Software Foundation (ASF) under one or more
contributor license agreements.  See the NOTICE file
distributed with this work for additional information
regarding copyright ownership.  The ASF licenses this file
to you under the Apache License, Version 2.0 (the
"License"); you may not use this file except in compliance
with the License.  You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing,
software distributed under the License is distributed on an
"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, either express or implied.  See the License for the
specific language governing permissions and limitations
under the License.
*/
import java.io.IOException;

public class DrawableManager {
    private final Map<String, Drawable> drawableMap;

    public DrawableManager() {
        drawableMap = new HashMap<String, Drawable>();
    }

    public Drawable fetchDrawable(String urlString) {
        if (drawableMap.containsKey(urlString)) {
            return drawableMap.get(urlString);
        }

        Log.d(this.getClass().getSimpleName(), "image url:" + urlString);
        try {
            InputStream is = fetch(urlString);
            Drawable drawable = Drawable.createFromStream(is, "src");


            if (drawable != null) {
                drawableMap.put(urlString, drawable);
                Log.d(this.getClass().getSimpleName(), "got a thumbnail drawable: " + drawable.getBounds() + ", "
                        + drawable.getIntrinsicHeight() + "," + drawable.getIntrinsicWidth() + ", "
                        + drawable.getMinimumHeight() + "," + drawable.getMinimumWidth());
            } else {
              Log.w(this.getClass().getSimpleName(), "could not get thumbnail");
            }

            return drawable;
        } catch (MalformedURLException e) {
            Log.e(this.getClass().getSimpleName(), "fetchDrawable failed", e);
            return null;
        } catch (IOException e) {
            Log.e(this.getClass().getSimpleName(), "fetchDrawable failed", e);
            return null;
        }
    }

    public void fetchDrawableOnThread(final String urlString, final ImageView imageView) {
        if (drawableMap.containsKey(urlString)) {
            imageView.setImageDrawable(drawableMap.get(urlString));
        }

        final Handler handler = new Handler(Looper.getMainLooper()) {
            @Override
            public void handleMessage(Message message) {
                imageView.setImageDrawable((Drawable) message.obj);
            }
        };

        Thread thread = new Thread() {
            @Override
            public void run() {
                //TODO : set imageView to a "pending" image
                Drawable drawable = fetchDrawable(urlString);
                Message message = handler.obtainMessage(1, drawable);
                handler.sendMessage(message);
            }
        };
        thread.start();
    }

    private InputStream fetch(String urlString) throws MalformedURLException, IOException {
        DefaultHttpClient httpClient = new DefaultHttpClient();
        HttpGet request = new HttpGet(urlString);
        HttpResponse response = httpClient.execute(request);
        return response.getEntity().getContent();
    }
}

11

  • 109

    I think you should use SoftReferences so that your program will never cause OutOfMemoryException. As GC can clear softreferences when heap size is increasing… you can manage your own generation like after some seconds you can put your images to that list and before loading you should check that if image exists then don’t download it again rather collect it from that list and also putting it back to your softref list and after sometime you can purge your hardlist 🙂

    – AZ_

    Jan 18, 2011 at 8:08

  • 41

    Google Shelves project is an excellent example look how they did code.google.com/p/shelves

    – AZ_

    Jan 18, 2011 at 8:09

  • 14

    Don’t you miss a return when drawableMap contains the image … without starting the fetching-thread?

    – Karussell

    Mar 29, 2011 at 22:06

  • 7

    This code has several problems. Firstly you should cache Drawables, that will cause a memory leak: stackoverflow.com/questions/7648740/… . Secondly the cache itself is never cleared so it will grow forever, that’s another memory leak.

    Nov 15, 2011 at 5:35


  • 12

    haven’t any one heard about LRU Cache developer.android.com/training/displaying-bitmaps/…

    May 28, 2013 at 7:26

1051

I made a simple demo of a lazy list (located at GitHub) with images.

Basic Usage

ImageLoader imageLoader=new ImageLoader(context); ...
imageLoader.DisplayImage(url, imageView); 

Don’t forget to add the
following permissions to your AndroidManifest.xml:

 <uses-permission android:name="android.permission.INTERNET"/>
 <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/> Please

create only one instance of ImageLoader and reuse it all around your
application. This way image caching will be much more efficient.

It may be helpful to somebody. It downloads images in the background thread. Images are being cached on an SD card and in memory. The cache implementation is very simple and is just enough for the demo. I decode images with inSampleSize to reduce memory consumption. I also try to handle recycled views correctly.

Alt text

0

    565

    I recommend open source instrument Universal Image Loader. It is originally based on Fedor Vlasov’s project LazyList and has been vastly improved since then.

    • Multithread image loading
    • Possibility of wide tuning ImageLoader’s configuration (thread executors, downloader, decoder, memory and disc cache, display image options, and others)
    • Possibility of image caching in memory and/or on the device’s file system (or SD card)
    • Possibility to “listen” loading process
    • Possibility to customize every display image call with separated options
    • Widget support
    • Android 2.0+ support

    0