Android image loading with progressbar

Question

My application loads images using url. I tried using the library UrlImageViewHelper. It works. But I want to add a spinning progressbar. So i tried modifying a portion for the progressbar. The problem is that when i tried to run my application, only at some images the progressbar will appear, then disappear when the iamge is already loaded. at some image, it continued to display..Is this the right place to add my progressbar control?

              final Runnable completion = new Runnable() {
              @Override
              public void run() {
                  assert (Looper.myLooper().equals(Looper.getMainLooper()));
                  Bitmap bitmap = loader.result;
                  Drawable usableResult = null;
                  if (bitmap != null) {
                      usableResult = new ZombieDrawable(url, mResources, bitmap);
                  }
                  if (usableResult == null) {
                      clog("No usable result, defaulting " + url);
                      usableResult = defaultDrawable;
                      mLiveCache.put(url, usableResult);
                  }
                  mPendingDownloads.remove(url);
  //                mLiveCache.put(url, usableResult);
                  if (callback != null && imageView == null)
                      callback.onLoaded(null, loader.result, url, false);
                  int waitingCount = 0;
                  for (final ImageView iv: downloads) {
                      // validate the url it is waiting for
                      final String pendingUrl = mPendingViews.get(iv);
                      if (!url.equals(pendingUrl)) {
                          clog("Ignoring out of date request to update view for " + url + " " + pendingUrl + " " + iv);
                          continue;
                      }
                      waitingCount++;
                      mPendingViews.remove(iv);
                      if (usableResult != null) {
  //                        System.out.println(String.format("imageView: %dx%d, %dx%d", imageView.getMeasuredWidth(), imageView.getMeasuredHeight(), imageView.getWidth(), imageView.getHeight()));
                          iv.setImageDrawable(usableResult);
  //                        System.out.println(String.format("imageView: %dx%d, %dx%d", imageView.getMeasuredWidth(), imageView.getMeasuredHeight(), imageView.getWidth(), imageView.getHeight()));
                          // onLoaded is called with the loader's result (not what is actually used). null indicates failure.
                      }
                      if (callback != null && iv == imageView)
                          callback.onLoaded(iv, loader.result, url, false);
                  }
                  clog("Populated: " + waitingCount);

  //                if(imageView.isShown())
  //                    if(progressBar != null) progressBar.setVisibility(View.GONE);
              }
          };


          if (file.exists()) {
              try {
                  if (checkCacheDuration(file, cacheDurationMs)) {
                      clog("File Cache hit on: " + url + ". " + (System.currentTimeMillis() - file.lastModified()) + "ms old.");

                      final AsyncTask<Void, Void, Void> fileloader = new AsyncTask<Void, Void, Void>() {
                          @Override
                          protected Void doInBackground(final Void... params) {
                              loader.onDownloadComplete(null, null, filename);
                              return null;
                          }
                          @Override
                          protected void onPostExecute(final Void result) {
                              completion.run();
                          }
                      };
                      executeTask(fileloader);
                      return;
                  }
                  else {
                      clog("File cache has expired. Refreshing.");
                  }
              }
              catch (final Exception ex) {
              }
          }

          for (UrlDownloader downloader: mDownloaders) {
              if (downloader.canDownloadUrl(url)) {
                  downloader.download(context, url, filename, loader, completion);
                  return;
              }
          }

          imageView.setImageDrawable(defaultDrawable);
  //        if(imageView.isShown())
  //            if(progressBar != null) progressBar.setVisibility(View.GONE);
      }

If someone familiar with this library, can you help achieve my objective? Thanks

Answer 1

ASyncTask is what you are looking for, whenever there is Resource Fetching or rendering like UI components and images and etc ASYNCTask is the answer but when you are looking for Data Fetching always use Runnable Threads.

class ImageFetch extends AsyncTask {

    private final ProgressDialog dialog = new ProgressDialog(this.context);
    @Override
    protected void onPreExecute() {
          this.dialog.setMessage("Fecthing Image");
          this.dialog.setTitle("Please Wait");
          this.dialog.setIcon(R.drawable."Any Image here");
          this.dialog.show();
    }

    @Override
    protected Void doInBackground(Void... voids) {
      // Put your Image Fetching code here


    }
    @Override
    protected void onPostExecute(Void aVoid) {
         if (this.dialog.isShowing()) {
             this.dialog.dismiss();

 }
}

and after that in the Activity code do it like this new ImageFetch().execute();

you are done.

Answer 2

In this situation I would be inclined to use an ASyncTask rather than Runnable. The ASyncTask was designed specifically for this purpose and contains methods which are run directly on the UI thread (onProgressUpdate(), onPreExecute() and onPostExecute()). These methods are ideal for showing, hiding and updating a progress bar as required.

This tutorial should provide you with a fairly good starting point.