I am implementing progressbar in my android app. In my app i want to display progressbar when images are loading from the web after loading all images the loader should be stopped.
I seen some example of progressbar in that it is displaying for predefined period of time. But i want the progressbar display dynamically depends on the time to load images from the web.
You shoud use an AsyncTask. The Javadoc for it has an example of just what you want to do :
private class DownloadFilesTask extends AsyncTask<URL, Integer, Long> {
protected Long doInBackground(URL... urls) {
int count = urls.length;
long totalSize = 0;
for (int i = 0; i < count; i++) {
totalSize += Downloader.downloadFile(urls[i]);
publishProgress((int) ((i / (float) count) * 100));
}
return totalSize;
}
protected void onProgressUpdate(Integer... progress) {
setProgressPercent(progress[0]);
}
protected void onPostExecute(Long result) {
showDialog("Downloaded " + result + " bytes");
}
}
You just have to implement the setProgressPercent
method to set the progress in your progress bar, and hide it on the onPostExecute
.
Typically you would do the downloading in an ASyncTask. Overwriting onPreExecute() would allow you to show the progressbar just before the background thread is started and the downloading begins. In the onPostExecute method of your AsyncTask you can hide the progressbar.
You could also have a loading view for each image, and then the user could still scroll while the images where loading and not just after ALL images are loaded and the dialog is removed.
http://www.anddev.org/novice-tutorials-f8/imageview-with-loading-spinner-t49439.html
Add this class into your Project:
import java.io.IOException;
import java.net.MalformedURLException;
import android.content.Context;
import android.graphics.drawable.Drawable;
import android.os.Handler;
import android.os.Message;
import android.os.Handler.Callback;
import android.util.AttributeSet;
import android.view.View;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.ProgressBar;
/**
* Free for anyone to use, just say thanks and share :-)
* @author Blundell
*
*/
public class LoaderImageView extends LinearLayout{
private static final int COMPLETE = 0;
private static final int FAILED = 1;
private Context mContext;
private Drawable mDrawable;
private ProgressBar mSpinner;
private ImageView mImage;
/**
* This is used when creating the view in XML
* To have an image load in XML use the tag 'image="http://developer.android.com/images/dialog_buttons.png"'
* Replacing the url with your desired image
* Once you have instantiated the XML view you can call
* setImageDrawable(url) to change the image
* @param context
* @param attrSet
*/
public LoaderImageView(final Context context, final AttributeSet attrSet) {
super(context, attrSet);
final String url = attrSet.getAttributeValue(null, "image");
if(url != null){
instantiate(context, url);
} else {
instantiate(context, null);
}
}
/**
* This is used when creating the view programatically
* Once you have instantiated the view you can call
* setImageDrawable(url) to change the image
* @param context the Activity context
* @param imageUrl the Image URL you wish to load
*/
public LoaderImageView(final Context context, final String imageUrl) {
super(context);
instantiate(context, imageUrl);
}
/**
* First time loading of the LoaderImageView
* Sets up the LayoutParams of the view, you can change these to
* get the required effects you want
*/
private void instantiate(final Context context, final String imageUrl) {
mContext = context;
mImage = new ImageView(mContext);
mImage.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
mSpinner = new ProgressBar(mContext);
mSpinner.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
mSpinner.setIndeterminate(true);
addView(mSpinner);
addView(mImage);
if(imageUrl != null){
setImageDrawable(imageUrl);
}
}
/**
* Set's the view's drawable, this uses the internet to retrieve the image
* don't forget to add the correct permissions to your manifest
* @param imageUrl the url of the image you wish to load
*/
public void setImageDrawable(final String imageUrl) {
mDrawable = null;
mSpinner.setVisibility(View.VISIBLE);
mImage.setVisibility(View.GONE);
new Thread(){
public void run() {
try {
mDrawable = getDrawableFromUrl(imageUrl);
imageLoadedHandler.sendEmptyMessage(COMPLETE);
} catch (MalformedURLException e) {
imageLoadedHandler.sendEmptyMessage(FAILED);
} catch (IOException e) {
imageLoadedHandler.sendEmptyMessage(FAILED);
}
};
}.start();
}
/**
* Callback that is received once the image has been downloaded
*/
private final Handler imageLoadedHandler = new Handler(new Callback() {
@Override
public boolean handleMessage(Message msg) {
switch (msg.what) {
case COMPLETE:
mImage.setImageDrawable(mDrawable);
mImage.setVisibility(View.VISIBLE);
mSpinner.setVisibility(View.GONE);
break;
case FAILED:
default:
// Could change image here to a 'failed' image
// otherwise will just keep on spinning
break;
}
return true;
}
});
/**
* Pass in an image url to get a drawable object
* @return a drawable object
* @throws IOException
* @throws MalformedURLException
*/
private static Drawable getDrawableFromUrl(final String url) throws IOException, MalformedURLException {
return Drawable.createFromStream(((java.io.InputStream)new java.net.URL(url).getContent()), "name");
}
}
To then have an image load you can use: (changing the package name to your package)
<com.blundell.tut.LoaderImageView
android:id="@+id/loaderImageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
image="http://developer.android.com/images/dialog_buttons.png"
/>
Or from code:
final LoaderImageView image = new LoaderImageView(this, "http://developer.android.com/images/dialog_buttons.png");
image.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));