Display Image in Listview with AsyncTask

Question

I am trying to display images in a listview with AsyncTask but I am getting an error. Saying...

Attempt to invoke virtual method 'java.lang.String java.lang.Object.toString()' on a null object reference

This is error is happening on

public LoadImage(ImageView imv) {
        this.imv = imv;
        this.path = imv.getTag().toString();
}

And

    LoadImage loadImage = new LoadImage(imageView);
    Bitmap bitmap = loadImage.doInBackground();

Here is LoadImage.java

import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.drawable.BitmapDrawable;
import android.os.AsyncTask;
import android.os.Environment;
import android.view.View;
import android.widget.ImageView;

import java.io.File;

/**
 * Created by Yudii on 27/05/2016.
 */
class LoadImage extends AsyncTask<Object, Void, Bitmap>{

    private ImageView imv;
    private String path;

    public LoadImage(ImageView imv) {
        this.imv = imv;
        this.path = imv.getTag().toString();
    }

    @Override
    protected Bitmap doInBackground(Object... params) {

        Bitmap bitmap = null;
        File file = new File(Environment.getExternalStorageDirectory()
                .getAbsolutePath() + path);

        if (file.exists()) {
            bitmap = BitmapFactory.decodeFile(file.getAbsolutePath());
        }

        return bitmap;
    }
    @Override
    protected void onPostExecute(Bitmap result) {


        if (!imv.getTag().toString().equals(path)) {
               /* The path is not same. This means that this
                  image view is handled by some other async task.
                  We don't do anything and return. */
          //  return;
        }




        if(result != null && imv != null){
            imv.setVisibility(View.VISIBLE);
            imv.setImageBitmap(result);
        }else{
            imv.setVisibility(View.GONE);
        }
    }

}

And here is CustomList.java

import android.app.Activity;
import android.graphics.Bitmap;
import android.graphics.drawable.BitmapDrawable;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.TextView;

import java.util.ArrayList;

public class CustomList extends ArrayAdapter<String>{

    private final Activity context;
    private final Integer[] imageId;

    public CustomList(Activity context,
                      String[] web, Integer[] imageId) {
        super(context, R.layout.list_single, web);
        this.context = context;
        this.imageId = imageId;

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

        LayoutInflater inflater = context.getLayoutInflater();
        View rowView= inflater.inflate(R.layout.list_single, null, true);

        ImageView imageView = (ImageView) rowView.findViewById(R.id.img);


        LoadImage loadImage = new LoadImage(imageView);
        Bitmap bitmap = loadImage.doInBackground();


        imageView.setImageResource(imageId[position]);

        return rowView;

    }
}

And here is MainActivity.java

import android.app.Activity;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ListView;
import android.widget.Toast;

public class MainActivity extends Activity {

    ListView list;
    String[] web = {
            "Google Plus",
            "Twitter",
            "Tall",
    };

    Integer[] imageId = {
            R.drawable.gggggggggg,
            R.drawable.hhhhhhhhhh,
            R.drawable.ttttttttttt
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);



        CustomList adapter = new
                CustomList(MainActivity.this, web, imageId);


        list=(ListView)findViewById(R.id.list);
        list.setAdapter(adapter);
        list.setOnItemClickListener(new AdapterView.OnItemClickListener() {

            @Override
            public void onItemClick(AdapterView<?> parent, View view,
                                    int position, long id) {
                Toast.makeText(MainActivity.this, "You Clicked at " +web[+ position], Toast.LENGTH_SHORT).show();

            }
        });

    }
}

score 2 · Answer 1 · answered May 27 '16 at 09:15

2

You need to change loadImage.execute(); instead of Bitmap bitmap = loadImage.doInBackground();

answered May 27 '16 at 09:15

Abhishek Patel

4,280
1
24
38

@YudiMoszkowski post your full java code for fill up listview – Abhishek Patel May 27 '16 at 09:24
No but the images did not load into the ListView – Yudi Moszkowski May 27 '16 at 09:40
in your AsyncTask constructor you use `this.path = imv.getTag().toString();` but where you set the tag.? – Abhishek Patel May 27 '16 at 09:41
I am not sure where – Yudi Moszkowski May 27 '16 at 09:43
so why you use it and depends on that you fetch image from `External Storage` and try to display on imageview – Abhishek Patel May 27 '16 at 09:44
why you alreay use `imageId` for `Drawable` images to load image.? – Abhishek Patel May 27 '16 at 09:45

score 1 · Accepted Answer · answered May 27 '16 at 09:27

1

Why do you need AsyncTask? Try to use library Picasso and open images by one string:

File file = new File(Environment.getExternalStorageDirectory()
            .getAbsolutePath() + path);
Picasso.with(context).load(file).into(imageView);

Bitmap objects are very weight and you need to clean memory after each Bitmap image for prevent OutOfMemoryError. I recommend you to use libraries.

answered May 27 '16 at 09:27

Valentin Yuryev

764
7
18

How exactly would I implement this? – Yudi Moszkowski May 27 '16 at 09:33
Add `compile 'com.squareup.picasso:picasso:2.5.2'` to your build.gradle and use it in UI thread. :) – Valentin Yuryev May 27 '16 at 09:40
I did that but where do I fetch the image from? – Yudi Moszkowski May 27 '16 at 09:41
`Picasso.with(context).load(file).into(imageView);` where **file** can be File, String url or drawable resource. – Valentin Yuryev May 27 '16 at 09:43
I used a rawable and it says "Failed resolution of: Lcom/squareup/picasso/Picasso;" – Yudi Moszkowski May 27 '16 at 09:44
[link](http://stackoverflow.com/questions/33831340/android-didnt-find-class-picasso-on-path-dexpathlist-failed-resolution-of) – Valentin Yuryev May 27 '16 at 09:53

score 0 · Answer 3 · answered May 27 '16 at 09:48

0

Add this in your dependencies :-

  compile 'com.squareup.picasso:picasso:2.5.2'

and then load your image :-

   Picasso.with(this)
                .load(drawerImage) // ImagePath
                .placeholder( R.mipmap.download)
                .error( R.mipmap.add_photo)
                .into(imageDrawerView); //ImageView

answered May 27 '16 at 09:48

Vejj

1
1
2

It says Failed resolution of: Lcom/squareup/picasso/Picasso; – Yudi Moszkowski May 27 '16 at 09:51
i am not sure but this must be your targetSdkVersion .what version you are using right now??? – Vejj May 27 '16 at 10:14

NamNH · Answer 4 · 2016-05-27T10:31:27.443

1,Reason:

As I see, in your getView function:

ImageView imageView = (ImageView) rowView.findViewById(R.id.img);
// You need to set tag to your image view
// Ex: imageView.setTag("your_image_file_path") below this line

your imageView has no tag so the below code will get NullPointerException.

public LoadImage(ImageView imv) {
    this.imv = imv;
    this.path = imv.getTag().toString(); // Crashed here.
}

Also, I see in your getView function has this code:

imageView.setImageResource(imageId[position]);

That means "your ImageView will set resource corresponding to defined imageId array". So you no need AsyncTask class, let remove it and change your getView like below:

@Override
    public View getView(int position, View view, ViewGroup parent) {
        LayoutInflater inflater = context.getLayoutInflater();
        View rowView= inflater.inflate(R.layout.list_single, parent, false);
        ImageView imageView = (ImageView) rowView.findViewById(R.id.img);
        // Remove below code
        // LoadImage loadImage = new LoadImage(imageView);
        // Bitmap bitmap = loadImage.doInBackground();
        imageView.setImageResource(imageId[position]);
        return rowView;
    }

Your Asynctask class is needed whenever you use path of image file, not drawable resources.

2, Improvement:

You can learn more about ViewHolder pattern when using ListView, RecyclerView to improve performance, from Google Search. Below is an example with your current code:

@Override
        public View getView(int position, View view, ViewGroup parent) {
            View holder = null;
            if (view == null) {
                holder = new ViewHolder();
                LayoutInflater inflater = context.getLayoutInflater();
                view = inflater.inflate(R.layout.list_single, parent, false);
                holder.imageView = (ImageView) view.findViewById(R.id.img);
                view.setTag(holder);
            } else {
                holder = (ViewHolder) view.getTag();
            }

            holder.imageView.setImageResource(imageId[position]);
            return view;
        }
      static class ViewHolder { // should be static class
           ImageView imageView;
      }

That code causes the app to be very laggy and it says "Skipped 49 frames! The application may be doing too much work on its main thread." — Yudi Moszkowski, May 27 '16 at 10:02
But, did it work? also, I suggested you improve your code with viewholder pattern. — NamNH, May 27 '16 at 10:05
Yeah but it is too laggy to use and I am back to the beggining, what would viewholder do? — Yudi Moszkowski, May 27 '16 at 10:11

Display Image in Listview with AsyncTask

4 Answers4