Home

MaterialNavigationDrawer wiki

this is a simple wiki that show you all library functionality

Drawer Type

It determines the type of the drawer.
At this time, this library implements these types:

• Accounts
• Image
• No Header
• Custom

Accounts

Like the mosts google like apps, it shows the account information.
This is the default drawer type, visit the Account section for other information.

Image

It shows a simple image in 16:9
To enable it, add this line to your custom Theme in your styles.xml:

<item name="drawerType">@integer/DRAWERTYPE_IMAGE</item>

Then you can set your image in your Activity using this code in your init() method:

this.setDrawerHeaderImage(this.getResources().getDrawable(YOUR_DRAWABLE));

No Header

Simple removes the header from the drawer.
To enable it, add this line to your custom Theme in your styles.xml:

<item name="drawerType">@integer/DRAWERTYPE_NO_HEADER</item>

Custom Header

replace the 16:9 header space in your drawer with a custom view.
To enable it, add this line to your custom Theme in your styles.xml:

<item name="drawerType">@integer/DRAWERTYPE_CUSTOM</item>

Then you can set your view in your Activity using this code in your init() method:

View view = LayoutInflater.from(this).inflate(R.layout.custom_drawer,null);
setDrawerHeaderCustom(view);

Sections

A section is a simple element of your navigation drawer list. There are two type of section at this time:

• Text Section
• Text and Icon Section

Every section could have a notifications number.

There are two different lists where you can add your section:

• Top list (default list)
• Bottom List
  It is a list used exclusively for About, Settings or other things like this.

NOTE If you add to the bottom list a section that doesn't mean that your section is pinned to the bottom.
See Material design guidelines > Settings and support for a complete explanation

Create Section methods

    // only text section, it opens an activity
    public MaterialSection newSection(String title,Intent target)
    
    // only text section, it opens a fragment
    public MaterialSection newSection(String title,Fragment target)

    // only text section, it calls target.onClick() method when section is clicked
    public MaterialSection newSection(String title,MaterialSectionListener target)
    
    // icon bitmap and text section, it opens an activity
    public MaterialSection newSection(String title, Bitmap icon,Intent target)
    
    // icon bitmap and text section, it opens a fragment
    public MaterialSection newSection(String title, Bitmap icon,Fragment target)

    // icon bitmap and text section, it calls target.onClick() method when section is clicked
    public MaterialSection newSection(String title, Bitmap icon,MaterialSectionListener target)

    // icon int resource and text section, it opens an activity
    public MaterialSection newSection(String title, int icon,Intent target)
    
    // icon int resource and text section, it opens a fragment
    public MaterialSection newSection(String title, int icon,Fragment target)

    // icon int resource and text section, it calls target.onClick() method when section is clicked
    public MaterialSection newSection(String title, int icon,MaterialSectionListener target)
    
    // icon drawable and text section, it opens an activity
    public MaterialSection newSection(String title, Drawable icon, Intent target)
    
    // icon drawable and text section, it opens a fragment
    public MaterialSection newSection(String title, Drawable icon, Fragment target)

    // icon drawable and text section, it calls target.onClick() method when section is clicked
    public MaterialSection newSection(String title, Drawable icon, MaterialSectionListener target)

Add Section Methods

// add section to the top list
public void addSection(MaterialSection section)

// add section to the bottom list
public void addBottomSection(MaterialSection section)

NOTE that the first section you added is opened when the activity starts, so it must have a Fragment as target.

Change Section Color

When a section that has a color is opened, the toolbar background color is setted to this value, and the status bar color is setted with the value of colorDark.
If a section with color is clicked the text color (into the drawer) is colored with his color. If the section has an icon, the icon have the color of the section.

mySection.setSectionColor(color,colorDark);

Set/get number notifications

int number = 4;
mySection.setNotifications(number);

int notifications = mySection.getNotifications();

Subheaders

Add subheader method

@Override
    public void init(Bundle savedInstanceState) {
        this.addSubheader("Subheader title");
    }

Separators

A separator (or divisor) is a simple grey line used for diversify group of sections.

Add separator method

@Override
    public void init(Bundle savedInstanceState) {
        this.addDivisor();
    }

Account

A collection of user data.
This library not implements an Android Account, it allows only to set user data in your navigation drawer.
NB At this time you can add accounts until a max number of 3 accounts.

Create Accounts methods

public MaterialAccount(String title, String subTitle, Drawable photo,Bitmap background)

public MaterialAccount(String title, String subTitle, Drawable photo,Drawable background)

public MaterialAccount(String title, String subTitle, Bitmap photo, Drawable background)

public MaterialAccount(String title, String subTitle, Bitmap photo, Bitmap background)

Add to your navigation drawer

MaterialAccount account;
this.addAccount(account);

Know when your account is clicked / when it change

implements MaterialAccountListener in your MaterialNavigationDrawer and then connect your listener to the navigation drawer

// set listener
this.setAccountListener(this);

Learning Pattern

When the Activity starts, the drawer will be open automatically for let the users to know that there is a navigation drawer. It seems like pretty obvious to us, but there are some users that must be taught to do that (unfortunatelly).

if you want to disable it, add this code to your init() method:

this.disableLearningPattern();

Back Pattern

There are a lot of methods for use the back button. Actually this library supports these patterns:

• Back Anywhere (default)
  (if user click on back button, the activity will close)
• Back to first
  (if user click on back button, the content change to the first section fragment)
• Custom backpattern
  (see below)

for setting the pattern add in your init this code:

setBackPattern(MaterialNavigationDrawer.BACKPATTERN_BACK_TO_FIRST);

BACKPATTERN_CUSTOM:

When you use this backpattern you should override this method in your MaterialNavigationDrawer Activity:

@Override
    protected MaterialSection backToSection(MaterialSection currentSection) {
        // example of use:
        if(currentSection == night) {
            return last;
        }

        if(currentSection == last) {
            return section1;
        }
        return super.backToSection(currentSection);
    }

if you have some pattern to suggest please comment on this issue, thanks.

Multipane

multi pane support makes the drawer always open on the left, but only with tablet in landscape mode.
for activate it, add this method to your init()

addMultiPaneSupport();

FAQ

How can I get my action bar / toolbar?

From your Activity:

// get toolbar
this.getToolbar();
// get Action Bar
this.getSupportActionBar();

From your Fragment:

// get toolbar
((MaterialNavigationDrawer)this.getActivity()).getToolbar();
// get action bar
this.getActivity().getSupportActionBar();

How can I get the current Section?

From your Activity:

this.getCurrentSection();

From your Fragment:

((MaterialNavigationDrawer)this.getActivity()).getCurrentSection();

How can I set user background/user photo asynchronously?

When your image is loaded from the web, in your async Thread change your account information like this:

// set photo
account.setPhoto(photo);
// set background
account.setBackground(background);

And then call the notifyAccountDataChanged method on ui thread:

runOnUiThread(new Runnable() {
        @Override
        public void run() {
            notifyAccountDataChanged();
        }
    });

How can I get the current Account?

From your Activity:

this.getCurrentAccount();

From your Fragment:

((MaterialNavigationDrawer)this.getActivity()).getCurrentAccount();

How can I get an account knowing his current position?

From your Activity:

int position;
this.getAccountAtCurrentPosition(position);

From your Fragment:

((MaterialNavigationDrawer)this.getActivity()).getAccountAtCurrentPosition(position);

How enable the toolbar arrow effect?

for default, it is disabled. If you want to re-enable it add this to your init() method:

allowArrowAnimation();

How can I takes the toolbar color when a section with color is clicked?

Well, if you want to follow exactly the material design guidelines you have not to do it. If you want to mock this functionality, on your extended Fragment class insert this code:

@Override
    public void onResume() {
        super.onResume();
        ((MaterialNavigationDrawer)this.getActivity()).changeToolbarColor(primaryColor,primaryColorDark);
    }

How enable the ripple support on lower devices?

Ripple support activate the ripple when a section is clicked/tapped. As default is enabled on Lollipop devices and on Kitkat devices if Theme use a TranslucentKitKatStatusBar Theme To enable it on all 14+ devices, add this line to your custom theme:

<item name="rippleBackport">true</item>

I want to set other value than numbers as notification

You could set a Text as your notification using:

section.setNotificationsText("MyValue");