Viewpager Tabs Fragment & Normal Fragments

Question

I apologize in beforehand for my bad code and bad knowledge. I have just recently started coding in Android and Java

My problem is that I have Navigation Drawer and

Answer 1

The problem with your code is that your ViewPager with TabLayout should be part of the Fragment, not part of the Activity. And NavigationDrawer should just replace one fragment by another in the viewport (i.e. in the container). Now, in your code, you're trying to somehow insert your new Fragment into the ViewPager.

Here's a very basic app with Navigation Drawer, one Fragment with Tabs and rest fragments without tabs, which you can use as an example:

Activity.xml:

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:openDrawer="start">

    <android.support.design.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true">

        <android.support.design.widget.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:theme="@style/AppTheme.AppBarOverlay">

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                app:popupTheme="@style/AppTheme.PopupOverlay" />

        </android.support.design.widget.AppBarLayout>

        <FrameLayout
            android:id="@+id/fragmentContainer"
            android:layout_marginTop="?attr/actionBarSize"
            android:layout_width="match_parent"
            android:layout_height="match_parent"/>

    </android.support.design.widget.CoordinatorLayout>

    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:headerLayout="@layout/nav_header_main"
        app:menu="@menu/activity_main_drawer" />    
</android.support.v4.widget.DrawerLayout>

The code in the activity:

public class MainActivity extends AppCompatActivity
        implements NavigationView.OnNavigationItemSelectedListener {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);

        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
                this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
        drawer.setDrawerListener(toggle);
        toggle.syncState();

        NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
        navigationView.setNavigationItemSelectedListener(this);

        getSupportFragmentManager().beginTransaction().replace(R.id.fragmentContainer, new FragmentWithTabs()).commit();
    }

    @Override
    public void onBackPressed() {
        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        if (drawer.isDrawerOpen(GravityCompat.START)) {
            drawer.closeDrawer(GravityCompat.START);
        } else {
            super.onBackPressed();
        }
    }

    @SuppressWarnings("StatementWithEmptyBody")
    @Override
    public boolean onNavigationItemSelected(MenuItem item) {
        // Handle navigation view item clicks here.
        int id = item.getItemId();

        if (id == R.id.fragment_1) {
            getSupportFragmentManager().beginTransaction().replace(R.id.fragmentContainer, new FragmentWithTabs()).commit();
        } else if (id == R.id.fragment_2) {
            getSupportFragmentManager().beginTransaction().replace(R.id.fragmentContainer, new FragmentWithoutTabs()).commit();
        } else if (id == R.id.fragment_3) {
            getSupportFragmentManager().beginTransaction().replace(R.id.fragmentContainer, new Fragment()).commit();
        }

        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        drawer.closeDrawer(GravityCompat.START);
        return true;
    }
}

I.e., as you see, I'm replacing fragments in the FrameLayout with id fragmentContainer.

All logic related to the fragment with tabs, incapsulated in FragmentWithTabs:

public class FragmentWithTabs extends Fragment {

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View rootView = inflater.inflate(R.layout.fragment_with_tabs, container, false);
        ViewPager viewPager = (ViewPager)rootView.findViewById(R.id.viewPager);
        TabLayout tabLayout = (TabLayout)rootView.findViewById(R.id.tabLayout);

        viewPager.setAdapter(new FragmentPagerAdapter(getChildFragmentManager()) {
            @Override
            public Fragment getItem(int position) {
                return new SubFragment(position == 0? Color.BLUE : position == 1? Color.WHITE : Color.RED);
            }

            @Override
            public CharSequence getPageTitle(int position) {
                return position+"";
            }

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

        tabLayout.setupWithViewPager(viewPager);
        return rootView;
    }
}

I hope, it helps