DrawerLayout使用详解

简介: DrawerLayout使用详解

效果:

https://ucc.alicdn.com/images/user-upload-01/20190611174135693.gif

布局

<android.support.v4.widget.DrawerLayout
        android:id="@+id/drawer_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <!-- 内容区 -->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:orientation="vertical">
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:padding="20dp"
                android:text="内容区"
                android:textSize="20sp"/>
            <Button
                android:id="@+id/btn_open_left"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="打开左边"/>
            <Button
                android:id="@+id/btn_open_right"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="打开右边"/>
        </LinearLayout>
        <!-- 左边菜单 -->
        <android.support.design.widget.NavigationView
            android:id="@+id/navigation_view"
            android:layout_width="260dp"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            app:headerLayout="@layout/drawer_header"
            app:menu="@menu/menu_drawer_left"/>
        <!-- 右边菜单 -->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="end"
            android:background="@color/black"
            android:gravity="center"
            android:orientation="vertical">
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:padding="20dp"
                android:text="右边菜单"
                android:textColor="@color/white"
                android:textSize="20sp"
                android:textStyle="bold"/>
            <Button
                android:id="@+id/btn_close_right"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="关闭"/>
        </LinearLayout>
    </android.support.v4.widget.DrawerLayout>
  • 外层是DrawerLayout,第一个子view是内容区,侧滑内容紧跟其后。
  • 侧滑内容可以有好几个
  • android:layout_gravity="end" 标识从左边还是右边滑出

以上就可以简单的实现抽屉布局了。


关联Toolbar

比如上图中的toolbar左边有三道杠,点击即可弹出DrawerLayout


   

//mDrawerLayout与mToolbar关联起来
        ActionBarDrawerToggle actionBarDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, mToolbar, R.string.open, R.string.close);
        //初始化状态
        actionBarDrawerToggle.syncState();

手动打开关闭

手动打开关闭DrawerLayout

  • 打开左边
mDrawerLayout.openDrawer(Gravity.START);
  • 打开右边
mDrawerLayout.openDrawer(Gravity.END);
  • 关闭一边
mDrawerLayout.closeDrawer(Gravity.START);
  • 关闭所有
mDrawerLayout.closeDrawers();

Gravity.START指定打开哪一个,关闭同理。


监听

       //监听
        mDrawerLayout.addDrawerListener(new DrawerLayout.DrawerListener() {
            @Override
            public void onDrawerSlide(@NonNull View view, float v) {
                Log.i("---", "滑动中");
            }
            @Override
            public void onDrawerOpened(@NonNull View view) {
                Log.i("---", "打开");
            }
            @Override
            public void onDrawerClosed(@NonNull View view) {
                Log.i("---", "关闭");
            }
            @Override
            public void onDrawerStateChanged(int i) {
                Log.i("---", "状态改变");
            }
        });

githubhttps://github.com/yechaoa/MaterialDesign


文档:https://developer.android.google.cn/reference/android/support/v4/widget/DrawerLayout

目录
相关文章
|
2月前
|
Android开发
Android自带的DrawerLayout和ActionBarDrawerToggle实现侧滑效果
Android自带的DrawerLayout和ActionBarDrawerToggle实现侧滑效果
19 0
|
2月前
|
Android开发
[Android]DrawerLayout滑动菜单+NavigationView
[Android]DrawerLayout滑动菜单+NavigationView
41 0
|
XML 数据格式
DrawerLayout侧滑菜单、Toolbar和沉浸式状态栏的使用
DrawerLayout侧滑菜单、Toolbar和沉浸式状态栏的使用
|
XML API Android开发
TabLayout-Android M新控件
TabLayout-Android M新控件
56 0
RecyclerView与CardView的使用(二)
RecyclerView与CardView的使用(二)
107 0
RecyclerView与CardView的使用(二)
|
开发工具 Android开发
RecyclerView与CardView的使用(一)
RecyclerView与CardView的使用(一)
137 0
RecyclerView与CardView的使用(一)
|
Android开发 Java API
抽屉效果的实现(DrawerLayout和SlidingMenu的对比)
        在做谷歌电子市场的时候用的是DrawerLayout实现的抽屉效果,在新闻客户端的时候用的是开源框架SlidingMenu来实现的,总的来说,各有个的优点,侧滑(开源框架)实现的效果更好,但是DrawerLayout直接写布局文件就好了,不过我还是比较喜欢用开源框架的这个。下面分别来说说如何实现: 1、SlidingMenu  首先要引入SlidingMenu的库文件的
1244 0
|
Android开发 数据格式 XML