Adding Home/Profile fragments to the menu drawer

Hook the new fragments into MenuActivity and the drawer menu

Create the fragments (Android Studio UI)

Create two blank fragments via the Android Studio wizard. Do not diff the generated files here, just make sure these are present:

  • app/src/main/java/com/example/tictacmenu/shell/HomeFragment.java
  • app/src/main/java/com/example/tictacmenu/shell/ProfileFragment.java
  • app/src/main/res/layout/fragment_home.xml
  • app/src/main/res/layout/fragment_profile.xml
  • The wizard-added hello_blank_fragment string in app/src/main/res/values/strings.xml

Update the drawer menu items

res/menu/menu_drawer.xml gets new items for Home and Profile, and the local game item gets a clearer id.

    <menu xmlns:android="http://schemas.android.com/apk/res/android">

        <item
+            android:id="@+id/nav_home"
+            android:title="@string/menu_home" />

+        <item
+            android:id="@+id/nav_local_game"
            android:title="@string/menu_local_game" />

+        <item
+            android:id="@+id/nav_profile"
+            android:title="@string/menu_profile" />

    </menu>
    
    <menu xmlns:android="http://schemas.android.com/apk/res/android">

        <item

-            android:id="@+id/nav_main"
            android:title="@string/menu_local_game" />

    </menu>

Add the new menu labels

res/values/strings.xml adds labels for the new menu items and removes the old placeholder hint string.

    <resources>
        <string name="app_name">TicTacMenu</string>
        <string name="drawer_open">Open navigation drawer</string>
        <string name="drawer_close">Close navigation drawer</string>
+        <string name="menu_home">Home</string>
        <string name="menu_local_game">Local Game</string>
+        <string name="menu_profile">Profile</string>
        <!-- TODO: Remove or change this placeholder text -->
        <string name="hello_blank_fragment">Hello blank fragment</string>
    </resources>
    
    <resources>
        <string name="app_name">TicTacMenu</string>
        <string name="drawer_open">Open navigation drawer</string>
        <string name="drawer_close">Close navigation drawer</string>
        <string name="menu_local_game">Local Game</string>

-        <string name="menu_hint">Use the menu to start a game.</string>
        <!-- TODO: Remove or change this placeholder text -->
        <string name="hello_blank_fragment">Hello blank fragment</string>
    </resources>

Remove the placeholder hint view

With fragments hosting the content, the old hint TextView is removed from res/layout/activity_menu.xml.

        <FrameLayout
            android:id="@+id/content_container"
            android:layout_width="match_parent"
            android:layout_height="0dp"
+            android:layout_weight="1" />
    
        <FrameLayout
            android:id="@+id/content_container"
            android:layout_width="match_parent"
            android:layout_height="0dp"

-            android:layout_weight="1">

-            <TextView
-                android:id="@+id/menu_hint"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_gravity="center"
-                android:text="@string/menu_hint" />
-        </FrameLayout>

Wire the drawer selections to fragments

In app/src/main/java/com/example/tictacmenu/shell/MenuActivity.java, add the Fragment import, route menu items to fragments, set a default fragment on first load, and add a helper to replace the content container.

    import androidx.core.view.GravityCompat;
    import androidx.drawerlayout.widget.DrawerLayout;
+ import androidx.fragment.app.Fragment;
    
    import androidx.core.view.GravityCompat;
    import androidx.drawerlayout.widget.DrawerLayout;
    
            NavigationView navigationView = findViewById(R.id.navigation_view);
            navigationView.setNavigationItemSelectedListener(item -> {
+                if (item.getItemId() == R.id.nav_home) {
+                    showFragment(new HomeFragment());
+                } else if (item.getItemId() == R.id.nav_local_game) {
+                    startActivity(new Intent(this, MainActivity.class));
+                } else if (item.getItemId() == R.id.nav_profile) {
+                    showFragment(new ProfileFragment());
+                }
                drawerLayout.closeDrawer(GravityCompat.START);
                return true;
            });

+            if (savedInstanceState == null) {
+                showFragment(new HomeFragment());
+                navigationView.setCheckedItem(R.id.nav_home);
+            }
        }

        @Override
        public boolean onOptionsItemSelected(@NonNull MenuItem item) {
            if (drawerToggle.onOptionsItemSelected(item)) {
                return true;
            }
            return super.onOptionsItemSelected(item);
        }

+        private void showFragment(Fragment fragment) {
+            getSupportFragmentManager()
+                    .beginTransaction()
+                    .replace(R.id.content_container, fragment)
+                    .commit();
+        }
    }
    
            NavigationView navigationView = findViewById(R.id.navigation_view);
            navigationView.setNavigationItemSelectedListener(item -> {

-                if (item.getItemId() == R.id.nav_main) {
-                    startActivity(new Intent(this, MainActivity.class));
-                }
                drawerLayout.closeDrawer(GravityCompat.START);
                return true;
            });
        }

        @Override
        public boolean onOptionsItemSelected(@NonNull MenuItem item) {
            if (drawerToggle.onOptionsItemSelected(item)) {
                return true;
            }
            return super.onOptionsItemSelected(item);
        }
    }

Quick visual check in the Home fragment (optional)

To make it obvious that the fragment is swapping, change the placeholder text in res/layout/fragment_home.xml.

        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
+            android:text="TESTHOME" />
    
        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"

-            android:text="@string/hello_blank_fragment" />

לסיום - חיבור העשייה להבנת תפריט מגירה

סוכן ללמידת אנדרואיד. בקשו ממנו להדריך אתכם על תפריט מגירה ופרגמנטים