ekyawthan / material-drawer

Custom drawer implementation for Material design apps.

material-drawer

Custom drawer implementation for Material design apps.

How-To-Use

Step 1: Include it in your layout:

<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/drawerLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">
    
    <com.heinrichreimersoftware.materialdrawer.DrawerView
        android:id="@+id/drawer"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"/>

</android.support.v4.widget.DrawerLayout>

Step 2: Find views:

DrawerLayout drawerLayout = (DrawerLayout) findViewById(R.id.drawerLayout);
DrawerView drawer = (DrawerView) findViewById(R.id.drawer);

Step 3: Set a profile:

drawer.setProfile(
        new DrawerProfile()
                .setAvatar(getResources().getDrawable(R.drawable.profile_avatar))
                .setBackground(getResources().getDrawable(R.drawable.profile_background))
                .setName(getString(R.string.profile_name))
                .setDescription(getString(R.string.profile_description))
                .setOnProfileClickListener(new DrawerProfile.OnProfileClickListener() {
                    @Override
                    public void onClick(DrawerProfile drawerProfile) {
                        Toast.makeText(YourActivity.this, "Clicked profile", Toast.LENGTH_SHORT).show();
                    }
                })
        );

Step 4: Populate your drawer list:

drawer.addItem(
        new DrawerItem()
                .setImage(getResources().getDrawable(R.drawable.ic_first_item))
                .setTextPrimary(getString(R.string.title_first_item))
                .setTextSecondary(getString(R.string.description_first_item))
                .setOnItemClickListener(new DrawerItem.OnItemClickListener() {
                    @Override
                    public void onClick(DrawerItem drawerItem, int id, int position) {
                        Toast.makeText(YourActivity.this, "Clicked first item (#" + id + ")", Toast.LENGTH_SHORT).show();
                    }
                })
        );
drawer.addDivider();
drawer.addItem(
        new DrawerItem()
                .setImage(getResources().getDrawable(R.drawable.ic_second_item))
                .setTextPrimary(getString(R.string.title_second_item))
                .setOnItemClickListener(new DrawerItem.OnItemClickListener() {
                    @Override
                    public void onClick(DrawerItem drawerItem, ind id, int position) {
                        Toast.makeText(YourActivity.this, "Clicked second item (#" + id + ")", Toast.LENGTH_SHORT).show();
                    }
                })
        );

Tip: Lollipop status bar

Step 1: Add fitSystemWindows="true" to your DrawerLayout and your DrawerView in XML.

Step 2: Set custom status bar color for your DrawerLayout:

drawerLayout.setStatusBarBackgroundColor(getResources().getColor(R.color.your_chosen_color));

Step 3: Use Toolbar instead of ActionBar.

Step 4: Make your status bar transparent:

<style name="Theme.MyApp" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="android:windowDrawsSystemBarBackgrounds">true</item>
    <item name="android:statusBarColor">@android:color/transparent</item>
</style>

That's it! material-drawer takes care of the rest.

For further information see Chris Banes' answer on stackoverflow.com.

Dependency

material-drawer is available on Maven Central

Gradle dependency:

dependencies {
    compile 'com.heinrichreimersoftware.materialdrawer:library:1.2'
}

Get the latest dependency with "Gradle, please"

Changes

• Version 1.2:
  • Drawer items can now contain an ID
  • Image setters work with Bitmap too
• Version 1.1.1:
  • You can change items that you got via drawer.getItem(position). Changes will update the adapter
  • Fixed auto drawer width
  • Fixed title padding

Open source libraries

material-drawer uses the following open source libraries or files:

• LinearListView by @frankiesardo (Apache License 2.0)
• ScrimInsetsScrollView from the Google IO app 2014 by @google (Apache License 2.0)

License

Copyright 2013 Heinrich Reimer

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.