12

I've been working in material design using the latest Toolbar Widget provided in AppCompact-V21, with the navigation drawer.

My concern is How can I set navigation drawer icon to right side of the toolbar. Although I can open navigation drawer from right by setting the android:layout_gravity="right" but navigation icon still appears to be on left side in toolbar.

When Using old Action Bar, I can crate custom action bar with button to right side with custom drawer icon and on click of custom navigation drawer icon open/close the drawer.

  1. What is way to set navigation drawer icon on right side using toolbar ?
  2. How to create custom view for it ?
SilentKiller
  • 6,944
  • 6
  • 40
  • 75
Dory
  • 7,462
  • 7
  • 33
  • 55
  • If you still want the hamburger-arrow icon with its animation, this solution shows a replacement for `ActionBarDrawerToggle` that will do that: http://stackoverflow.com/a/39136512. – Mike M. Nov 22 '16 at 11:44

3 Answers3

9

Well, to customize toolbar and setting your own navigation button, you can add your own imagebutton to the toolbar :

<android.support.v7.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/toolbar"
    android:minHeight="?attr/actionBarSize"
    android:layout_height="?attr/actionBarSize"
    android:layout_width="match_parent" >

    <ImageButton
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:layout_gravity="end"
       android:onClick="backButtonHandler"
       android:background="@drawable/ic_launcher" />

</android.support.v7.widget.Toolbar>

Then, you can define your backButtonHandler(View v) in your activity class, and add functionality as desired.

Adeel
  • 2,901
  • 7
  • 24
  • 34
Abhinav Puri
  • 4,254
  • 1
  • 16
  • 28
3

I want to move ActionBarDrawerToggle from left to right and I am using appcompat 21 support library. I haven't found a solution for this. It seems that we need to create a custom item in actionbar/toolbar as Abhinav Puri suggested.

You said you don't know how to add a custom view to your toolbar, hope this helps you or anybody who is fighting with this problem:

  toolbar = (Toolbar) findViewById(R.id.toolbar);

  if (toolbar != null) {
   setSupportActionBar(toolbar);
  }

  actionBar = getSupportActionBar();
  actionBar.setDisplayHomeAsUpEnabled(true);
  actionBar.setHomeButtonEnabled(true);
  actionBar.setDisplayShowHomeEnabled(true);
  actionBar.setDisplayShowCustomEnabled(true);

  ActionBar.LayoutParams layoutParams = new ActionBar.LayoutParams(
    LayoutParams.WRAP_CONTENT, LayoutParams.MATCH_PARENT);
  layoutParams.gravity = Gravity.RIGHT;
  actionBar.setCustomView(
    getLayoutInflater().inflate(R.layout.custom_top_bar, null),
    layoutParams);
  
  ImageButton rightToggle =(ImageButton) toolbar.findViewById(R.id.rightToggle);
  
  rightToggle.setOnClickListener(new OnClickListener() {
   
   @Override
   public void onClick(View v) {
    if (mDrawerLayout.isDrawerOpen(Gravity.RIGHT)) {
     mDrawerLayout.closeDrawer(Gravity.RIGHT);
    } else {
     mDrawerLayout.openDrawer(Gravity.RIGHT);
    }
   }
  });

custom_top_bar.xml:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/rightLayout"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:orientation="horizontal" >

    <ImageButton
        android:id="@+id/rightToggle"
        android:layout_width="?attr/actionBarSize"
        android:layout_height="?attr/actionBarSize"
        android:src="@drawable/ic_launcher" />

</LinearLayout>
Kinga l
  • 71
  • 8
2

You can do that very easily if you know how it works. Most android drawers use the application's home button as a drawer button, this button's gravity cannot be changed, All you have to do is to assign to the drawer button another button that you create yourself in the action bar (menu button), you give it an icon and an action in the onOptionsItemSelected.

if (item.getItemId() == android.R.id.home) {
    if(mDrawerLayout.isDrawerOpen(mLinearLayout)) {
        mDrawerLayout.closeDrawer(mmLinearLayout);
    }
    else {
    // open the drawer
    }
}

you will have approximately the same code as this, change the android.R.id.home by the button's Id I've talked about above.

MysticMagicϡ
  • 28,593
  • 16
  • 73
  • 124
B.Moataz
  • 97
  • 4