English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

Introduction to the Use of DrawerLayout in Android

in android support.v4 There is a drawer view control called DrawerLayout. Using this control, you can generate a menu that can be opened or closed by horizontal swiping on the screen, providing a good user experience.

DrawerLayout is divided into two parts: the side menu and the main content area. The side menu can be expanded or hidden according to gestures, and the main content area can change with the menu clicks. In fact, DrawerLayout is a control component, similar to LinearLayout, and can be used directly.

DrawerLayout properties

1、drawerPosition: Specifies that the drawer will slide from one side of the screen.

2、drawerWidth: Specifies the width of the drawer, i.e., the precise width from the edge of the window to the view.

3、keyboardDismissMode: Determines whether the keyboard responds to the rejection of dragging.

  • 'none' (default), dragging does not affect the keyboard.
  • on-dragging started, the keyboard is rejected.

4、onDrawerClose: The function is called when the navigation view is closed.

5、onDrawerOpen: The function is called when the navigation view is opened.

6、onDrawerSlide: The function is called when interacting with the navigation view.

7、onDrawerStateChanged: The function is called when the Drawer state changes, drawer has 3 types: 

  •  idle -- indicating there is no interaction with the navigation view
  •  dragging -- indicating there is currently interaction with the navigation view
  •  settling -- indicating there is interaction with the navigation view and the navigation view is currently closing or opening.

8、renderNavigationView: The navigation view will be rendered on one side of the screen and can be pulled out.

example

using import dependency library

compile 'com.android.support:appcompat-v7:24.2.1' 

layout file

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:id="@"+id/v4_drawerlayout"
  android:layout_width="match_parent"
  android:layout_height="match_parent">
  <FrameLayout
    android:id="@"+id/v4_drawerlayout_frame"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >
    <TextView
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:id="@"+id/v4_text"
      android:textSize="22sp"
      android:textColor="@color/colorAccent"
      android:gravity="center"
      />
  </FrameLayout>
  <ListView
    android:layout_width="200dp"
    android:layout_height="match_parent"
    android:layout_gravity="left"
    android:id="@"+id/v4_listview"
    android:choiceMode="singleChoice"
    android:background="@android:color/white" />
</android.support.v4.widget.DrawerLayout> 

Activity

public class DrawerActivity extends AppCompatActivity {
  private ListView listView;
  private DrawerLayout drawerLayout;
  private TextView textView;
  @Override
  protected void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.drawer_activity);
    initView();
  }
  private void initView()
  {
    listView=(ListView) findViewById(R.id.v4_listview);
    drawerLayout=(DrawerLayout) findViewById(R.id.v4_drawerlayout);
    textView=(TextView) findViewById(R.id.v4_text);
    initDate();
  }
  private void initDate(){
    final List<String> list = new ArrayList<String>();
    list.add("NetEase");
    list.add("Tencent");
    list.add("Sina");
    list.add("Sohu");
    ArrayAdapter<String> adapter = new ArrayAdapter<>(this, android.R.layout.simple_list_item_1, list);
    listView.setAdapter(adapter);
    listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
      @Override
      public void onItemClick(AdapterView<63;> parent, View view, int position, long id) {
        textView.setText(list.get(position));
        showDrawerLayout();
      }
    });
    drawerLayout.openDrawer(Gravity.LEFT);//Slide open, if not set, it will not open by default
  }
  private void showDrawerLayout() {
    if (!drawerLayout.isDrawerOpen(Gravity.LEFT)) {
      drawerLayout.openDrawer(Gravity.LEFT);
    }
      drawerLayout.closeDrawer(Gravity.LEFT);
    }
  }
} 

The running effect is shown in the figure:

Download link:Drawerlayout_jb51.rar

That's all for this article. I hope it will be helpful to everyone's learning and also hope everyone will support the Yelling Tutorial.

Statement: The content of this article is from the Internet, and the copyright is owned by the original author. The content is contributed and uploaded by Internet users spontaneously, and this website does not own the copyright, does not undergo manual editing, and does not bear relevant legal liability. If you find any content suspected of copyright infringement, please send an email to: notice#w3Please report by email to codebox.com (replace # with @ when sending email) and provide relevant evidence. Once verified, this site will immediately delete the content suspected of infringement.

You May Also Like