app is slow with images in android

Question

I am doing a app on images to show them in GridView, i am fetching 20 images from server. Resolution of the each image is 720*540.I used JSON parsing to fetch url and used below code to convert into Bitmap in order to set images.

public static Bitmap loadImageFromUrl(String url) {
    InputStream inputStream;Bitmap b;
    try {
        inputStream = (InputStream) new URL(url).getContent();
        BitmapFactory.Options bpo=  new BitmapFactory.Options();
        if(bpo.outWidth>500) {
            bpo.inSampleSize=8;
            b=BitmapFactory.decodeStream(inputStream, null,bpo );
        } else {
            bpo.inSampleSize=2;
            b=BitmapFactory.decodeStream(inputStream, null,bpo );
        }
        return  b;
    } catch (IOException e) {
        throw new RuntimeException(e);
    }
}

my app is working fine but it is taking too much time to load the images. So that my app became slow. Should i decrease the resolution of images?

how to come out of the issue?

Answer 1

If you are doing a grid view to load 20 images of such resolution, I would suggest the following:

1. Definitely reduce the size of the images. Unless you are targeting a tablet, you will be fine as most smartphones cannot achieve that resolution with 20 images.

2. Cache images if you can.

3. Download the images on a different thread. Store a HashMap would make it easy for you, just put all the imageviews with the image file names or other form of IDs as keys. send message to your Handler when images are downloaded and update the view after it's decoded. You can retrieve your views directly. Just remember to check if they are still in the window. This way the images will show up one after another quickly. I don't think multithreading the images will help, just make sure to use another thread to "push the images" and the main UI thread updates. User experience will be greatly improved then.

Hope this helps.

---some implementations, I don't have the complete code with me right now---

Have a data structure to match the views with data that comes in. very handy here.

private HashMap<String,ImageView> pictures;

When you get the list of image urls, iterate through them:

 pictures.put(id,view);
        try{
            FileInputStream in = openFileInput(id);
            Bitmap bitmap = null;
            bitmap = BitmapFactory.decodeStream(in, null, null);
        view.setImageBitmap(bitmap);
        }catch(Exception e){
            new Thread(new PictureGetter(this,mHandler,id)).start();
        }

(Here the picture getter will simply fetch the image if it is not cached already and cache it)

Code to update the image view:

 if(id!=null){
        ImageView iv = pictures.get(id);
        if(iv!=null){
            try{
                FileInputStream in = openFileInput(id);
                Bitmap bitmap = null;
                bitmap = BitmapFactory.decodeStream(in, null, null);
                iv.setImageBitmap(bitmap);
            }catch(Exception e){
        }
    }