How to maintain the state of ViewPager in a ListView?

Question

I want to implement a list of ViewPagers. Every item of a ListView is ViewPager. This works so far. My problem is, I can not maintain the state of the ViewPager. For example: when I change the page of the first ViewPager in the list, scroll down until the first ViewPager is no longer visible and then scroll up again, the first ViewPager is shows its first page again.

I wrote two adapters, one for the ListView and one for the ViewPager. I'm trying to recycle the view from convertView parameter of the getView method in the ListAdapter. Not sure whether I'm doing it right and no idea how to do it in the ViewPagerAdapter.

Any ideas?

here is my code so far:

getView from MyListAdapter:

@Override
public View getView(int position, View convertView, ViewGroup parent) {
    if(convertView == null){
        LayoutInflater inflater = (LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        mRowView = inflater.inflate(R.layout.listitem, parent, false);

    }else{
        mRowView=convertView;
    }
    switch(position){
    case 0://Fussball
        ViewPagerAdapter fussballAdapter = new ViewPagerAdapter(mContext,"Fussball");
        ViewPager fussballPager = (ViewPager) mRowView.findViewById(R.id.viewpager1);
        fussballPager.setAdapter(fussballAdapter);
    break;
    case 1://Handball
    ViewPagerAdapter handballAdapter = new ViewPagerAdapter(mContext,"Handball");
        ViewPager handballPager = (ViewPager) mRowView.findViewById(R.id.viewpager1);
        handballPager.setAdapter(handballAdapter);
        break;
    //.../
    default:
        //Do nothing
    }
    return mRowView;
}

instantiateItem from ViewPagerAdapter:

@Override
public Object instantiateItem(View pager, int position) {
    inflater = (LayoutInflater) context
        .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    switch(position){
    case 0:
        oneLayout=inflater.inflate(R.layout.table_layout, null);
        break;
    case 1:
        oneLayout=inflater.inflate(R.layout.table_layout_second, null);
        break;
    default:
        oneLayout=inflater.inflate(R.layout.table_layout, null);
        break;
    }
    ((ViewPager)pager).addView( oneLayout, 0 );
    return oneLayout;
}

Thanks! :)

Answer 1

Implementing setOnPageChangeListener and You Can Get Current Position here onpageselected

    pager = (ViewPager) findViewById(R.id.pager);
    pager.setAdapter(new ImagePagerAdapter(imageUrls));
    pager.setCurrentItem(position);

    pager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {

        public void onPageScrollStateChanged(int arg0) {
            // TODO Auto-generated method stub
            int i = 0;
            int newpos = arg0;

        }


        public void onPageScrolled(int arg0, float arg1, int arg2) {
            // TODO Auto-generated method stub
            int i = 0;
            int newpos = arg0;

        }

        public void onPageSelected(int arg0) {
            // TODO Auto-generated method stub
            int i = 0;
            position = arg0;
            //you can get Current position here             
        }
    });

Hope this Helps!!!

Answer 2

You can thank ListView Recycling as the cause of this problem. It help performs the recycler reclaims your row items and reuses it.

One easy fix that should solve your problem is using tag. Set the tag before you return rowView.

view.setTag(currentPagerPosition);

Then if convertView != null you know you must have set the position so you can do

int pastPagerPosition = (int) view.getTag();