How to display an image from a url in android

Question

I am working on my first android application. I need to display an image from a url in my app. I tried in the following way:

Mainactivity file:

public class MainViewActivity extends Activity {

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

     int loader = R.drawable.loader;

        // Imageview to show
        ImageView image = (ImageView) findViewById(R.id.image);

        // Image url
        String image_url = "http://..../landing.png";

        // ImageLoader class instance
        ImageLoader imgLoader = new ImageLoader(getApplicationContext());


        imgLoader.DisplayImage(image_url, loader, image);
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.activity_main_view, menu);
    return true;
}

}

Here i am getting an error in the line int loader = R.drawable.loader;

The class file are:

FileCache.java

public class FileCache {

private File cacheDir;

public FileCache(Context context){
    //Find the dir to save cached images
    if (android.os.Environment.getExternalStorageState().equals(android.os.Environment.MEDIA_MOUNTED))
        cacheDir=new File(android.os.Environment.getExternalStorageDirectory(),"TempImages");
    else
        cacheDir=context.getCacheDir();
    if(!cacheDir.exists())
        cacheDir.mkdirs();
}

public File getFile(String url){
    String filename=String.valueOf(url.hashCode());
    File f = new File(cacheDir, filename);
    return f;

}

public void clear(){
    File[] files=cacheDir.listFiles();
    if(files==null)
        return;
    for(File f:files)
        f.delete();
}

}

ImageLoader.java

public class ImageLoader {

MemoryCache memoryCache=new MemoryCache();
FileCache fileCache;
private Map<ImageView, String> imageViews=Collections.synchronizedMap(new WeakHashMap<ImageView, String>());
ExecutorService executorService;

public ImageLoader(Context context){
    fileCache=new FileCache(context);
    executorService=Executors.newFixedThreadPool(5);
}

int stub_id = R.drawable.ic_launcher;
public void DisplayImage(String url, int loader, ImageView imageView)
{
    stub_id = loader;
    imageViews.put(imageView, url);
    Bitmap bitmap=memoryCache.get(url);
    if(bitmap!=null)
        imageView.setImageBitmap(bitmap);
    else
    {
        queuePhoto(url, imageView);
        imageView.setImageResource(loader);
    }
}

private void queuePhoto(String url, ImageView imageView)
{
    PhotoToLoad p=new PhotoToLoad(url, imageView);
    executorService.submit(new PhotosLoader(p));
}

private Bitmap getBitmap(String url)
{
    File f=fileCache.getFile(url);

    //from SD cache
    Bitmap b = decodeFile(f);
    if(b!=null)
        return b;

    //from web
    try {
        Bitmap bitmap=null;
        URL imageUrl = new URL(url);
        HttpURLConnection conn = (HttpURLConnection)imageUrl.openConnection();
        conn.setConnectTimeout(30000);
        conn.setReadTimeout(30000);
        conn.setInstanceFollowRedirects(true);
        InputStream is=conn.getInputStream();
        OutputStream os = new FileOutputStream(f);
        Utils.CopyStream(is, os);
        os.close();
        bitmap = decodeFile(f);
        return bitmap;
    } catch (Exception ex){
       ex.printStackTrace();
       return null;
    }
}

//decodes image and scales it to reduce memory consumption
private Bitmap decodeFile(File f){
    try {
        //decode image size
        BitmapFactory.Options o = new BitmapFactory.Options();
        o.inJustDecodeBounds = true;
        BitmapFactory.decodeStream(new FileInputStream(f),null,o);

        //Find the correct scale value. It should be the power of 2.
        final int REQUIRED_SIZE=70;
        int width_tmp=o.outWidth, height_tmp=o.outHeight;
        int scale=1;
        while(true){
            if(width_tmp/2<REQUIRED_SIZE || height_tmp/2<REQUIRED_SIZE)
                break;
            width_tmp/=2;
            height_tmp/=2;
            scale*=2;
        }

        //decode with inSampleSize
        BitmapFactory.Options o2 = new BitmapFactory.Options();
        o2.inSampleSize=scale;
        return BitmapFactory.decodeStream(new FileInputStream(f), null, o2);
    } catch (FileNotFoundException e) {}
    return null;
}

//Task for the queue
private class PhotoToLoad
{
    public String url;
    public ImageView imageView;
    public PhotoToLoad(String u, ImageView i){
        url=u;
        imageView=i;
    }
}

class PhotosLoader implements Runnable {
    PhotoToLoad photoToLoad;
    PhotosLoader(PhotoToLoad photoToLoad){
        this.photoToLoad=photoToLoad;
    }

    @Override
    public void run() {
        if(imageViewReused(photoToLoad))
            return;
        Bitmap bmp=getBitmap(photoToLoad.url);
        memoryCache.put(photoToLoad.url, bmp);
        if(imageViewReused(photoToLoad))
            return;
        BitmapDisplayer bd=new BitmapDisplayer(bmp, photoToLoad);
        Activity a=(Activity)photoToLoad.imageView.getContext();
        a.runOnUiThread(bd);
    }
}

boolean imageViewReused(PhotoToLoad photoToLoad){
    String tag=imageViews.get(photoToLoad.imageView);
    if(tag==null || !tag.equals(photoToLoad.url))
        return true;
    return false;
}

//Used to display bitmap in the UI thread
class BitmapDisplayer implements Runnable
{
    Bitmap bitmap;
    PhotoToLoad photoToLoad;
    public BitmapDisplayer(Bitmap b, PhotoToLoad p){bitmap=b;photoToLoad=p;}
    public void run()
    {
        if(imageViewReused(photoToLoad))
            return;
        if(bitmap!=null)
            photoToLoad.imageView.setImageBitmap(bitmap);
        else
            photoToLoad.imageView.setImageResource(stub_id);
    }
}

public void clearCache() {
    memoryCache.clear();
    fileCache.clear();
}

}

MemoryCache.java

public class MemoryCache {
private Map<String, SoftReference<Bitmap>> cache=Collections.synchronizedMap(new     HashMap<String, SoftReference<Bitmap>>());

public Bitmap get(String id){
    if(!cache.containsKey(id))
        return null;
    SoftReference<Bitmap> ref=cache.get(id);
    return ref.get();
}

public void put(String id, Bitmap bitmap){
    cache.put(id, new SoftReference<Bitmap>(bitmap));
}

public void clear() {
    cache.clear();
}
}

Utils.java

public class Utils {
public static void CopyStream(InputStream is, OutputStream os)
{
    final int buffer_size=1024;
    try
    {
        byte[] bytes=new byte[buffer_size];
        for(;;)
        {
          int count=is.read(bytes, 0, buffer_size);
          if(count==-1)
              break;
          os.write(bytes, 0, count);
        }
    }
    catch(Exception ex){}
}
}

Please help to fix that error and see if there is any problem in my code. I have set the required permissions in the manifest file.

Answer 1

UrlImageViewHelper is an open source library(see here) you can use this to display image from url. There is a method UrlImageViewHelper.setUrlDrawable(ImagView imageview, String url ) use this method to show image from url.

Answer 2

You can also use Picasso
http://square.github.io/picasso/

Picasso handles all the hassles required to display images from URL.

Answer 3

Hi I hope this answer will help you alot I designed this project to download Image from url and store in cache memory and you can use the particular image to your project All the best If you have any doubt in that project you will Comment me i will explain the each and every step in that project... All the best...

public class MainActivity extends Activity {

private ImageView button;
private BitmapFactory.Options mBitmapOptions;
private Bitmap mBitmap;
private TextView mTime;
private ProgressBar bar;
private LruCache<String, Bitmap> mMemoryCache;
private SeekBar seekbar;
private Button change;

@SuppressLint("NewApi")
@TargetApi(Build.VERSION_CODES.HONEYCOMB_MR1)
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
    button = (ImageView) findViewById(R.id.logo);
    mTime = (TextView) findViewById(R.id.time);
    bar = (ProgressBar) findViewById(R.id.bar);
    seekbar = (SeekBar) findViewById(R.id.seekbar);
    change = (Button) findViewById(R.id.change);
    mBitmapOptions = new BitmapFactory.Options();
    mBitmapOptions.inJustDecodeBounds = true;
    BitmapFactory.decodeResource(getResources(), R.drawable.ic_launcher,
            mBitmapOptions);
    mBitmap = Bitmap.createBitmap(mBitmapOptions.outWidth,
            mBitmapOptions.outHeight, Config.ARGB_8888);
    mBitmapOptions.inJustDecodeBounds = false;
    mBitmapOptions.inBitmap = mBitmap;
    mBitmapOptions.inSampleSize = 1;
    BitmapFactory.decodeResource(getResources(), R.drawable.ic_launcher,
            mBitmapOptions);
    button.setImageBitmap(mBitmap);     
    // Use 1/8th of the available memory for this memory cache.
    final int cacheSize = 20 * 1024 * 1024;
    mMemoryCache = new LruCache<String, Bitmap>(cacheSize) {
        @TargetApi(Build.VERSION_CODES.HONEYCOMB_MR1)
        @Override
        protected int sizeOf(String key, Bitmap bitmap) {
            // The cache size will be measured in kilobytes rather than
            // number of items.
            return bitmap.getByteCount();
        }
    };
    int i = 0;
    System.out.println(mMemoryCache.size());
    System.out.println(mMemoryCache.evictionCount());
    bar.setMax(Images.imageThumbUrls.length - 1);
    seekbar.setMax(Images.imageThumbUrls.length - 1);
    bar.setProgress(0);
    seekbar.setProgress(0);
    for (String string : Images.imageUrls) {
        String position = String.valueOf(i);
        BitmapWorkerTask task = new BitmapWorkerTask(position);
        task.executeOnExecutor(AsyncTask.SERIAL_EXECUTOR, string);          
        i++;
    }
    seekbar.setOnSeekBarChangeListener(new OnSeekBarChangeListener() {

        @Override
        public void onStopTrackingTouch(SeekBar seekBar) {
        }

        @Override
        public void onStartTrackingTouch(SeekBar seekBar) {

        }

        @Override
        public void onProgressChanged(SeekBar seekBar, int progress,
                boolean fromUser) {
            if (Images.imageUrls.length > progress) {
                if (getBitmapFromMemCache(String.valueOf(progress)) != null) {
                    button.setImageBitmap(getBitmapFromMemCache(String
                            .valueOf(progress)));
                } else {
                    // BitmapWorkerTask task = new
                    // BitmapWorkerTask(String.valueOf(progress));
                    // task.executeOnExecutor(AsyncTask.THREAD_POOL_EXECUTOR,Images.imageUrls[progress]);
                }
            }

        }
    });
    change.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View v) {
            mMemoryCache.evictAll();
            System.out.println(mMemoryCache.size());
            System.out.println(mMemoryCache.evictionCount());
            bar.setMax(Images.imageUrls.length - 1);
            seekbar.setMax(Images.imageThumbUrls.length - 1);
            bar.setProgress(0);
            seekbar.setProgress(0);
            int i = 0;                              
            for (String string : Images.imageUrls) {
                String position = String.valueOf(i);
                BitmapWorkerTask task = new BitmapWorkerTask(position);
                task.executeOnExecutor(AsyncTask.SERIAL_EXECUTOR, string);                  
                i++;
            }

        }
    });
}

@SuppressLint("NewApi")
public void addBitmapToMemoryCache(String position, Bitmap bitmap) {
    if (getBitmapFromMemCache(position) == null) {
        mMemoryCache.put(position, bitmap);
    }
}

public void loadBitmap(int resId, ImageView imageView) {
    final String imageKey = String.valueOf(resId);

    final Bitmap bitmap = getBitmapFromMemCache(imageKey);
    if (bitmap != null) {
        button.setImageBitmap(bitmap);
    } else {
        button.setImageResource(R.drawable.ic_launcher);
    }
}

@SuppressLint("NewApi")
public Bitmap getBitmapFromMemCache(String imageKey) {
    return mMemoryCache.get(imageKey);
}

class BitmapWorkerTask extends AsyncTask<String, Void, Bitmap> {
    private String position = null;

    // Decode image in background.
    public BitmapWorkerTask(String position) {
        this.position = position;
    }

    @Override
    protected Bitmap doInBackground(String... params) {
        URL url;
        try {
            url = new URL(params[0]);
            HttpURLConnection connection = (HttpURLConnection) url
                    .openConnection();
            connection.setConnectTimeout(200);
            connection.setReadTimeout(1000);
            int v = connection.getContentLength() > 0 ? connection
                    .getContentLength() : 0;
            if (v > 0) {                    
                InputStream in = new BufferedInputStream(
                        connection.getInputStream(), 32 * 1024);
                return decodeSampledBitmapFromResource(in, 1000, 1000);
            }
        } catch (MalformedURLException e) {
            //e.printStackTrace();
        } catch (IOException e) {
            //e.printStackTrace();
        }

        return null;
    }

    @Override
    protected void onPostExecute(Bitmap result) {
        if (result != null) {
            addBitmapToMemoryCache(position, result);
            // button.setImageBitmap(getBitmapFromMemCache(position));
            mTime.setText(position);
            bar.setProgress(Integer.parseInt(position));
      //                System.out.println(result);
        }
    }
}

public Bitmap decodeSampledBitmapFromResource(InputStream in, int reqWidth,
        int reqHeight) throws IOException {

    // First decode with inJustDecodeBounds=true to check dimensions
    final BitmapFactory.Options options = new BitmapFactory.Options();
    options.inJustDecodeBounds = true;
    in.mark(in.available());
    BitmapFactory.decodeStream(in, null, options);
    // Calculate inSampleSize
    options.inSampleSize = calculateInSampleSize(options, reqWidth,
            reqHeight);
    in.reset();
    // Decode bitmap with inSampleSize set
    options.inJustDecodeBounds = false;
    return BitmapFactory.decodeStream(in, null, options);
}

public static int calculateInSampleSize(BitmapFactory.Options options,
        int reqWidth, int reqHeight) {
    // Raw height and width of image
    final int height = options.outHeight;
    final int width = options.outWidth;
    int inSampleSize = 1;

    if (height > reqHeight || width > reqWidth) {

        final int halfHeight = height / 2;
        final int halfWidth = width / 2;

        // Calculate the largest inSampleSize value that is a power of 2 and
        // keeps both
        // height and width larger than the requested height and width.
        while ((halfHeight / inSampleSize) > reqHeight
                && (halfWidth / inSampleSize) > reqWidth) {
            inSampleSize *= 2;
        }
    }

    return inSampleSize;
}

 }