【DrawerLayout+NavigationView】android侧滑菜单实现

首先话不多说上个图：

实现的效果如上图。

主布局activity_main.xml:

<?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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:openDrawer="start"
    android:id="@+id/drawer_layout_activity_main"
    >

    <include layout="@layout/app_bar_main"
        />

    <android.support.design.widget.NavigationView
        android:id="@+id/drawer_navigation"
        android:layout_width="300dp"
        android:layout_height="match_parent"
        android:layout_gravity="left"
        android:background="#BBBBBB"
        app:headerLayout="@layout/navigation_header"
        app:menu="@menu/drawer_menu"
        />

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

主布局include的布局：app_bar_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar_activity_main"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:titleTextColor="#000000"
        app:title="我的练习"
        app:navigationIcon="@drawable/ic_context_menu_free"
        />

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="#000000"
        />

    <include layout="@layout/content_activity_main" />

</LinearLayout>

NavigationView的头布局：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >

    <ImageView android:id="@+id/img_close_slidemenu"
        android:layout_width="30dp"
        android:layout_height="30dp"
        android:src="@drawable/icon_left_arrow"
        android:layout_margin="5dp"
        android:clickable="true"
        />

    <ImageView android:id="@+id/img_user_headpic"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_below="@id/img_close_slidemenu"
        android:src="@drawable/all_apps" />

    <TextView android:id="@+id/tv_user_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="啊木木"
        android:layout_below="@id/img_user_headpic"
        android:layout_marginTop="5dp"
        android:layout_centerHorizontal="true"
        />

    <ImageView android:id="@+id/iv_down_arrow"
        android:layout_width="20dp"
        android:layout_height="20dp"
        android:src="@drawable/icon_down_arrow2"
        android:layout_toRightOf="@id/tv_user_name"
        android:layout_below="@id/img_user_headpic"
        android:layout_marginLeft="5dp"
        android:layout_marginTop="5dp"
        android:clickable="true"
        />

    <TextView android:id="@+id/tv_child_term"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="三年级 下学期"
        android:layout_below="@id/tv_user_name"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="10dp"
        />

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="#A5A5A5"
        android:layout_below="@id/tv_child_term"
        android:layout_marginTop="5dp"
        />

</RelativeLayout>

 

以及drawer_menu.xml

 

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <group android:id="@+id/drawer_menu_g1">
    <item
        android:id="@+id/myExercises"
        android:title="我的练习"
        android:icon="@drawable/exercise_record_icon"
        />
    <item
        android:id="@+id/myCollection"
        android:title="我的收藏"
        android:icon="@drawable/collect_item_icon"
        />
    <item
        android:id="@+id/myWrongTopic"
        android:title="我的错题"
        android:icon="@drawable/exam_answer_wrong"
        />
    <item
        android:id="@+id/exercisesRecord"
        android:title="练习记录"
        android:icon="@drawable/exercise_record_icon"
        />
    </group>

    <group android:id="@+id/drawer_menu_g2">
    <item
        android:id="@+id/LogOut"
        android:title="退出登陆"
        android:icon="@drawable/login_log_icon"
        />
    </group>
</menu>

app_bar_main include的布局：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="我是主界面"
        android:textSize="30sp"
        android:layout_gravity="center"
        />
</LinearLayout>

最后上MainActivity的代码：

/**
 * @ClassName: MainActivity
 * @Desciption: 登陆后进入的主界面
 * @author: zhangshihao
 * @date: 2018-3-21
 */

public class MainActivity extends BaseActivity{

    private DrawerLayout drawerLayout ;
    private Toolbar toolbar;
    private NavigationView navigationView;
    private View navigationHeaderView;
    private ImageView ivCloseSlideMenu;
    private ImageView ivDownArrow;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
        handleEvent();
    }

    private void initView(){
        toolbar = (Toolbar) findViewById(R.id.toolbar_activity_main);
        drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout_activity_main);
        navigationView = (NavigationView) findViewById(R.id.drawer_navigation);
        navigationHeaderView = navigationView.getHeaderView(0);
        ivCloseSlideMenu = navigationHeaderView.findViewById(R.id.img_close_slidemenu);
        ivDownArrow = navigationHeaderView.findViewById(R.id.iv_down_arrow);
        setSupportActionBar(toolbar);
        ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
                this, drawerLayout, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
        drawerLayout.setDrawerListener(toggle);

    }

    private void handleEvent(){
        //侧滑菜单item点击事件处理：
        navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                switch(item.getItemId()){
                    case R.id.myExercises://我的练习
                        showToast("我的练习");
                        break;
                    case R.id.myCollection://我的收藏
                        showToast("我的收藏");
                        break;
                    case R.id.myWrongTopic://我的错题
                        showToast("我的错题");
                        break;
                    case R.id.exercisesRecord://练习记录
                        showToast("练习记录");
                        break;
                    case R.id.LogOut://退出登陆
                        showToast("退出登陆");
                        break;
                }
                return false;
            }
        });

        ivCloseSlideMenu.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                drawerLayout.closeDrawers();
            }
        });

        ivDownArrow.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                showToast("下箭头点击");
            }
        });

    }

如果有疑问请在帖子底下留言，楼主很尽快回复的！

欢迎参观楼主的其他博客！

 

博主上传资源下载链接：

自制免费无广告小说阅读APP下载：

https://download.csdn.net/download/yonghuming_jesse/10390364

全屏播放视频不拉伸源码：

https://download.csdn.net/download/yonghuming_jesse/10646274

科大讯飞语音评测服务接入源码：

https://download.csdn.net/download/yonghuming_jesse/10616924

android饺子播放器使用源码：

https://download.csdn.net/download/yonghuming_jesse/10619119

视频播放前显示视频第一帧源码：

https://download.csdn.net/download/yonghuming_jesse/10646332