Navigation drawer with toolbar'' android example

Hello friends, today we are going to talk about a topic that we use in every app, in which we need to show many activities for which we need Navigation Drawer. Use For example, gallery, help and very much have to be shown. As given in the picture below -

For this, you do not have to do much else, you will have to follow the code given below.

  Navigation Drawer Project 

First of all, you have to create a project in your Android Studio. For this, you will first go to file and then go to new project and click and create a new project. As soon as we create a project, we will see two files, first activity_main.xml and MainActivity.java But before you do that, see if there is a library implementation 'com.google.android.material: material: 1.3.0' for navigation drawers in build.gradle in Gradle Scripts. Add the dependency below to your build.gradle and hit the Sync Now button.

build.gradle

 

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

 First of all, you paste the following code in activity_main.xml.

activity_main.xml

 

 <?xml version="1.0" encoding="utf-8"?>  
 <androidx.drawerlayout.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:background="#D9E1D4"  
   android:fitsSystemWindows="true"  
   android:orientation="vertical"  
   tools:context=".MainActivity"  
   tools:openDrawer="start">  
   <include  
     layout="@layout/action_bar"  
     android:layout_width="match_parent"  
     android:layout_height="match_parent" />  
   <com.google.android.material.navigation.NavigationView  
     android:id="@+id/navi"  
     android:layout_width="wrap_content"  
     android:layout_height="match_parent"  
     android:layout_gravity="start"  
     android:fitsSystemWindows="true"  
     app:headerLayout="@layout/nav_header"  
     app:itemIconTint="#1126AE"  
     app:itemTextColor="@color/black"  
     app:menu="@menu/nav_drawer" />  
 </androidx.drawerlayout.widget.DrawerLayout>  

After pasting this code you will see an error main_bar To fix this error you will have to move the cursor over the error followed by a red colored bulb after right clicking on it you will create in main_bar layout. Will give the option to do this, after which you will create the main_bar by clicking on it. And you will see two more errors in com.google.android.material.navigation.NavigationView to solve which you will see an option of Android resource directory by right-clicking on src >> Android resource directory. By doing this, we will create a directory named menu, then by right-clicking on the menu, we will create a menu xml file and keep the name you like, I name it nav_drawer.But still you will see an error nav_header above which we will right-click and we will create nav header xml file whose code is given below.

  main_bar.xml

<?xml version="1.0" encoding="utf-8"?>  
 <androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"  
   xmlns:app="http://schemas.android.com/apk/res-auto"  
   android:layout_width="match_parent"  
   android:layout_height="match_parent">  
   <com.google.android.material.appbar.AppBarLayout  
     android:layout_width="match_parent"  
     android:layout_height="?actionBarSize"  
     android:background="@color/purple_700"  
     android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">  
     <androidx.appcompat.widget.Toolbar  
       android:id="@+id/toolbar"  
       android:layout_width="match_parent"  
       android:layout_height="wrap_content"  
       app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />  
   </com.google.android.material.appbar.AppBarLayout>  
  
 </androidx.coordinatorlayout.widget.CoordinatorLayout>  

nav_header.xml

 <?xml version="1.0" encoding="utf-8"?>  
 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
   android:layout_width="match_parent"  
   android:layout_height="200dp"  
   android:background="@color/purple_700">  
   <ImageView  
     android:layout_width="wrap_content"  
     android:layout_height="wrap_content"  
     android:layout_marginTop="70dp"  
     android:layout_marginStart="20dp"  
     android:src="@mipmap/ic_launcher"  
     android:layout_marginLeft="20dp" />  
   <TextView  
     android:layout_width="wrap_content"  
     android:layout_height="wrap_content"  
     android:layout_alignParentBottom="true"  
     android:layout_marginStart="10dp"  
     android:layout_marginBottom="18dp"  
     android:text="Best Video Downloader"  
     android:textColor="#F6F3F4"  
     android:textSize="20sp"  
     android:layout_marginLeft="10dp" />  
 </RelativeLayout>  

nav_drawer.xml

 <?xml version="1.0" encoding="utf-8"?>  
 <menu xmlns:android="http://schemas.android.com/apk/res/android"  
   xmlns:tools="http://schemas.android.com/tools"  
   tools:showIn="navigation_view">  
   <group android:checkableBehavior="single">  
     <item  
       android:id="@+id/home"  
       android:icon="@drawable/ic_home"  
       android:title="Home" />  
     <item  
       android:id="@+id/help"  
       android:icon="@drawable/ic_help"  
       android:title="how_to_use" />  
   </group>  
   <group android:checkableBehavior="single">  
     <item android:title="Communication">  
       <menu>  
         <item  
           android:id="@+id/rate"  
           android:icon="@drawable/ic_rate"  
           android:title="Rate" />  
         <item  
           android:id="@+id/share"  
           android:icon="@drawable/ic_share"  
           android:title="Share" />  
         <item  
           android:id="@+id/privacy"  
           android:icon="@drawable/ic_privacy"  
           android:title="Privacy" />  
       </menu>  
     </item>  
   </group>  
 </menu>  

In this, you will get an error of image (picture) by right-clicking on src, you can apply that picture by going to vector asset, after this you have to code in MainActivity.java, for this you have to open MainActivity .java and this code paste which is given below.

MainActivity.java

 import androidx.annotation.NonNull;  
 import androidx.appcompat.app.ActionBarDrawerToggle;  
 import androidx.appcompat.app.AppCompatActivity;  
 import androidx.appcompat.widget.Toolbar;  
 import androidx.core.view.GravityCompat;  
 import androidx.drawerlayout.widget.DrawerLayout;  
 import android.content.Intent;  
 import android.os.Bundle;  
 import android.view.Menu;  
 import android.view.MenuItem;  
 import android.widget.Toast;  
 import com.google.android.material.navigation.NavigationView;  
 public class MainActivity extends AppCompatActivity implements NavigationView.OnNavigationItemSelectedListener{  
   DrawerLayout drawerLayout;  
   NavigationView navigationView;  
   Toolbar toolbar;  
   @Override  
   protected void onCreate(Bundle savedInstanceState) {  
     super.onCreate(savedInstanceState);  
     setContentView(R.layout.activity_main);  
     toolbar = findViewById(R.id.toolbar);  
     setSupportActionBar(toolbar);  
     navigationView = findViewById(R.id.navi);  
     navigationView = findViewById(R.id.navi);  
     DrawerLayout drawer = findViewById(R.id.drawer_layout);  
     ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(  
         this, drawer, toolbar,R.string.open_navigation_view, R.string.close_navigation_view);  
     drawer.addDrawerListener(toggle);  
     drawer.setScrimColor(000);  
     toggle.syncState();  
     navigationView.setNavigationItemSelectedListener(MainActivity.this);  
   }  
   @Override  
   public void onBackPressed() {  
     DrawerLayout drawer = findViewById(R.id.drawer_layout);  
     if (drawer.isDrawerOpen(GravityCompat.START)) {  
       drawer.closeDrawer(GravityCompat.START);  
     }  
     else  
     {  
       super.onBackPressed();  
     }  
   }  
   @Override  
   public boolean onNavigationItemSelected(@NonNull MenuItem item) {  
     int v = item.getItemId();  
     if (v==R.id.home)  
     {  
       Toast.makeText(this, "Home", Toast.LENGTH_SHORT).show();  
     }  
     else if (v==R.id.help)  
     {  
       Toast.makeText(this, "help", Toast.LENGTH_SHORT).show();  
     }  
     else if (v==R.id.rate)  
     {  
       Toast.makeText(this, "Rate", Toast.LENGTH_SHORT).show();  
     }  
     else if (v==R.id.share)  
     {  
       Toast.makeText(this, "Share", Toast.LENGTH_SHORT).show();  
     }  
     else if (v==R.id.privacy)  
     {  
       Toast.makeText(this, "Privacy", Toast.LENGTH_SHORT).show();  
  
     }  
     drawerLayout = findViewById(R.id.drawer_layout);  
     drawerLayout.closeDrawer(GravityCompat.START);  
     return true;  
   }  
 }  

After pasting this code, you will get a lot of error, initially you will fix all the error by pressing alt + enter. But ActionBarDrawerToggle toggle = new ActionBarDrawerToggle (this, drawer, toolbar, R.string.open_navigation_view, R.string.close_navigation_view); You have to pass two strings.

String

  <string name="open_navigation_view">Open Navigation View</string>  
   <string name="close_navigation_view">Close Navigation View</string>  

To fix this, you will open the value and you will see a file named String in it, by opening it, you paste this string in it, instead of this your error will be fixed, if this post is useful for you, then share it. Thank you ...