Placing ViewPager as a row in ListView

Question

I try to use ViewPager as a row ins ListView but a get a bizarre behaviuor - Only the first row works, but when I scroll the list it disappears. When I scroll an empty row, suddenly the row above is being viewed. It seems like Android creates a single pager and use it for all rows.

This is what I see when I launch the app:

This is my row layout:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@android:color/white"
    android:orientation="vertical"
    android:paddingBottom="2dp" >

    <TextView
        android:id="@+id/textViewFriendName"
        style="@style/TextStyle"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/myFriendsBg"
        android:paddingBottom="5dp"
        android:paddingTop="5dp"
        android:text="TextView" />

    <View style="@style/DividerHorizontalStyle_gray" />

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


    <View style="@style/DividerHorizontalStyle" />

</LinearLayout>

This is my List adapter:

public class MyFriendsAdapter extends BaseAdapter implements OnClickListener {

    private ArrayList<UiD_UserFriend> mItems;
    private Context mContext;
    private FragmentManager mFragmentManager;

    public MyFriendsAdapter(Context context, ArrayList<UiD_UserFriend> items, FragmentManager fragmentManager) {
        mContext = context;
        mItems = items;
        mFragmentManager = fragmentManager;
    }

    @Override
    public int getCount() {
        return mItems.size();
    }

    @Override
    public Object getItem(int position) {
        return mItems.get(position);
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(int position, View currentView, ViewGroup viewGroup) {
        Holder holder = null;
        if (currentView == null) {
            currentView = View.inflate(mContext, R.layout.view_list_item_myfriends, null);
            holder = new Holder();
            holder.textViewUserName = (TextView) currentView.findViewById(R.id.textViewFriendName);
            holder.mMyFriendspager = (ViewPager) currentView.findViewById(R.id.pagerMyFriendHabits);
            currentView.setTag(holder);
        } else {
            holder = (Holder) currentView.getTag();
        }

        holder.textViewUserName.setText(mItems.get(position).getmName());
        MyFriendPagerAdapter tempMyFriendPagerAdapter = new MyFriendPagerAdapter(mFragmentManager, mItems.get(position).getFriendHabits());
        holder.mMyFriendspager.setAdapter(tempMyFriendPagerAdapter);

        return currentView;
    }

    class Holder {
        TextView textViewUserName;
        ViewPager mMyFriendspager;
    }
}

This is my pager adapter:

public class MyFriendPagerAdapter extends FragmentPagerAdapter {

    private ArrayList<UiD_Habit> mHabits;

    public MyFriendPagerAdapter(FragmentManager fm, ArrayList<UiD_Habit> habits) {
        super(fm);
        mHabits = habits;
    }

    @Override
    public Fragment getItem(int index) {
        return new FragmentMyFriendPage(mHabits.get(index));
    }

    @Override
    public int getCount() {
        return mHabits.size();
    }
}

Answer 1

Whenever you need to dynamically add pagers, you need to set an ID for each pager using ViewPager.setId().

Answer 2

I faced exactly same issue. Solutions:

1. Use Holder
2. Use Tag
3. Generate Unique Id

I solved the issue. If anyone need code Please ping me.

Answer 3

I created sample app

Example ViewPager with fragment: https://dl.dropboxusercontent.com/u/20178650/builds/listviewwithviewpager.zip

BUT there is one big drawback. All the cells are stored in memory, and the application can crash by low memory, whether you have a lot of cells

EDIT:

Empirically it has been found. If use simply view instead fragment in ViewPager. I can write an adapter correctly and not be struck with the memory

Example ViewPager with view: https://dl.dropboxusercontent.com/u/20178650/builds/listviewwithviewpager_v2.zip

I hope someone can help

Answer 4

 /// <summary>
    /// To Improve ListView Memory Optimization 
    /// </summary>
    public class ViewPageHolder : Java.Lang.Object
    {
        public TextView _firstTextView{ get; set; }
        public ViewPager _ViewPager { get; set; }
        public CirclePageIndicator _CirclePageIndicator { get; set; }
    }
Queue<int> _pagerId= new Queue<int>(Enumerable.Range(10, 100));//To set a Unique Id to View Pager to avoid ListView Recycle memory issue




public override View GetView(int position, Android.Views.View convertView, Android.Views.ViewGroup parent)
        {
            View view = convertView;
            ViewPageHolder ViewPageHolder = null;

        if (view != null)
        {
            ViewPageHolder = view.Tag as ViewPageHolder ;
        }
        if (ViewPageHolder == null)
        {
            ViewPageHolder = new ViewPageHolder ();
            view = Context.LayoutInflater.Inflate(Resource.Layout.SystemListLayout, null);
            ViewPageHolder .SystemNameTextView = view.FindViewById<TextView>(Resource.Id.SystemNameTextView);
            //View Pager
            ViewPageHolder._ViewPager = view.FindViewById<ViewPager>(Resource.Id.viewPager);
            //Circle Pager Indicator
            ViewPageHolder.CirclePageIndicator = view.FindViewById<CirclePageIndicator>(Resource.Id.viewPageIndicator);
            ViewPageHolder._ViewPager.Id = _pagerId.Dequeue();
            ViewPageHolder._ViewPager.Adapter = new ZoneRenameViewPagerFragmentAdapter(fm, Context, List.ElementAt(position).Zones.ToList(), ((BaseActivity)Context).IsTablet);
            ViewPageHolder.CirclePageIndicator.SetViewPager(ZoneRenameHolder.ZoneRenameViewPager);
            view.Tag = ZoneRenameHolder;
        }
        return view;
    }

1. Use Holder
2. Use Tag
3. Generate Unique Id