2013-07-25 19 views
56

Tôi có một ứng dụng, trong đó tôi muốn thực hiện một ngăn kéo đôi - một từ bên trái và một từ bên phải. Ngăn kéo bên trái dành cho điều hướng ứng dụng, ngăn phải là để lọc kết quả.DrawerLayout đôi Drawer (ngăn kéo trái và phải đồng thời)

Vì vậy, cách bố trí là như thế này:

<?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> 

Bạn có thể thấy rõ ở đây "left_drawer" và "right_drawer", và lực hấp dẫn của mình - "bắt đầu" và "kết thúc" Và điều này thực sự hoạt động! Bạn có thể kéo cả hai ra ngoài.

Vấn đề là, khi tôi triển khai DrawerToggle - nó chỉ mở ngăn kéo bên trái và không đóng ngăn bên phải, vì vậy nếu ngăn phải được mở và tôi nhấn nút DrawerToggle - ngăn kéo bên trái mở C ALNG, và chồng chéo ngăn kéo bên phải.

Có một vài giải pháp i'am cố gắng để có được:

  1. Làm cho nút cùng DrawerToggle ở ​​phía bên phải, với hành vi tương tự và hình ảnh động như phía bên trái.
  2. Làm ngăn kéo ở phía đối diện của ngăn kéo mà tôi đang cố gắng mở - tự động đóng (nếu ngăn kéo bên trái mở và tôi nhấn nút bật/tắt ngăn kéo bên phải và vise-versa).

Và tôi đã không tìm cách để làm điều đó, bởi vì DrawerToggle chấp nhận DrawerLayout chính nó như là một tham số, và không phải là ngăn kéo cá nhân ...

Tôi đang sử dụng thư viện hỗ trợ.

Bất kỳ ai có ý tưởng nào? Cảm ơn bạn trước.

Trả lời

21

Bạn có thể gọi nó như thế này trong xử lý của một ToggleButton ví dụ:

mDrawerLayout.openDrawer(mDrawer); 
mDrawerLayout.closeDrawer(mDrawer); 

đâu mDrawer là một tài liệu tham khảo để ngăn cụ thể mà bạn cần để mở (có thể là một cái nhìn hay một bố cục), trong trường hợp của bạn , ListView thực tế bạn muốn hiển thị.

0

tôi đã giải quyết thêm mã này trong phương pháp onOptionsItemSelected:

switch (item.getItemId()) { 
    case android.R.id.home: 
     if (mDrawerLayout.isDrawerOpen(mDrawerList_right)){ 
      mDrawerLayout.closeDrawer(mDrawerList_right); 
     } 
     mDrawerLayout.openDrawer(mDrawerList_left); 
    } 
    break; 
case R.id.action_drawer: 
     if (mDrawerLayout.isDrawerOpen(mDrawerList_left)){ 
      mDrawerLayout.closeDrawer(mDrawerList_left); 
     } 
     mDrawerLayout.openDrawer(mDrawerList_right); 
    } 
default: 
    break; 
} 

Tôi đã thêm một nút hành động và overrided các nút home của actionbar

34

Đây là mã cho một Hoạt động đúp Drawer hơn có thể được mở rộng bởi các hoạt động khác để thực hiện ngăn kéo đôi, giả sử chúng có bố trí giống như bố cục được OP phân phối.

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); 
    } 
} 
+0

Quên để nói rằng điều này làm cho việc sử dụng hỗ trợ v7 appcompat lib http://developer.android.com/tools/support-library/features.html –

+6

Cũng , nếu bạn muốn glyphe chỉ di chuyển cho ngăn kéo bên trái, bạn có thể làm điều đó trong phương thức onDrawerSlide: \t \t \t \t \t if (drawerView == leftDrawer) super.onDrawerSlide (drawerView, slideOffset); –

+1

@ DanielLópezLacalle Cảm ơn câu trả lời của bạn .. tôi đã theo dõi mã của bạn và nó không cung cấp bất kỳ lỗi nào, nhưng ngay cả sau đó nó dosent cho thấy bất cứ điều gì ở phía bên phải của thanh hành động của tôi .. không có gì cả. – Abstract

6

Đây là giải pháp ngắn cho tất cả những ai muốn ngăn chặn hoạt ảnh của chỉ báo ngăn kéo nếu họ vuốt sang bên phải. Chỉ cần triển khai onDrawerSlide Phương pháp như thế này.

mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, R.drawable.ic_drawer_white, 0, 0) { 

    @Override 
    public void onDrawerClosed(View view) { 
     invalidateOptionsMenu(); // creates call to onPrepareOptionsMenu() 
    } 

    @Override 
    public void onDrawerOpened(View drawerView) { 
     invalidateOptionsMenu(); // creates call to onPrepareOptionsMenu() 
    } 

    @Override 
    public void onDrawerSlide(View drawerView, float slideOffset) { 
     if (drawerView == mSlidingMenuNavigationList) { 
      super.onDrawerSlide(drawerView, slideOffset); 
     } 
     else { 
      // do nothing on all other views 
     } 
    } 
}; 
+1

Sử dụng cách tiếp cận đó, hoạt ảnh dừng lại nhưng biểu tượng (biểu tượng) bây giờ nhảy đến vị trí mà nó thường trượt đến. bạn làm gì để ngăn chặn việc di chuyển cùng nhau? –

5

Sử dụng lực hấp dẫn không đổi (Gravity.LEFT hoặc Gravity.RIGHT) của bất cứ điều gì ngăn bạn muốn đóng (khi bạn mở một trong những khác) trong onOptionsItemSelected() như hình dưới đây.

public boolean onOptionsItemSelected(MenuItem item) { 
    if (mDrawerToggle.onOptionsItemSelected(item)) { 

     // Close the right side drawer if visible 
     if(mDrawerLayout.isDrawerVisible(Gravity.RIGHT)) { 
      mDrawerLayout.closeDrawer(Gravity.RIGHT); 
     } 
     return true; 
    } 

    // Regular stuff 
    switch (item.getItemId()) { 
    case R.id.action_example: 
     Toast.makeText(getActivity(), "Example action.", Toast.LENGTH_SHORT).show(); 
     return true; 
    } 

    return super.onOptionsItemSelected(item); 
} 

mDrawerToggle = Listener đối tượng thực hiện DrawerLayout.DrawerListener
Xem: http://developer.android.com/reference/android/support/v4/app/ActionBarDrawerToggle.html

0

làm cho một mục tùy chỉnh và thêm nó phải, vượt qua nó ngăn kéo ngay.

final ToggleButton ic_nav = (ToggleButton) customNav.findViewById(R.id.ic_nav); 

     ic_nav.setOnClickListener(new View.OnClickListener() 
     { 
      @Override 
      public void onClick(View arg0) 
      { 
       if (mDrawerLayout.isDrawerOpen(mDrawerList) && arg0.isSelected()) { 
        mDrawerLayout.closeDrawer(mDrawerList); 
        arg0.setSelected(false); 
       } 
       else if (!mDrawerLayout.isDrawerOpen(mDrawerList) && !arg0.isSelected()){ 
        mDrawerLayout.openDrawer(mDrawerList); 
        ic_nav.setSelected(false); 
        arg0.setSelected(true); 
       } 
      } 
     }); 
7

Bạn có thể sử dụng NavigationView từ thiết kế material design.

<?xml version="1.0" encoding="utf-8"?> 
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:id="@+id/drawer_layout" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:fitsSystemWindows="true" 
    tools:openDrawer="start"> 

    <include 
     layout="@layout/app_bar_main" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" /> 

    <android.support.design.widget.NavigationView 
     android:id="@+id/nav_view" 
     android:layout_width="wrap_content" 
     android:layout_height="match_parent" 
     android:layout_gravity="start" 
     android:fitsSystemWindows="true" 
     app:headerLayout="@layout/nav_header_main" 
     app:menu="@menu/activity_main_drawer" /> 

    <android.support.design.widget.NavigationView 
     android:id="@+id/nav_view2" 
     android:layout_width="wrap_content" 
     android:layout_height="match_parent" 
     android:layout_gravity="end" 
     android:fitsSystemWindows="true" 
     app:headerLayout="@layout/nav_header_main" 
     app:menu="@menu/activity_main_drawer1" /> 

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

để biết thêm thông tin vui lòng tham khảo http://v4all123.blogspot.in/2016/03/simple-example-of-navigation-view-on.html

Các vấn đề liên quan