Drawer demo project in android
Step1: Main Activity where you want to show
MainActivity.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:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/drawer"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<androidx.appcompat.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="60dp"
android:id="@+id/toolbar"
app:title="Restaurants"
/>
</LinearLayout>
<com.google.android.material.navigation.NavigationView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:headerLayout="@layout/nav_header"
android:id="@+id/nav_view"
app:menu="@menu/nav_menu"
android:layout_gravity="start"
/>
</androidx.drawerlayout.widget.DrawerLayout>
Step 2: Design nav_header layout in layout section
nav_header.xml: –
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_margin="10dp"
android:layout_height="match_parent">
<de.hdodenhof.circleimageview.CircleImageView
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/profile_image"
android:layout_width="96dp"
android:layout_height="96dp"
android:src="@drawable/grabbing"
app:civ_border_width="2dp"
app:civ_border_color="#FF000000"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:text="My Account"
android:textColor="@color/black"
android:layout_marginTop="10dp"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:text="Profile"
android:textColor="@color/black"
android:layout_marginTop="10dp"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:text="Orders"
android:textColor="@color/black"
android:layout_marginTop="10dp"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:text="Logout"
android:textColor="@color/black"
android:layout_marginTop="10dp"
/>
</LinearLayout>
Step3:- right click on res folder create a new Android resources directory menu and create a menu resource file
nav_menu.xml:-
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@+id/menu_home"
android:title="Home"
android:icon="@drawable/grabbing"/>
<item android:id="@+id/name"
android:title="My profile"
android:icon="@drawable/grabbing"/>
<item android:id="@+id/order"
android:title="Orders"
android:icon="@drawable/grabbing"/>
</menu>
Step4: MainActivity.java
package com.example.drawerdemome;
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.os.Bundle;
import android.view.MenuItem;
import android.widget.Toast;
import com.google.android.material.navigation.NavigationView;
public class MainActivity extends AppCompatActivity {
NavigationView nav;
ActionBarDrawerToggle toggle;
DrawerLayout drawerLayout;
Toolbar toolbar;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
getSupportActionBar().hide();
toolbar = (Toolbar) findViewById( R.id.toolbar );
nav= findViewById(R.id.nav_view);
drawerLayout = findViewById( R.id.drawer );
toggle =new ActionBarDrawerToggle(this,drawerLayout,toolbar,R.string.open,R.string.close);
drawerLayout.addDrawerListener(toggle);
toggle.syncState();
nav.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
switch (item.getItemId()){
case R.id.menu_home:
Toast.makeText(MainActivity.this, "Home is clicked", Toast.LENGTH_SHORT).show();
drawerLayout.closeDrawer(GravityCompat.START);
break;
case R.id.name:
Toast.makeText(MainActivity.this, "Name is clicked", Toast.LENGTH_SHORT).show();
drawerLayout.closeDrawer(GravityCompat.START);
break;
case R.id.order:
Toast.makeText(MainActivity.this, "Order is clicked", Toast.LENGTH_SHORT).show();
drawerLayout.closeDrawer(GravityCompat.START);
break ;
}
return true;
}
});
}
}
Depedency for Circle Image view
implementation 'de.hdodenhof:circleimageview:3.1.0'