Implementing Navigation Drawer Without TitleBar

Question

I'm planning to implement a navigation bar to let users navigate to different activites. But here's the problem, I've found plenty articles about creating a navigation drawer but it seems doesn't work for me , because my UI doesn't have any titlebar. And what i actually want is to call up the navigation drawer whenever users press on a button near to the navigation drawer.

Is there any possible way to do this ?

Answer 1

Yes you can implement DrawerLayout with out ActionBar. You can manually open and close the DrawerLayout like

    drawerLayout.openDrawer(Gravity.LEFT);

    drawerLayout.closeDrawer(Gravity.LEFT);

Answer 2

It is very simple.

Here is your main activity's layout, activity_main.xml:

<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:fitsSystemWindows="true"
    android:layout_height="match_parent">

    <FrameLayout
        android:animateLayoutChanges="true"
        android:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity"
        tools:ignore="MergeRootFrame" />

    <android.support.design.widget.NavigationView
        android:id="@+id/navigation_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:headerLayout="@layout/drawer_list_header"
        app:menu="@menu/navigation"/>
</android.support.v4.widget.DrawerLayout>

And here's your MainActivity:

public class MainActivity extends AppCompatActivity {

    NavigationView navigationView;
    DrawerLayout drawerLayout;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        navigationView = (NavigationView) findViewById(R.id.navigation_view);

        navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(MenuItem menuItem) {
                switch (menuItem.getItemId()) {
                    case R.id.navi_1:
                        // on 1st item in the menu, do something
                        break;
                    case R.id.navi_2:
                        // on 2nd item in the menu, do something
                        break;
                }
                drawerLayout.closeDrawers();
                return false;
            }
        });

        drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
    }

    // [...]

    private void openDrawer() {
        if (!drawerLayout.isDrawerOpen(navigationView)) {
            drawerLayout.openDrawer(navigationView);
        }
    }

    private void closeDrawer() {
        if (drawerLayout.isDrawerOpen(navigationView)) {
            drawerLayout.closeDrawers();
        }
    }
}

Now you can open the drawer with openDrawer() and close it with closeDrawer().

A sample navigation.xml file which is located under the menu dir in the res (resources) folder:

<?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/navi_1"
            android:checked="true"
            android:icon="@drawable/ic_android"
            android:title="First item"/>
        <item
            android:id="@+id/navi_2"
            android:icon="@drawable/ic_android"
            android:title="Second item"/>
    </group>
</menu>

Sample drawer_list_header.xml file, located under the layout dir in the res folder:

<?xml version="1.0" encoding="utf-8"?>
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/list_header"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:scaleType="fitXY"
    android:adjustViewBounds="true"
    android:paddingBottom="8dp"
    android:src="@drawable/list_header_final">

</ImageView>

Here are some notes:

• You have to declare a menu file for the drawer, see app:menu="@menu/navigation" in the layout file.
• You might want to declare a header layout, which is displayed over the menu elements in the drawer, see app:headerLayout="@layout/drawer_list_header".
• The drawer can be opened by a fling-like action from the edge of the screen. To prevent the users from doing that, you might want to lock/unlock your drawer on action using drawerLayout.setDrawerLockMode(...);, see the documentation for details.

Also note that in order to use NavigationView, you'll need the latest design support lib by adding the dependency to your module's gradle file: compile 'com.android.support:design:22.2.0'. See more about it here.