Fragment inside ViewPager inside ViewGroup

Question

Problem

As shown in the figure below, I have two tabs called "température" which are created in the same way (see mainFragment). In this two tabs, I have a viewpager to get previous graphics ( 05 august, 04 august,...). The first tab works well but in the second, nothing appears. When debugging, I can see that the fragment is created in both cases. It's only on the second tab where the problem is. Even more, I can see the viewpager working when sliding to the left or right end. I'm seeking since hours now and I don't understand where the problem is. Why the fragments don't appear ? I'm using android.support.v13.app.FragmentStatePagerAdapter for the adapter.

Here is a short movie to show the problem : https://www.dropbox.com/s/vf8qlrd75mdwijp/device-2017-08-06-214510.mp4?dl=0

Code

MainFragment

public class MainFragment extends Fragment implements BTListener {


// the different ID for the views.
private final static int ID_TEMPERATURE = 1;

@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, Bundle savedInstanceState) {

    final View rootView = inflater.inflate(R.layout.main,container,false);

    final ViewGroup mainContainer = (ViewGroup) rootView.findViewById(R.id.main_container);

    createTemperatureTab(mainContainer);
    createTemperatureTab(mainContainer);

    return rootView;
}

private void createTemperatureTab(ViewGroup mainContainer){

    //inflate the view
    ViewGroup view = (ViewGroup) LayoutInflater.from(getActivity()).inflate(R.layout.main_list,mainContainer,false);
    ((TextView)view.findViewById(R.id.title_main_list)).setText("Température");
    ((TextView)view.findViewById(R.id.information_main_list)).setText("°C");
    final ExpandableLayout expandableLayout = (ExpandableLayout) view.findViewById(R.id.expandable_layout);

    CustomPager viewPager = (CustomPager) view.findViewById(R.id.viewpager);
    LinearGraphAdapter linearGraphAdapter = new LinearGraphAdapter(getChildFragmentManager());
    viewPager.setAdapter(linearGraphAdapter);
    viewPager.setCurrentItem(linearGraphAdapter.getCount());

    expandableLayout.setExpanded(false);
    expandableLayout.setDuration(500);
    expandableLayout.setInterpolator(new DecelerateInterpolator());

    view.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            if(expandableLayout.isExpanded()) {
                expandableLayout.collapse();
            }
            else {
                expandableLayout.expand();
            }
        }
    });
    mainContainer.addView(view);
}

}

main_list

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <ImageView
        android:id="@+id/image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingLeft="10dp"
        android:src="@mipmap/ic_launcher" />

    <TextView
        android:id="@+id/title_main_list"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical"
        android:layout_marginLeft="10dp"
        android:textSize="20sp" />

    <TextView
        android:id="@+id/information_main_list"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical"
        android:layout_marginLeft="80dp"
        android:textSize="20sp" />
</LinearLayout>

<net.cachapa.expandablelayout.ExpandableLayout
    android:id="@+id/expandable_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <com.example.renaud.aquariumslinding.adapter.CustomPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    </com.example.renaud.aquariumslinding.adapter.CustomPager>

</net.cachapa.expandablelayout.ExpandableLayout>


</LinearLayout>

LineGraphFragment

public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, Bundle savedInstanceState) {
    ViewGroup rootView = (ViewGroup) inflater.inflate(R.layout.linear_graph_layout,container,false);

    lineChart = (LineChart) rootView.findViewById(R.id.linear_graph);
    initiateChart(lineChart); // not important for this case
    drawChart(lineChart,dayOfYear); // not important for this case

    return rootView;
}

linear_graph_layout

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

<TextView
    android:id="@+id/linear_graph_date"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center_horizontal"
    android:elevation="4dp"
    android:textColor="#fff" />
<com.github.mikephil.charting.charts.LineChart
    android:id="@+id/linear_graph"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />
</LinearLayout>

LinearGraphAdapter

public class LinearGraphAdapter extends FragmentStatePagerAdapter {

public static int MAXIMUM_COUNT_PAGER = 7;
private int mCurrentPosition = -1;

public LinearGraphAdapter(FragmentManager fragmentManager){
    super(fragmentManager);
}
@Override
public Fragment getItem(int position) {
    Bundle bundle = new Bundle();
    bundle.putInt(Constant.CUSTOM_PAGER_NUMBER,MAXIMUM_COUNT_PAGER-position);
    Fragment fragment = new LinearGraphFragment();
    fragment.setArguments(bundle);

    return fragment;
}

@Override
public int getCount() {
    return MAXIMUM_COUNT_PAGER;
}

@Override
public void setPrimaryItem(ViewGroup container, int position, Object object) {
    super.setPrimaryItem(container, position, object);
    if (position != mCurrentPosition) {
        Fragment fragment = (Fragment) object;
        CustomPager pager = (CustomPager) container;
        if (fragment != null && fragment.getView() != null) {
            mCurrentPosition = position;
            pager.measureCurrentView(fragment.getView());
        }
    }
}
}

Answer 1

Ok, after a night of research and reading the API I figured it out. I don't understand everything but it seems the v13 and v4 library have a conflict.

To override it, firstly :

• Make sure that you called getChildFragmentManager() instead of getFragmentManager()
• Create a different ID for all the different viewpageryou have. Those IDs must have at least 4 digits. Of course, it is better to have those in R.String
• Set your ID in every viewpager by calling setID()
• If it doesn't work, please clean and rebuild your project.

And finally, the reward :

I hope that it will help.