CODEWITHSUNDEEP
androidandroid-viewpager
Lunchbox
Lunchbox

Reputation: 1550

I am trying to implement a TitlePageIndicator and a CirclePageIndicator on the same ViewPager

I am trying to implement a TitlePageIndicator and a CirclePageIndicator to create something like this:

enter image description here

This is my code:

    pageAdapter = new MyPageAdapter(getSupportFragmentManager(), fragments);
    ViewPager pager = (ViewPager) findViewById(R.id.viewpager);
    pager.setAdapter(pageAdapter);

    TitlePageIndicator mWordIndicator = (TitlePageIndicator)findViewById(R.id.word_indicator);
    mWordIndicator.setViewPager(pager);
    mWordIndicator.setOnPageChangeListener(pageListener);

    CirclePageIndicator indicator = (CirclePageIndicator) findViewById(R.id.indicator);
    indicator.setViewPager(pager);
    indicator.setOnPageChangeListener(pageListener);

OnPageChangeListener pageListener = new OnPageChangeListener() {
    @Override
    public void onPageSelected(int position) {
        // TODO Auto-generated method stub
        on_page_selected = position;
        titleText.setText(pageTitle.get(position));
        setPageImages();

    }

    @Override
    public void onPageScrolled(int position, float arg1, int arg2) {
        // TODO Auto-generated method stub

    }

    @Override
    public void onPageScrollStateChanged(int arg0) {
        // TODO Auto-generated method stub

    }
};

The problem is that only one indicator works at a time. If I comment one out, the other works. If I leave both uncommented, only the CirclePageIndicator works. Do you have any suggestions of how I can achieve this? Or is there another library that I can use to accomplish my goal? Thank you in advance!

PS - I found a duplicate question here, but there was no answer given.

Upvotes: 1

Views: 1406

Answers (2)

Daniel Liu
Daniel Liu

Reputation: 499

In order to solve this problem, you should manually call the first PageIndicator's OnPageChangeListener callback functions. Likes:

pageAdapter = new MyPageAdapter(getSupportFragmentManager(), fragments);
ViewPager pager = (ViewPager) findViewById(R.id.viewpager);
pager.setAdapter(pageAdapter);

CirclePageIndicator indicator = (CirclePageIndicator) findViewById(R.id.indicator);
indicator.setViewPager(pager);


TitlePageIndicator mWordIndicator = (TitlePageIndicator)findViewById(R.id.word_indicator);
mWordIndicator.setViewPager(pager);
mWordIndicator.setOnPageChangeListener(pageListener);



OnPageChangeListener pageListener = new OnPageChangeListener() {
    @Override
    public void onPageSelected(int position) {
        // TODO Auto-generated method stub
        on_page_selected = position;
        titleText.setText(pageTitle.get(position));
        setPageImages();

        indicator.onPageSelected(position);

    }

    @Override
    public void onPageScrolled(int position, float arg1, int arg2) {
        // TODO Auto-generated method stub
        indicator.onPageScrolled(position, arg1, arg2);
    }

    @Override
    public void onPageScrollStateChanged(int arg0) {
        // TODO Auto-generated method stub

        indicator.onPageScrollStateChanged(arg0);
    }
};

Upvotes: 4

Pasquale Anatriello
Pasquale Anatriello

Reputation: 2355

The problem is that the indicator sets itself as onPageChangedlistener for the viewPager in order to update itself. If you instantiate two indicator then, only the second will receive the notifications (since the ViewPager can only have one listener at time). You should modify a bit the code of the indicator in order to have the second page indicator set himself as listener for the first indicator. At that point you set your listener as listener for the second indicator. Hope it was clear enough.

Upvotes: 0

Related Questions