Display of Multiple pages in ViewPager, Incorrect Position

Question

I am trying to implement Dave Smith's PagerContainer to show multiple pages in my ViewPager. I have implemented an on-click listener to display the page numbers, but when I click on the left page, "clicked on item 2" message is shown (item 0 would be correct). If I click on the middle and the right pages, correct messages are displayed, "item 1" and "item 2" respectively. I've also attached an image to describe the problem. How can I fix this? Thanks in advance.

enter image description here

The code snippet is given below:

    @Override
    public Object instantiateItem(ViewGroup container, final int position) {
        TextView view = new TextView(PagerActivity.this);
        view.setText("Item "+position);
        view.setGravity(Gravity.CENTER);
        view.setBackgroundColor(Color.argb(255, position * 50, position * 10, position * 50));


        view.setOnClickListener(new View.OnClickListener() {

            public void onClick(View v) {

                Toast.makeText(PagerActivity.this, "clicked on Item " + String.valueOf(position), 1000).show();

            }
        });

        container.addView(view);
        return view;
    }

    pager.setOffscreenPageLimit(adapter.getCount());

    pager.setPageMargin(15);

    pager.setClipChildren(false);

Try replace your toast with Toast.makeText(PagerActivity.this, "clicked on Item " + ((TextView)view).getText(), 1000).show(); — Roman Nazarevych, Oct 26 '12 at 12:50

score 3 · Answer 1 · answered Apr 24 '14 at 07:40

Helo,

Change this in the PagerContainer.java file. I think this will help:

@Override
public boolean onTouchEvent(MotionEvent ev) {
    // We capture any touches not already handled by the ViewPager
    // to implement scrolling from a touch outside the pager bounds.
    switch (ev.getAction()) {
    case MotionEvent.ACTION_DOWN:
        mInitialTouch.x = (int) ev.getX();
        mInitialTouch.y = (int) ev.getY();
    default:
        if (mInitialTouch.x < mCenter.x) {
            ev.offsetLocation(-(mCenter.x - mInitialTouch.x), mCenter.y - mInitialTouch.y);
        } else {
            ev.offsetLocation(mCenter.x - mInitialTouch.x, mCenter.y - mInitialTouch.y);
        }
        break;
    }

    return mPager.dispatchTouchEvent(ev);
}

what happens if in landscape you have more than three pages visible? — Blackbelt, Jan 12 '15 at 11:16

score 1 · Answer 2 · answered Jan 06 '14 at 11:33

There are various problems with touch handling and hardware acceleration in CommonsWare's linked workaround. A rather solution is to specify a negative margin for the ViewPager:

ViewPager.setPageMargin(
    getResources().getDimensionPixelOffset(R.dimen.viewpager_margin));

I then specified this dimension in my dimens.xml:

<dimen name="viewpager_margin">-64dp</dimen>

To compensate for overlapping pages, each page's content view has the opposite margin:

android:layout_marginLeft="@dimen/viewpager_margin_fix"
android:layout_marginRight="@dimen/viewpager_margin_fix"

Again in dimens.xml:

<dimen name="viewpager_margin_fix">32dp</dimen>

(Note that the viewpager_margin_fix dimension is half that of the absolute viewpager_margin dimension.)

We implemented this in the Dutch newspaper app De Telegraaf Krant:

Phone example in De Telegraaf Krant Tablet example

Display of Multiple pages in ViewPager, Incorrect Position

2 Answers2

Linked