Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

DrawerLayout Double Drawer (Left and Right Drawers simultaneously)

I have an application, in which i want to implement a double drawer - one from the left and one from the right. Left drawer is for app navigation, right drawer is for result filtering.

So, the layout is like this:

<?xml version="1.0" encoding="utf-8"?> <android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"     android:id="@+id/drawer_layout"     android:layout_width="match_parent"     android:layout_height="match_parent">      <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"         android:layout_width="match_parent"         android:layout_height="match_parent"         android:background="@color/light_grey"         android:orientation="vertical">          <GridView             android:id="@+id/gridview"             style="@style/GridViewStyle"             android:layout_width="fill_parent"             android:layout_height="fill_parent"             android:gravity="center"             android:horizontalSpacing="7dp"             android:stretchMode="columnWidth"             android:verticalSpacing="7dp" />     </LinearLayout>      <ListView         android:id="@+id/left_drawer"         android:layout_width="240dp"         android:layout_height="match_parent"         android:layout_gravity="start"         android:background="#111"         android:choiceMode="singleChoice"         android:divider="@android:color/transparent"         android:dividerHeight="0dp" />      <ListView         android:id="@+id/right_drawer"         android:layout_width="240dp"         android:layout_height="match_parent"         android:layout_gravity="end"         android:background="#111"         android:choiceMode="singleChoice"         android:divider="@android:color/transparent"         android:dividerHeight="0dp" /> </android.support.v4.widget.DrawerLayout> 

You can clearly see here "left_drawer" and "right_drawer", and their respective gravity - "start" and "end" And this actually works! You can pull them both out.

The problem is, when i implement the DrawerToggle - it only opens the left drawer, and does not close the right one, so if the right drawer is opened and i press the DrawerToggle button - the left drawers opens ALSO, and overlaps the right drawer.

There are a couple of solutions i'am trying to get:

  1. Make the same DrawerToggle button on the right side, with the same behavior and animation as the left side.
  2. Make the drawer on the opposite side of the drawer i am trying to open - automatically close (if the left drawer is open and i press the toggle of the right drawer and vise-versa).

And i haven't figured how to do that, because DrawerToggle accepts the DrawerLayout itself as a parameter, and not the individual drawers...

I am using the Support Library.

Anyone have any ideas? Thank you in advance.

like image 479
ExiRouS Avatar asked Jul 25 '13 15:07

ExiRouS


People also ask

How do you change the DrawerLayout icon on the right side of the device screen?

Edit. According to Creating a Navigation Drawer, The drawer view (the ListView) must specify its horizontal gravity with the android:layout_gravity attribute. To support right-to-left (RTL) languages, specify the value with "start" instead of "left" (so the drawer appears on the right when the layout is RTL).


1 Answers

Here is the code for a Double Drawer Activity than can be extended by other activities to implement the double drawer, assuming they have a layout like the one propposed by OP.

    public class DoubleDrawerActivity extends ActionBarActivity {      private DrawerLayout mDrawerLayout;     private ActionBarDrawerToggle mDrawerToggle;     private View mLeftDrawerView;     private View mRightDrawerView;      @Override     protected void onCreate(Bundle savedInstanceState) {         super.onCreate(savedInstanceState);          getSupportActionBar().setDisplayHomeAsUpEnabled(true);         getSupportActionBar().setHomeButtonEnabled(true);     }      @Override     protected void onStart() {         super.onStart();          if(mDrawerLayout == null || mLeftDrawerView == null || mRightDrawerView == null || mDrawerToggle == null) {             // Configure navigation drawer             mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);             mLeftDrawerView = findViewById(R.id.left_drawer);             mRightDrawerView = findViewById(R.id.right_drawer);             mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, R.drawable.ic_navigation_drawer, R.string.drawer_open, R.string.drawer_close) {                  /** Called when a drawer has settled in a completely closed state. */                 public void onDrawerClosed(View drawerView) {                     if(drawerView.equals(mLeftDrawerView)) {                         getSupportActionBar().setTitle(getTitle());                         supportInvalidateOptionsMenu(); // creates call to onPrepareOptionsMenu()                         mDrawerToggle.syncState();                     }                 }                  /** Called when a drawer has settled in a completely open state. */                 public void onDrawerOpened(View drawerView) {                     if(drawerView.equals(mLeftDrawerView)) {                         getSupportActionBar().setTitle(getString(R.string.app_name));                         supportInvalidateOptionsMenu(); // creates call to onPrepareOptionsMenu()                         mDrawerToggle.syncState();                     }                                    }                  @Override                 public void onDrawerSlide(View drawerView, float slideOffset) {                     // Avoid normal indicator glyph behaviour. This is to avoid glyph movement when opening the right drawer                     //super.onDrawerSlide(drawerView, slideOffset);                 }             };              mDrawerLayout.setDrawerListener(mDrawerToggle); // Set the drawer toggle as the DrawerListener         }     }      @Override     protected void onPostCreate(Bundle savedInstanceState) {         super.onPostCreate(savedInstanceState);          // Sync the toggle state after onRestoreInstanceState has occurred.         mDrawerToggle.syncState();     }      @Override     public void onConfigurationChanged(Configuration newConfig) {         super.onConfigurationChanged(newConfig);          mDrawerToggle.onConfigurationChanged(newConfig);     }      @Override     public boolean onPrepareOptionsMenu(Menu menu) {          // If the nav drawer is open, hide action items related to the content view         for(int i = 0; i< menu.size(); i++)             menu.getItem(i).setVisible(!mDrawerLayout.isDrawerOpen(mLeftDrawerView));          return super.onPrepareOptionsMenu(menu);     }      @Override     public boolean onOptionsItemSelected(MenuItem item) {          switch(item.getItemId()) {             case android.R.id.home:                 mDrawerToggle.onOptionsItemSelected(item);                  if(mDrawerLayout.isDrawerOpen(mRightDrawerView))                     mDrawerLayout.closeDrawer(mRightDrawerView);                  return true;         }          return super.onOptionsItemSelected(item);     } } 
like image 128
Daniel López Lacalle Avatar answered Sep 24 '22 17:09

Daniel López Lacalle