Content does not load in tab layout fragment when the parent fragment is replacing other fragment

Question

I have a MainActivIty and it supports two fragments i.e Home and Profile.Home has a TabLayout which in turn has three fragments Trending,Followed and Nearby. So the issue is when Home is first time loaded it shows the content of the Tab fragments and slider of tab layout moves properly but when I got to profile and then to home then the tab layout fragments do not load and while swiping left to right slider does not move smoothly.Here is the code.

public class MainActivity extends AppCompatActivity {

 ImageButton home_btn,myProfile_btn;
FragmentManager fragmentManager;
FragmentTransaction fragmentTransaction;
TextView txt_action_bar;
Home home;
ProfileFragment profile;
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    home_btn=(ImageButton)findViewById(R.id.home_btn) ;
    discover_btn=(ImageButton)findViewById(R.id.discover_btn) ;
    myProfile_btn=(ImageButton)findViewById(R.id.profile_btn) ;
    notification_btn=(ImageButton)findViewById(R.id.notification_btn) ;
    plus_btn=(ImageButton)findViewById(R.id.btn_plus) ;

    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
     txt_action_bar = (TextView)findViewById(R.id.toolbar_title);
    displayMetrics = getResources().getDisplayMetrics();
    Typeface custom_font = Typeface.createFromAsset(getAssets(),"fonts/NoteworthyLight.ttf");
    txt_action_bar.setTypeface(custom_font);


    setSupportActionBar(toolbar);
     fragmentManager = getSupportFragmentManager();
    fragmentTransaction = fragmentManager.beginTransaction();
     home = new Home();
     profile = new ProfileFragment();
    fragmentTransaction.add(R.id.main_fragment_container,home,"home");
    fragmentTransaction.commit();


}

public void onClickHome(View view)
{


    fragmentManager = getSupportFragmentManager();
    fragmentTransaction = fragmentManager.beginTransaction();

    fragmentTransaction.replace(R.id.main_fragment_container,home,"home");
    fragmentTransaction.commit();
}

public void onClickMyProfile(View view)
{

    fragmentManager = getSupportFragmentManager();
    fragmentTransaction = fragmentManager.beginTransaction();

    fragmentTransaction.replace(R.id.main_fragment_container,profile,"profile");

   fragmentTransaction.commit();
}

}

Home.java

public class Home extends Fragment {


private SectionsPagerAdapter mSectionsPagerAdapter;
private ViewPager mViewPager;

public Home() {
    // Required empty public constructor
}



@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

}

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    View view=inflater.inflate(R.layout.fragment_home, container, false);

    mSectionsPagerAdapter = new SectionsPagerAdapter(getFragmentManager());
    mViewPager = (ViewPager) view.findViewById(R.id.container);
    mViewPager.setAdapter(mSectionsPagerAdapter);
    TabLayout tabLayout = (TabLayout) view.findViewById(R.id.tabs);
    tabLayout.setupWithViewPager(mViewPager);
    return view;
}

FollowedFragment.java

public class FollowedFragment extends Fragment {


public FollowedFragment() {
}

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    final View rootView = inflater.inflate(R.layout.feeds_list, container, false);
    new DownloadFollowedFeeds().execute();
    return rootView;
}

fragment_home.xml

<LinearLayout android:layout_below="@+id/header"
android:layout_above="@+id/footer"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_gravity="center_vertical"
android:orientation="vertical"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android">
<android.support.design.widget.TabLayout
    android:id="@+id/tabs"
    style="@style/TabNameStyle"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/medium_turquoise"
    app:tabGravity="fill"
    app:tabMode="fixed" />

<android.support.v4.view.ViewPager
    android:id="@+id/container"
    android:layout_width="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    android:layout_height="fill_parent"/>

SectionPagerAdapter.java

public class SectionsPagerAdapter extends FragmentPagerAdapter {

private String tabTitles[] = new String[] { "Trending", "Followed","Nearby" };


public SectionsPagerAdapter(FragmentManager fm) {
    super(fm);
}

@Override
public Fragment getItem(int position) {
    // getItem is called to instantiate the fragment for the given page.
    // Return a PlaceholderFragment (defined as a static inner class below).
    Log.i("tag","number"+String.valueOf(position));
    if(position==0)  return  new TrendingFragment();
    else if(position==1)    return new FollowedFragment();
    else return new NearbyFragment();
}

@Override
public int getCount() {
    // Show 3 total pages.
    return 3;
}

@Override
public CharSequence getPageTitle(int position) {
    return tabTitles[position];
}

}

Answer 1

As answered here:

When you are creating the view adapter in Home.java:

instead of

mSectionsPagerAdapter = new SectionsPagerAdapter(getFragmentManager());

you should do,

mSectionsPagerAdapter = new SectionsPagerAdapter(getChildFragmentManager());