Android Load image from Url to GridView

Question

In CustomAdapter.class :

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

    ImageView imageView;

        if (convertView == null) {  // if it's not recycled, initialize some attributes
            imageView = new ImageView(mContext);
            imageView.setLayoutParams(new GridView.LayoutParams(150, 150));
            imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
            imageView.setPadding(4, 4, 4, 4);
        } else
            {
                imageView = (ImageView) convertView;
            }


        String[] mThumbIds  =
        {   "https://lh6.googleusercontent.com/-55osAWw3x0Q/URquUtcFr5I/AAAAAAAAAbs/rWlj1RUKrYI/s1024/A%252520Photographer.jpg",
            "https://lh4.googleusercontent.com/--dq8niRp7W4/URquVgmXvgI/AAAAAAAAAbs/-gnuLQfNnBA/s1024/A%252520Song%252520of%252520Ice%252520and%252520Fire.jpg",
            "https://lh5.googleusercontent.com/-7qZeDtRKFKc/URquWZT1gOI/AAAAAAAAAbs/hqWgteyNXsg/s1024/Another%252520Rockaway%252520Sunset.jpg",
        };


        imageView.setImageResource(mThumbIds[position]);

        return imageView;
}


I get this error: *The method setImageResource(int) in the type ImageView is not applicable for the arguments (String)*

This is how I call CustomAdapter.class:

public static class ImageFrg extends Fragment
{

            GridView gridview;
            DisplayImageOptions options;

            public ImageFrg () {


            }

            @Override
            public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState)
            {
                View rootView = inflater.inflate(R.layout.imageFrg, container, false);          
                gridview=(GridView) rootView.findViewById(R.id.gridview);
                CustomAdapter i = new CustomAdapter(getActivity());
                gridview.setAdapter(i);   
                return rootView;    
            }
}

I want to upload some images from url into a GridView. How can I modify the setImagesResource, to be able to fill the Gridview with images ?

you can not directly use URL to imageview. You have to download that image first and then use it as Imageview. — Pragnesh Ghoda シ, Apr 16 '15 at 08:42
refere this question.. http://stackoverflow.com/questions/25077177/outofmemoryexception-load-bunch-of-images-from-server — Pragnesh Ghoda シ, Apr 16 '15 at 08:43
check this [post](http://stackoverflow.com/questions/11053085/android-fill-imageview-from-url) too — Elltz, Apr 16 '15 at 09:19

score 2 · Accepted Answer · edited Jun 03 '19 at 03:29

2

Easiest way to do this using Picasso.

Picasso.with(getContext()).load(mThumbId[position]).centerCrop().into(imageView);

EDIT

    String[] mThumbIds  =
    {   "https://lh6.googleusercontent.com/-55osAWw3x0Q/URquUtcFr5I/AAAAAAAAAbs/rWlj1RUKrYI/s1024/A%252520Photographer.jpg",
        "https://lh4.googleusercontent.com/--dq8niRp7W4/URquVgmXvgI/AAAAAAAAAbs/-gnuLQfNnBA/s1024/A%252520Song%252520of%252520Ice%252520and%252520Fire.jpg",
        "https://lh5.googleusercontent.com/-7qZeDtRKFKc/URquWZT1gOI/AAAAAAAAAbs/hqWgteyNXsg/s1024/Another%252520Rockaway%252520Sunset.jpg",
    };

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

    ImageView imageView;

    if (convertView == null) {  // if it's not recycled, initialize some attributes
        imageView = new ImageView(mContext);
        imageView.setLayoutParams(new GridView.LayoutParams(150, 150));
        imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
        imageView.setPadding(4, 4, 4, 4);
    } 
    else {
            imageView = (ImageView) convertView;
    }


    Picasso.with(mContext).load(mThumbs[position]).centerCrop().into(imageView);
    return imageView;
}

@Override
public int getCount() {
   return mThumbId.size();
}

edited Jun 03 '19 at 03:29

Bilal Demir

587
6
17

answered Apr 16 '15 at 08:44

Emre Aktürk

3,306
2
18
30

I tried this but I get a "Unable to start activity ComponentInfo java.lang.NullPointerException" – ghita Apr 16 '15 at 09:22
Before voting down solution which is quitely true, you need to learn how to write ViewHolder pattern... And that exception comes from your wrong implementation. – Emre Aktürk Apr 16 '15 at 10:11
VoteDown requires 125 reputation and I don't have it :) – ghita Apr 16 '15 at 10:30
I edited my answer. You should also override getCount method with your array size. And move out your thumb array to outside of getView method namespace. – Emre Aktürk Apr 16 '15 at 10:40
Also take care i have changed the line imageView = new ImageView to convertView = new ImageView. – Emre Aktürk Apr 16 '15 at 10:41
why did you do this change? convertView = new ImageView(mContext); now, it didn't recognize the imageview.. it says it haven't been initialised – ghita Apr 16 '15 at 11:07
Otherwise everytime you call getView it enters null statement because convertView never being initiliazed. – Emre Aktürk Apr 16 '15 at 12:08
Are you sure you wrote true? because imageView is in getView method. It should be recognize it :) – Emre Aktürk Apr 16 '15 at 12:09

score 1 · Answer 2 · answered Apr 16 '15 at 08:44

1

You can use Picasso to do that.

Example from their page:

Picasso.with(context).load("http://<url to your image>").into(imageView);

answered Apr 16 '15 at 08:44

germi

4,628
1
21
38

I have like 500 images, can Picasso upload all of them with just one call ? Picasso.with(context).load(mThumbIds).into(imageView); ?? So, the GridView is automatically fill with them ? – ghita Apr 16 '15 at 08:47
I don't think you can load 500 images with just one call. But Picasso works asynchronously, so you can just make your calls to the network and the images will display once they're loaded. They have an example for `GridView` in their github repository: https://github.com/square/picasso/blob/master/picasso-sample/src/main/java/com/example/picasso/SampleGridViewActivity.java – germi Apr 16 '15 at 08:52
@germi the link u provided is Not Working..my problem is https://stackoverflow.com/questions/63414396/how-to-hold-the-selected-image-in-gridview-and-pass-to-next-activity-after-i-cli – Karthickyuvan Aug 18 '20 at 11:01

score 1 · Answer 3 · answered Apr 16 '15 at 09:31

On CustomAdapter.class :

    String[] mThumbIds  =
    {   "https://lh6.googleusercontent.com/-55osAWw3x0Q/URquUtcFr5I/AAAAAAAAAbs/rWlj1RUKrYI/s1024/A%252520Photographer.jpg",
        "https://lh4.googleusercontent.com/--dq8niRp7W4/URquVgmXvgI/AAAAAAAAAbs/-gnuLQfNnBA/s1024/A%252520Song%252520of%252520Ice%252520and%252520Fire.jpg",
        "https://lh5.googleusercontent.com/-7qZeDtRKFKc/URquWZT1gOI/AAAAAAAAAbs/hqWgteyNXsg/s1024/Another%252520Rockaway%252520Sunset.jpg",
    };  

    Picasso.with(mContext).load(mThumbIds[0]).centerCrop().into(imageView);

    return imageView;

.

private Integer[] mThumbIds =
{
    R.drawable.ic_stub , R.drawable.ic_stub,
    R.drawable.ic_stub , R.drawable.ic_stub,
    R.drawable.ic_stub , R.drawable.ic_stub ,
    R.drawable.ic_stub , R.drawable.ic_stub,
    R.drawable.ic_stub , R.drawable.ic_stub,
    R.drawable.ic_stub , R.drawable.ic_stub,
};

And now, it prints the first picture by 6 times !

score 0 · Answer 4 · answered Apr 16 '15 at 08:50

0

The Simplest way to Download Image From URL is, Use AQuery Library download AQuery.jar file put it in your Llib folder

//load an image to an ImageView from network
AQuery aq=new AQuery(this);   
aq.id(R.id.imageview).image("http://www.vikispot.com/z/images/vikispot/android-w.png");

refer this for more information https://code.google.com/p/android-query/wiki/ImageLoading

answered Apr 16 '15 at 08:50

Divyang Panchal

1,889
1
19
27

yep, but I have to populate a GridView, not just an image... – ghita Apr 16 '15 at 09:23

Android Load image from Url to GridView

4 Answers4