How to Create Fragment Using Bottom Navigation in Social Media Android App? - GeeksforGeeks

06 Sep, 2021
This is the Part 2 of “Build a Social Media App in Android Studio” tutorial, and we are going to cover the following functionalities in this article:
We are going to Create Bottom Navigation with 5 Fragments (Home, Users, AddBlog, ChatList, Profile).
On HomeFragment we will be Showing all the added blogs.
In the UsersFragment, we will be showing all the Registered Users.
In the AddBlogFragment We will be adding our blogs.
In the ChatlistFragment we will be showing a chat list of all users with whom we have chat.
In the ProfileFragment We will be showing the Profile of the user where we will be showing users’ data and the blogs written by the user.
Step 1: Firstly we will create a menu directory inside the res folder. Refer to this article How to Create Menu Folder & Menu File in Android Studio. And name the menus file as menu_nav.xml for creating the layout of bottom navigation. Below is the code for the menu_nav.xml file.
XML
<?xml version="1.0" encoding="utf-8"?><menu xmlns:android="http://schemas.android.com/apk/res/android">    <item        android:id="@+id/nav_home"        android:icon="@drawable/ic_home"        android:title="Home" />    <item        android:id="@+id/nav_users"        android:icon="@drawable/ic_users"        android:title="Users" />    <item        android:id="@+id/nav_addblogs"        android:icon="@drawable/ic_add"        android:title="Add Blogs" />     <item        android:id="@+id/nav_chat"        android:icon="@drawable/ic_chat"        android:title="ChatList" />    <item        android:id="@+id/nav_profile"        android:icon="@drawable/ic_account"        android:title="Profile" /> </menu>
Step 2: Add dependency to build.gradle (Module: app)
Navigate to the Gradle Scripts > build. gradle(Module: app) and add the below dependency in the dependencies section. 
implementation ‘com.google.android.material:material:1.2.0’
Step 3: Working with the activity_dashboard.xml file
This page will be the first activity in our app after the user logged in. Navigate to the app > res > layout > activity_dashboard.xml and add the below code to that file. Below is the code for the activity_dashboard.xml file.  
XML
<?xml version="1.0" encoding="utf-8"?><LinearLayout    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"    android:gravity="center"    android:orientation="vertical"    tools:context=".DashboardActivity">     <FrameLayout        android:id="@+id/content"        android:layout_width="match_parent"        android:layout_height="0dp"        android:layout_weight="1"></FrameLayout>         <com.google.android.material.bottomnavigation.BottomNavigationView        android:id="@+id/navigation"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_gravity="bottom"        android:background="?android:attr/windowBackground"        app:labelVisibilityMode="labeled"        app:menu="@menu/menu_nav">     </com.google.android.material.bottomnavigation.BottomNavigationView>     </LinearLayout>
Step 4: Create 5 new blank fragments
Go to the app(right-click) > New > Fragment > Fragment (Blank) and name the fragment as HomeFragment, ProfileFragment, UsersFragment, ChatListFragment, and AddBlogsFragment.
Step 5: Working with the DashboardActivity.java file
In this file, we are just showing the fragment according to the navigation item selected. Then we will be showing the respective fragment. 
HomeFragment fragment=new HomeFragment();
        FragmentTransaction fragmentTransaction=getSupportFragmentManager().beginTransaction();
        fragmentTransaction.replace(R.id.content,fragment,"");
        fragmentTransaction.commit();
Go to the DashboardActivity.java file and refer to the following code. Below is the code for the DashboardActivity.java file.
Java
package com.example.socialmediaapp; import android.os.Bundle;import android.view.MenuItem; import androidx.annotation.NonNull;import androidx.appcompat.app.ActionBar;import androidx.appcompat.app.AppCompatActivity;import androidx.fragment.app.FragmentTransaction; import com.google.android.material.bottomnavigation.BottomNavigationView;import com.google.firebase.auth.FirebaseAuth;import com.google.firebase.auth.FirebaseUser; public class DashboardActivity extends AppCompatActivity {         private FirebaseAuth firebaseAuth;    FirebaseUser firebaseUser;    String myuid;    ActionBar actionBar;    BottomNavigationView navigationView;     @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_dashboard);        actionBar = getSupportActionBar();        actionBar.setTitle("Profile Activity");        firebaseAuth = FirebaseAuth.getInstance();         navigationView = findViewById(R.id.navigation);        navigationView.setOnNavigationItemSelectedListener(selectedListener);        actionBar.setTitle("Home");                 // When we open the application first        // time the fragment should be shown to the user        // in this case it is home fragment        HomeFragment fragment = new HomeFragment();        FragmentTransaction fragmentTransaction = getSupportFragmentManager().beginTransaction();        fragmentTransaction.replace(R.id.content, fragment, "");        fragmentTransaction.commit();    }     private BottomNavigationView.OnNavigationItemSelectedListener selectedListener = new BottomNavigationView.OnNavigationItemSelectedListener() {        @Override        public boolean onNavigationItemSelected(@NonNull MenuItem menuItem) {            switch (menuItem.getItemId()) {                                 case R.id.nav_home:                    actionBar.setTitle("Home");                    HomeFragment fragment = new HomeFragment();                    FragmentTransaction fragmentTransaction = getSupportFragmentManager().beginTransaction();                    fragmentTransaction.replace(R.id.content, fragment, "");                    fragmentTransaction.commit();                    return true;                                     case R.id.nav_profile:                    actionBar.setTitle("Profile");                    ProfileFragment fragment1 = new ProfileFragment();                    FragmentTransaction fragmentTransaction1 = getSupportFragmentManager().beginTransaction();                    fragmentTransaction1.replace(R.id.content, fragment1);                    fragmentTransaction1.commit();                    return true;                                     case R.id.nav_users:                    actionBar.setTitle("Users");                    UsersFragment fragment2 = new UsersFragment();                    FragmentTransaction fragmentTransaction2 = getSupportFragmentManager().beginTransaction();                    fragmentTransaction2.replace(R.id.content, fragment2, "");                    fragmentTransaction2.commit();                    return true;                                     case R.id.nav_chat:                    actionBar.setTitle("Chats");                    ChatListFragment listFragment = new ChatListFragment();                    FragmentTransaction fragmentTransaction3 = getSupportFragmentManager().beginTransaction();                    fragmentTransaction3.replace(R.id.content, listFragment, "");                    fragmentTransaction3.commit();                    return true;                                     case R.id.nav_addblogs:                    actionBar.setTitle("Add Blogs");                    AddBlogsFragment fragment4 = new AddBlogsFragment();                    FragmentTransaction fragmentTransaction4 = getSupportFragmentManager().beginTransaction();                    fragmentTransaction4.replace(R.id.content, fragment4, "");                    fragmentTransaction4.commit();                    return true;            }            return false;        }    };}
Output:
For all the drawable file used in this article please refer to this link: https://drive.google.com/drive/folders/1M_knOH_ugCuwSP5nkYzeD4dRp-Honzbe?usp=sharing
Below is the file structure after performing these operations: 
 
chhabradhanvi
Firebase
Android
Java
Java
Android
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
How to Create and Add Data to SQLite Database in Android?
Broadcast Receiver in Android With Example
Resource Raw Folder in Android Studio
Services in Android with Example
Android RecyclerView in Kotlin
Arrays in Java
Split() String method in Java with examples
For-each loop in Java
Object Oriented Programming (OOPs) Concept in Java
Arrays.sort() in Java with examples