Merge pull request #78 from MihaiCristianCondrea/codex/replace-bottomnavigationview-with-navigationbarview

feat: add navigation rail and update navigation components

Author: MihaiCristianCondrea

app/src/main/java/com/d4rk/androidtutorials/java/ui/screens/main/MainActivity.java

@@ -41,8 +41,8 @@
 import com.d4rk.androidtutorials.java.utils.EdgeToEdgeDelegate;
 import com.google.android.gms.ads.AdRequest;
 import com.google.android.gms.ads.MobileAds;
-import com.google.android.material.bottomnavigation.BottomNavigationView;
 import com.google.android.material.dialog.MaterialAlertDialogBuilder;
+import com.google.android.material.navigation.NavigationBarView;
 import com.google.android.material.navigationrail.NavigationRailView;
 import com.google.android.material.snackbar.Snackbar;
 import com.google.android.play.core.appupdate.AppUpdateInfo;
@@ -185,18 +185,29 @@ private void launcherShortcuts() {
         ShortcutManagerCompat.pushDynamicShortcut(this, shortcut);
     }
 
+    private boolean shouldUseNavigationRail() {
+        return getResources().getConfiguration().smallestScreenWidthDp >= 600;
+    }
+
     private void observeViewModel() {
         mainViewModel.getUiState().observe(this, uiState -> {
             if (uiState == null) {
                 return;
             }
 
+            boolean useRail = shouldUseNavigationRail();
             EdgeToEdgeDelegate edgeToEdgeDelegate = new EdgeToEdgeDelegate(this);
-            if (mBinding.navView instanceof BottomNavigationView) {
-
-                edgeToEdgeDelegate.applyEdgeToEdgeBottomBar(mBinding.container, mBinding.navView);
+            NavigationBarView navBarView = (NavigationBarView) mBinding.navView;
+            if (useRail) {
+                mBinding.navRail.setVisibility(View.VISIBLE);
+                navBarView.setVisibility(View.GONE);
+                edgeToEdgeDelegate.applyEdgeToEdge(mBinding.container);
+            } else {
+                mBinding.navRail.setVisibility(View.GONE);
+                navBarView.setVisibility(View.VISIBLE);
+                edgeToEdgeDelegate.applyEdgeToEdgeBottomBar(mBinding.container, navBarView);
 
-                ((BottomNavigationView) mBinding.navView).setLabelVisibilityMode(uiState.getBottomNavVisibility());
+                navBarView.setLabelVisibilityMode(uiState.getBottomNavVisibility());
                 if (mBinding.adView != null) {
                     if (ConsentUtils.canShowAds(this)) {
                         MobileAds.initialize(this);
@@ -206,8 +217,6 @@ private void observeViewModel() {
                         mBinding.adView.setVisibility(View.GONE);
                     }
                 }
-            } else {
-                edgeToEdgeDelegate.applyEdgeToEdge(mBinding.container);
             }
 
             NavHostFragment navHostFragment = (NavHostFragment)
@@ -225,15 +234,15 @@ private void observeViewModel() {
                         .setPopExitAnim(R.anim.fragment_spring_pop_exit)
                         .build();
 
-                if (mBinding.navView instanceof BottomNavigationView bottomNav) {
-                    NavigationUI.setupWithNavController(bottomNav, navController);
-                    bottomNav.setOnItemSelectedListener(item -> {
+                if (useRail) {
+                    NavigationUI.setupWithNavController(mBinding.navRail, navController);
+                    mBinding.navRail.setOnItemSelectedListener(item -> {
                         navController.navigate(item.getItemId(), null, springNavOptions);
                         return true;
                     });
-                } else if (mBinding.navView instanceof NavigationRailView railView) {
-                    NavigationUI.setupWithNavController(railView, navController);
-                    railView.setOnItemSelectedListener(item -> {
+                } else {
+                    NavigationUI.setupWithNavController(navBarView, navController);
+                    navBarView.setOnItemSelectedListener(item -> {
                         navController.navigate(item.getItemId(), null, springNavOptions);
                         return true;
                     });

app/src/main/res/layout/activity_main.xml

@@ -19,12 +19,24 @@
             app:title="@string/app_name" />
     </com.google.android.material.appbar.AppBarLayout>
 
+    <com.google.android.material.navigationrail.NavigationRailView
+        android:id="@+id/nav_rail"
+        android:layout_width="wrap_content"
+        android:layout_height="0dp"
+        android:visibility="gone"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toBottomOf="@id/app_bar_layout"
+        app:layout_constraintBottom_toTopOf="@id/ad_view"
+        app:menu="@menu/bottom_nav_menu" />
+
     <androidx.fragment.app.FragmentContainerView
         android:id="@+id/nav_host_fragment_activity_main"
         android:name="androidx.navigation.fragment.NavHostFragment"
-        android:layout_width="match_parent"
+        android:layout_width="0dp"
         android:layout_height="0dp"
         app:defaultNavHost="true"
+        app:layout_constraintStart_toEndOf="@id/nav_rail"
+        app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintBottom_toTopOf="@id/ad_view"
         app:layout_constraintTop_toBottomOf="@id/app_bar_layout"
         app:navGraph="@navigation/mobile_navigation" />
@@ -37,10 +49,11 @@
         app:adUnitId="@string/ad_banner_unit_id"
         app:layout_constraintBottom_toTopOf="@id/nav_view" />
 
-    <com.google.android.material.bottomnavigation.BottomNavigationView
+    <com.google.android.material.navigation.NavigationBarView
         android:id="@+id/nav_view"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
+        app:labelVisibilityMode="labeled"
         app:layout_constraintBottom_toBottomOf="parent"
         app:menu="@menu/bottom_nav_menu" />
 </androidx.constraintlayout.widget.ConstraintLayout>

app/src/main/res/menu/bottom_nav_menu.xml

@@ -3,13 +3,16 @@
     <item
         android:id="@+id/navigation_home"
         android:icon="@drawable/nav_news"
-        android:title="@string/home" />
+        android:title="@string/home"
+        android:contentDescription="@string/home" />
     <item
         android:id="@+id/navigation_android_studio"
         android:icon="@drawable/ic_android"
-        android:title="@string/android_studio" />
+        android:title="@string/android_studio"
+        android:contentDescription="@string/android_studio" />
     <item
         android:id="@+id/navigation_about"
         android:icon="@drawable/nav_about"
-        android:title="@string/about" />
+        android:title="@string/about"
+        android:contentDescription="@string/about" />
 </menu>