Introduction

The classic “Facebook style slide” on Android usually refers to a left-side navigation panel that slides over or beside the main content. In older Android apps this pattern was often implemented with custom views or third-party libraries, but in current Android development the standard solution is DrawerLayout with a NavigationView or a custom drawer container.

The important design question is not how to animate a panel from the side. It is how to do it in a way that respects Android navigation, screen sizes, and gesture behavior without building a fragile custom widget.

Use DrawerLayout as the Foundation

DrawerLayout is the platform-friendly container for a sliding drawer. It keeps the main content and the drawer coordinated, handles drag gestures, and works with the toolbar hamburger icon.

A minimal XML layout looks like this:

1<?xml version="1.0" encoding="utf-8"?>
2<androidx.drawerlayout.widget.DrawerLayout
3    xmlns:android="http://schemas.android.com/apk/res/android"
4    xmlns:app="http://schemas.android.com/apk/res-auto"
5    android:id="@+id/drawer_layout"
6    android:layout_width="match_parent"
7    android:layout_height="match_parent">
8
9    <FrameLayout
10        android:id="@+id/content_container"
11        android:layout_width="match_parent"
12        android:layout_height="match_parent" />
13
14    <com.google.android.material.navigation.NavigationView
15        android:id="@+id/navigation_view"
16        android:layout_width="wrap_content"
17        android:layout_height="match_parent"
18        android:layout_gravity="start"
19        app:menu="@menu/drawer_menu" />
20
21</androidx.drawerlayout.widget.DrawerLayout>

This gives you the familiar slide-out drawer behavior without custom gesture code.

Connect It to the Toolbar

A drawer feels natural only when it integrates with the app bar. The usual pattern is to connect the drawer to a Toolbar with ActionBarDrawerToggle.

1import android.os.Bundle
2import androidx.appcompat.app.ActionBarDrawerToggle
3import androidx.appcompat.app.AppCompatActivity
4import androidx.drawerlayout.widget.DrawerLayout
5import com.google.android.material.navigation.NavigationView
6
7class MainActivity : AppCompatActivity() {
8    override fun onCreate(savedInstanceState: Bundle?) {
9        super.onCreate(savedInstanceState)
10        setContentView(R.layout.activity_main)
11
12        val drawer = findViewById<DrawerLayout>(R.id.drawer_layout)
13        val navView = findViewById<NavigationView>(R.id.navigation_view)
14
15        val toggle = ActionBarDrawerToggle(
16            this,
17            drawer,
18            R.string.drawer_open,
19            R.string.drawer_close,
20        )
21
22        drawer.addDrawerListener(toggle)
23        toggle.syncState()
24        supportActionBar?.setDisplayHomeAsUpEnabled(true)
25
26        navView.setNavigationItemSelectedListener { item ->
27            when (item.itemId) {
28                R.id.menu_home -> {
29                    drawer.closeDrawers()
30                    true
31                }
32                R.id.menu_settings -> {
33                    drawer.closeDrawers()
34                    true
35                }
36                else -> false
37            }
38        }
39    }
40}

This is the clean replacement for the old custom “Facebook slide” implementations that used manual translation animations.

Choose the Right Navigation Pattern

A side drawer is still useful, but it is not always the best default. If the app has only three to five top-level destinations, bottom navigation is often better. A drawer works best when the app has many sections, account-level actions, or secondary destinations that should not consume permanent screen space.

That matters because copying Facebook’s visual pattern without copying the underlying information architecture usually produces a drawer full of rarely used options.

Customizing the Drawer Without Breaking It

If you want the drawer to look more like the older Facebook style, customize the content inside NavigationView or replace it with your own layout inside DrawerLayout. Keep the drawer container standard even if the visual design is custom.

Good customization targets include:

• a profile header
• grouped menu sections
• badges or unread counts
• a narrower drawer width on large screens

Avoid replacing gesture handling or writing a custom sliding container unless the standard drawer behavior is truly insufficient.

Common Pitfalls

• Rebuilding drawer gestures manually instead of using DrawerLayout.
• Using a drawer for apps that would be clearer with bottom navigation.
• Filling the drawer with too many top-level destinations and account actions in one flat list.
• Forgetting to close the drawer after handling a menu tap.
• Styling the drawer heavily while ignoring accessibility and touch targets.

Summary

• The modern Android version of the old Facebook slide menu is usually DrawerLayout.
• Pair it with NavigationView or a custom drawer layout for the content.
• Connect the drawer to the toolbar so the hamburger icon and gestures behave correctly.
• Use a drawer only when the app’s navigation structure actually benefits from it.
• Customize the drawer content, not the core sliding behavior, unless you have a strong reason to go lower-level.