ViewPager of Fragment does not show its content when the root Fragment is replaced again

Question

i'm implementing the fragment screen that contains root view pager which contains child fragment and the first of child fragment has a view pager which shows images.

it is shown pretty good at first time, but when the fragment which contains root view pager is removed and replaced again (with new keyword for fragment screen), roow view pager doesn't show child fragment.

here is the portion of my source.

    @AfterViews // this is the method of fragment screen     protected void afterViews() {         api(HotelDetailAPI.class).getProduct("hotels", getArguments().getInt("itemId"), new Callback<Hotel>(this) {             @Override             public void success(Hotel _hotel, Response response) {                 hotel = _hotel;                 HotelDetailPagerAdapter adapter = new HotelDetailPagerAdapter(getFragmentManager());                 contentViewPager.setAdapter(adapter);                 contentViewPager.setBackgroundColor(0xffffff);                 super.success(hotel, response);             }              @Override             public void failure(RetrofitError error) {                 super.failure(error);                 LOG.error("failed");             }         });     }   private class HotelDetailPagerAdapter extends FragmentPagerAdapter {         List<Fragment> fragments = new ArrayList<>();          public HotelDetailPagerAdapter(FragmentManager fm) {             super(fm);             Bundle data = new Bundle();             data.putSerializable("hotel", hotel);             Fragment fragment1 = new HotelDetailReservationFragment_();             Fragment fragment2 = new HotelDetailReservationFragment_();             Fragment fragment3 = new HotelDetailReservationFragment_();             fragment1.setArguments(data);             fragment2.setArguments(data);             fragment3.setArguments(data);             fragments.add(fragment1);             fragments.add(fragment2);             fragments.add(fragment3);         }          @Override         public Fragment getItem(int position) {             return fragments.get(position);         }          @Override         public int getCount() {             return 3;         }     }   // this is the first fragment of root view pager it's not shown again. @EFragment(R.layout.fragment_hotel_detail_reservation) public class HotelDetailReservationFragment extends BaseFragment {     private Hotel hotel;      @AfterViews     public void afterViews() {         hotel = (Hotel)getArguments().getSerializable("hotel");         FragmentTransaction ft = getBaseActivity().getFragmentManager().beginTransaction();         Fragment fragment = new ImageSliderFragment_();         Bundle data = new Bundle();         data.putStringArray("images", hotel.getImages());         fragment.setArguments(data);         ft.add(R.id.hotel_detail_image_slider_container, fragment);         ft.commit();     } } 

note that fragment screen is popped from back stack when the user presses back button, and if the user is clicked item again, new instance of fragment screen is replaced what's wrong with them?

Answer 1

Instead of :

HotelDetailPagerAdapter adapter = new HotelDetailPagerAdapter(getFragmentManager()); 

Try :

HotelDetailPagerAdapter adapter = new HotelDetailPagerAdapter(getChildFragmentManager()); 

and

Instead of :

FragmentTransaction ft = getBaseActivity().getFragmentManager().beginTransaction(); 

Try :

FragmentTransaction ft = getChildFragmentManager().beginTransaction(); 

Answer 2

The problem is that you have nested fragments and use getFragmentManager(); You should use getChildFragmentManager() instead.

See this answer https://stackoverflow.com/a/13391359/1635488