How to create a custom drawer layout in android studio -
Step 1-First create a new project with empty activity and set theme Theme.MaterialComponents.DayNight.NoActionBar
and design activity_main.xml file
<?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"
tools:context=".category_activity.CategoryActivity"
tools:openDrawer="start">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<androidx.appcompat.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
</LinearLayout>
<com.google.android.material.navigation.NavigationView
android:id="@+id/navigation_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="start|center_vertical"
app:headerLayout="@layout/nav_header"
app:menu="@menu/nav_menu">
</com.google.android.material.navigation.NavigationView>
</androidx.drawerlayout.widget.DrawerLayout>
Step 2- Create a new layout resource file nav_header.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"
android:layout_width="match_parent"
android:layout_height="196dp"
android:background="@color/colorPrimary"
android:orientation="vertical">
<ImageView
android:id="@+id/nav_logo"
android:layout_width="96dp"
android:layout_height="96dp"
android:layout_marginStart="21dp"
android:layout_marginTop="21dp"
app:srcCompat="@drawable/logo_bt" />
<TextView
android:id="@+id/nav_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="21dp"
android:layout_marginTop="11dp"
android:text="@string/app_name"
android:textColor="#FFFFFF"
android:textSize="14sp"
android:textStyle="bold" />
<TextView
android:id="@+id/nav_title2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="21dp"
android:text="@string/app_name"
android:textColor="#FFFFFF"
android:textSize="18sp"
android:textStyle="bold" />
</LinearLayout>
Step 3 - 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">
<group
android:checkableBehavior="single">
<item
android:id="@+id/drawer_home"
android:checked="true"
android:icon="@drawable/ic_baseline_home_24"
android:title="home"/>
<item
android:id="@+id/drawer_favourite"
android:icon="@drawable/ic_baseline_favorite_24"
android:title="favourite"/>
<item
android:id="@+id/drawer_settings"
android:icon="@drawable/ic_baseline_settings_24"
android:title="settings"/>
</group>
</menu>
Step 4 - In MainActivity.java first initialize layouts
private DrawerLayout drawerLayout;
private Toolbar toolbar;
private NavigationView navigationView;
private ActionBarDrawerToggle drawerToggle;
And paste these code in onCreate method
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
navigationView = (NavigationView) findViewById(R.id.navigation_view);
drawerToggle = new ActionBarDrawerToggle(this, drawerLayout, R.string.drawer_open, R.string.drawer_close);
drawerLayout.addDrawerListener(drawerToggle);
drawerToggle.syncState();
navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
switch (item.getItemId()) {
case R.id.drawer_home:
Toast.makeText(MainActivity.this, "Home", Toast.LENGTH_SHORT).show();
break;
case R.id.drawer_favourite:
Toast.makeText(MainActivity.this, "favourite", Toast.LENGTH_SHORT).show();
break;
case R.id.drawer_settings:
Toast.makeText(MainActivity.this, "Setting", Toast.LENGTH_SHORT).show();
}
return true;
}
});
}
@Override
public boolean onOptionsItemSelected(@NonNull MenuItem item) {
drawerToggle.onOptionsItemSelected(item);
return true;
}
Tags:
Android Development