Bottom Navigation Bar - Android Studio | Fragments | Java | 2023

Introduction

This tutorial will guide you through creating a Bottom Navigation Bar in Android Studio using Java and Fragments. The Bottom Navigation Bar is a popular UI component that allows users to navigate between different sections of an app easily. By following these steps, you will learn how to implement this feature effectively.

Step 1: Set Up Your Android Project

• Open Android Studio and create a new project.
• Choose an empty activity template.
• Ensure you select Java as the programming language.
• Set the minimum API level according to your target devices (API 21 is a common choice).

Step 2: Add Dependencies

• Open your build.gradle (Module: app) file.
• Add the following dependency for the Bottom Navigation View:

  implementation 'com.google.android.material:material:1.4.0'
  

• Sync your project to download the dependency.

Step 3: Create Layout for Bottom Navigation

• Open activity_main.xml and set up the layout with a BottomNavigationView and a FrameLayout to hold your fragments:

  <RelativeLayout 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:layout_width="match_parent"
      android:layout_height="match_parent"
      tools:context=".MainActivity">
  
      <FrameLayout
          android:id="@+id/fragment_container"
          android:layout_width="match_parent"
          android:layout_height="match_parent" />
  
      <com.google.android.material.bottomnavigation.BottomNavigationView
          android:id="@+id/bottom_navigation"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_alignParentBottom="true"
          app:menu="@menu/bottom_navigation_menu" />
  </RelativeLayout>
  

Step 4: Create Menu Resource for Navigation

• In the res/menu directory, create a new XML file called bottom_navigation_menu.xml.
• Define the menu items:

  <menu xmlns:android="http://schemas.android.com/apk/res/android">
      <item
          android:id="@+id/nav_home"
          android:title="Home"
          android:icon="@drawable/ic_home" />
      <item
          android:id="@+id/nav_dashboard"
          android:title="Dashboard"
          android:icon="@drawable/ic_dashboard" />
      <item
          android:id="@+id/nav_notifications"
          android:title="Notifications"
          android:icon="@drawable/ic_notifications" />
  </menu>
  

Step 5: Create Fragment Classes

• Create three fragment classes for each menu item: HomeFragment, DashboardFragment, and NotificationsFragment.
• Each class should extend Fragment and override the onCreateView method to inflate its respective layout.

Step 6: Implement Navigation Logic

• In your MainActivity.java, set up the BottomNavigationView and implement the logic to switch between fragments:

  BottomNavigationView bottomNavigationView = findViewById(R.id.bottom_navigation);
  bottomNavigationView.setOnNavigationItemSelectedListener(item -> {
      Fragment selectedFragment = null;
      switch (item.getItemId()) {
          case R.id.nav_home
              selectedFragment = new HomeFragment();
              break;
          case R.id.nav_dashboard
              selectedFragment = new DashboardFragment();
              break;
          case R.id.nav_notifications
              selectedFragment = new NotificationsFragment();
              break;
      }
      getSupportFragmentManager().beginTransaction()
          .replace(R.id.fragment_container, selectedFragment)
          .commit();
      return true;
  });
  

Step 7: Set Default Fragment

• In the onCreate method of your MainActivity, set a default fragment to be displayed when the app starts:

  if (savedInstanceState == null) {
      getSupportFragmentManager().beginTransaction()
          .replace(R.id.fragment_container, new HomeFragment())
          .commit();
  }
  

Conclusion

You have successfully implemented a Bottom Navigation Bar in your Android app using Java and Fragments. This feature enhances the user experience by providing a straightforward way to navigate through different sections of your app.

Next Steps

• Customize your fragments with unique layouts and functionality.
• Explore additional features like handling back navigation.
• Consider implementing a ViewModel for better data handling within your fragments.

By following these steps, you can create a robust navigation system in your Android applications. Happy coding!