Android added circle indicator to viewpager

Question

Hi i have created a view pager but does anyone know how i can show circles that represent pagination on a page view i think its clued an indicator but i'm not entirely sure?

heres the code so far that contains my view pager

public class LevelSelect extends Activity {

    private ViewPager awesomePager;
    private static int NUM_AWESOME_VIEWS = 10;
    private Context cxt;
    private AwesomePagerAdapter awesomeAdapter;

    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.layout_levelselect);
        cxt = this;

        awesomeAdapter = new AwesomePagerAdapter();
        awesomePager = (ViewPager) findViewById(R.id.viewpager);
        awesomePager.setAdapter(awesomeAdapter);
    }

    private class AwesomePagerAdapter extends PagerAdapter{


        @Override
        public int getCount() {
            return NUM_AWESOME_VIEWS;
        }


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

            LayoutInflater mLayoutInflater = (LayoutInflater) collection.getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            final View LeagueButtonView = mLayoutInflater.inflate(R.layout.ls_button, null);
            Button LeagueButton = (Button) LeagueButtonView.findViewById(R.id.league);
            LeagueButton.setBackgroundDrawable(getResources().getDrawable(R.drawable.ls_level_eng1_locked));
            ((ViewPager) collection).addView(LeagueButtonView,0);

            return LeagueButtonView;
        }


        @Override
        public void destroyItem(View collection, int position, Object view) {
            ((ViewPager) collection).removeView((View) view);
        }



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


        @Override
        public void finishUpdate(View arg0) {}


        @Override
        public void restoreState(Parcelable arg0, ClassLoader arg1) {}

        @Override
        public Parcelable saveState() {
            return null;
        }

        @Override
        public void startUpdate(View arg0) {}

    }

Your answer is right [here](http://viewpagerindicator.com/). There is a project sample with all you need to know. Feel free to ask for some help if you still need it. — yugidroid, Jul 14 '12 at 18:46
you can create dots with textview and use the timer to highlight the respective dots based on change of page in viewpager, See the full code here http://codesfor.in/android-viewpager-slider-with-indicator/ — Ramees, Oct 13 '16 at 11:22

K_Anas · Answer 1 · 2012-07-14T19:00:44.083

14

You can use Jake Wharton's ViewPagerIndicator to add the titles or simple circles for each tab in your ViewPager.

Jake Wharton has supplied a bunch of sample code on GitHub, you can also refer to the usage section on the Jake Wharton's site.

enter image description here

You can also use the ViewPager and PageIndicator of Greendroid library

enter image description here

edited Jul 14 '12 at 19:00

answered Jul 14 '12 at 18:47

K_Anas

31,226
9
68
81

where did you get the first screenshot from? Did you implement it yourself? If so, do you have a sample code for it? Thanks :D – Kala J Nov 07 '14 at 04:17
@KalaJ I this it's from [the library](https://github.com/JakeWharton/ViewPagerIndicator) which is mentioned above. – Lee Han Kyeol Mar 17 '15 at 07:14

score 1 · Answer 2 · answered Jan 13 '16 at 16:15

1

Take two image(circle or any other shape image one for off another for on). Take one frame layout, show the image(indicator) on frame.When user change the image show the proper indicator.

I have implemented this and working fine. You can download the code and change accordingly.

answered Jan 13 '16 at 16:15

Nirmal Dhara

2,121
18
27

Upvoting because this works. There are simpler answers here: https://stackoverflow.com/questions/20586619/android-viewpager-with-bottom-dots – Tinashe Chinyanga Sep 05 '19 at 21:25

Android added circle indicator to viewpager

2 Answers2

Linked