android - 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().