Android ViewPager Prev/Next Button

Question

Okay, so I\'m developing an Android app that utilises a ViewPager to display pages.

Within each page, I have a set of buttons to use for navigating between pages (in

Answer 1

I finished this project with this code.

vPager = (ViewPager) findViewById(R.id.viewpager);
    View tempView1 = inflater.inflate(R.layout.ani_dialog1, null);
    firstView = (ImageView) tempView1.findViewById(R.id.ani_dialog_next);
    views.add(tempView1);
    firstView.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View v) {
            // TODO Auto-generated method stub
            vPager.setCurrentItem(1, true);

        }
    }); 

Answer 2

1) Make layout

      <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="200dp"
                android:background="@color/white"
                android:weightSum="1">



                <android.support.v4.view.ViewPager
                    android:id="@+id/images_pager"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    >
                </android.support.v4.view.ViewPager>

                <ImageView
                    android:id="@+id/img_next"
                    android:layout_width="35dp"
                    android:layout_height="35dp"
                    android:src="@drawable/forward_white"
                    android:background="@color/colorPrimary"
                    android:layout_centerVertical="true"
                    android:layout_alignParentRight="true"
                    android:layout_marginRight="5dp"
                    android:paddingTop="5dp"
                    android:paddingBottom="5dp"
                    />


                <ImageView
                    android:id="@+id/img_previous"
                    android:layout_width="35dp"
                    android:layout_height="35dp"
                    android:src="@drawable/back_white"
                    android:background="@color/colorPrimary"
                    android:layout_centerVertical="true"
                    android:layout_marginLeft="5dp"
                    android:layout_alignParentLeft="true"
                    android:paddingTop="5dp"
                    android:paddingBottom="5dp"/>


            </RelativeLayout>

2) Set custom Adapter

        CustomViewPagerAdapter  custompageradpter;
        ViewPager   mViewPager;
        mViewPager = (ViewPager)shareImagesDialouge.findViewById(R.id.images_pager); 
         custompageradpter = new CustomViewPagerAdapter(this);
         mViewPager.setAdapter(custompageradpter);

    public class CustomViewPagerAdapter  extends PagerAdapter {


        Context mContext;
        LayoutInflater mLayoutInflater;

        int[] mResources = {
                R.drawable.emoji_1,
                R.drawable.emoji_2,
                R.drawable.emoji_3,
                R.drawable.emoji_4,
                R.drawable.emoji_5,
                R.drawable.emoji_6
        };

        public CustomViewPagerAdapter(Context context) {
            mContext = context;
            mLayoutInflater = (LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        }

        @Override
        public int getCount() {
            return mResources.length;
        }

        @Override
        public boolean isViewFromObject(View view, Object object) {
            return view == ((LinearLayout) object);
        }

        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            View itemView = mLayoutInflater.inflate(R.layout.pager_item, container, false);

            ImageView imageView = (ImageView) itemView.findViewById(R.id.imageView);
            imageView.setImageResource(mResources[position]);

            container.addView(itemView);

            return itemView;
        }

        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {
            container.removeView((LinearLayout) object);
        }

    }

3) For next and previous button

         case R.id.img_previous:
                    mViewPager.setCurrentItem(getItemofviewpager(-1), true);
                    break;

                case R.id.img_next:
                    mViewPager.setCurrentItem(getItemofviewpager(+1), true);
                    break;

4) Make this function

  private int getItemofviewpager(int i) {
        return mViewPager.getCurrentItem() + i;
    }

Answer 3

public void onClick(View v) {
     int currentItem = mViewPager.getCurrentItem();
     mViewPager.setCurrentItem(currentItem+1); //(currentItem-1)
}

only this code in button click: @Override

getcurrentitem is the actual item in viewpager, the next item is currentItem + 1

Answer 4

Do it like this:

backButton=(Button)findViewById(R.id.back_button);
nextButton=(Button)findViewById(R.id.next_button);
backButton.setVisibility(View.INVISIBLE);//you can use GONE or even disable it. It depends on your layout 


    nextButton.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View view) {
            viewPager.setCurrentItem(viewPager.getCurrentItem()+1, true);
        }
    });


    backButton.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View view) {
            viewPager.setCurrentItem(viewPager.getCurrentItem()-1, true);
        }
    });
}

To prevent IndexOutOfBoundsException you should hide and show the two buttons like this :

    viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
        @Override
        public void onPageScrolled(int i, float v, int i1) {

        }
        @Override
        public void onPageSelected(int position) {
            if(position==0) {
                backButton.setVisibility(View.INVISIBLE);
            }else  {
                backButton.setVisibility(View.VISIBLE);
            }
            if(position < viewPager.getAdapter().getCount()-1 ) {
                nextButton.setVisibility(View.VISIBLE);
            }else  {
                nextButton.setVisibility(View.INVISIBLE);
            }
        }
        @Override
        public void onPageScrollStateChanged(int i) {

        }
    });

Answer 5

Update code

Button preButton = (Button)findViewById(R.id.pre_button);
        Button nextButton = (Button)findViewById(R.id.next_button);

        preButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

                mViewPager.setCurrentItem(mViewPager.getCurrentItem()-1, true); 


            }
        });

        nextButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

                mViewPager.setCurrentItem(mViewPager.getCurrentItem()+1, true); 

            }
        });

Answer 6

yourButton.setOnClickListener(new OnClickListener() {
   @Override
   public void onClick(View view) {
      yourViewPager.setCurrentItem(page, smoothScroll);
   }
});