Question

How can I add a progress bar to a ViewPager in Android?

My scenario is that I have to load imageURL’s in a ViewPager. When the user swipes the pager, if the ImageURL is not loaded I need to show the progress bar/loading GIF image.

Is it possible?

Answer 1

I think Satya was thinking to something like this in the following.
In your viewpager adapter class you should have this method:

@Override
            public Object instantiateItem(View collection, final int position) {

                LayoutInflater inflater = (LayoutInflater) collection.getContext()
                        .getSystemService(Context.LAYOUT_INFLATER_SERVICE);


                final FrameLayout imageLayout = (FrameLayout) inflater.inflate(R.layout.fotopager_buttons, null);
                final ImageView imageView = (ImageView) imageLayout.findViewById(R.id.image);
                final ProgressBar spinner = (ProgressBar) imageLayout.findViewById(R.id.loading);

                imageLoader.displayImage(Gallery.get_big_image_url(position), imageView, options, new ImageLoadingListener() {
                    @Override
                    public void onLoadingStarted() {
                    spinner.setVisibility(View.VISIBLE);
                    }

                    @Override
                    public void onLoadingFailed() {
                    spinner.setVisibility(View.GONE);
                    imageView.setImageResource(android.R.drawable.ic_delete);
                    }

                    @Override
                    public void onLoadingComplete() {
                    spinner.setVisibility(View.GONE);
                    }
                    });


                views.put(position, iv);

                ((ViewPager) collection).addView(imageLayout,0);

                return imageLayout;
}

And the R.layout.fotopager_buttons.xml like that:

<?xml version="1.0" encoding="utf-8"?>

<ImageView
    android:id="@+id/image"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:adjustViewBounds="true" />

<ProgressBar
    android:id="@+id/loading"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"/>

You can see the rest of the imageLoader class here: https://github.com/nostra13/Android-Universal-Image-Loader/blob/master/UniversalImageLoaderExample/src/com/nostra13/example/universalimageloader/ImagePagerActivity.java