简单的通过DrawerLayout + NavigationView 实现侧滑效果。
这里的实现实际上有两个问题存在:
1. 只能拖拽边缘才能拖拽出菜单,这个暂时没有解决。
2. 点击菜单item会使主界面回来如下图,这里问题可以通过不使用Menu解决,这里没有提供。
以下,代码:
MainActivity
package com.example.qxb_810.qqdemohuadong;
import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.design.widget.NavigationView;
import android.support.v4.widget.DrawerLayout;
import android.support.v4.widget.NestedScrollView;
import android.support.v7.app.AppCompatActivity;
import android.view.Display;
import android.view.DragEvent;
import android.view.Gravity;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.WindowManager;
import android.widget.LinearLayout;
import android.widget.TextView;
import butterknife.BindView;
import butterknife.ButterKnife;
public class MainActivity extends AppCompatActivity {
@BindView(R.id.ll_main)
LinearLayout llMain;
@BindView(R.id.nv_menu)
NavigationView nv_menu;
@BindView(R.id.dl_content)
DrawerLayout dlContent;
@BindView(R.id.tv_main)
TextView tvMain;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ButterKnife.bind(this);
initView();
initEvent();
}
private void initView() {
// 动态添加按钮
Menu menu = nv_menu.getMenu();
menu.add(Menu.NONE, Menu.FIRST + 3, 1, "动态添加").setIcon(R.drawable.ic_launcher_background);
}
private void initEvent() {
tvMain.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if (dlContent.isDrawerOpen(Gravity.LEFT)) {
dlContent.closeDrawer(Gravity.LEFT);
} else {
dlContent.openDrawer(Gravity.LEFT);
}
}
});
// 监听滑动的方法,通过此方法时侧边栏滑动出来时主页面跟着滑动而不是覆盖 -- 点击Menu item时会失效
dlContent.addDrawerListener(new DrawerLayout.DrawerListener() {
@Override
public void onDrawerSlide(@NonNull View drawerView, float slideOffset) {
// 获取屏幕宽高
WindowManager windowManager = (WindowManager) getSystemService(WINDOW_SERVICE);
Display display = windowManager.getDefaultDisplay(); //设置右面的布局位置 根据左面菜单的right作为右面布局的left 左面的right+屏幕的宽度(或者right的宽度这里是相等的)为右面布局的right
DisplayMetrics metrics = new DisplayMetrics();
display.getMetrics(metrics);
llMain.layout(nv_menu.getRight(), 0, nv_menu.getRight() + metrics.widthPixels, metrics.heightPixels);
}
@Override
public void onDrawerOpened(@NonNull View drawerView) {
}
@Override
public void onDrawerClosed(@NonNull View drawerView) {
}
@Override
public void onDrawerStateChanged(int newState) {
}
});
}
}
MainActivity对应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"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.widget.DrawerLayout
android:id="@+id/dl_content"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="@+id/ll_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/main"
android:gravity="center"
>
<TextView
android:id="@+id/tv_main"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="主界面"
android:textSize="50dp" />
</LinearLayout>
<!--layout_gravity 决定侧滑方向,左侧滑或者右侧滑-->
<android.support.design.widget.NavigationView
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_gravity="left"
android:id="@+id/nv_menu"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:headerLayout="@layout/menu_head"
app:menu="@menu/menu_content">
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
</LinearLayout>
Menu_Content布局
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<!--
orderInCategory 排列序号数值越大,级别越低
icon 图标
title 文字内容
showAsAction 展示方式
-->
<item android:id="@+id/menu_one"
android:orderInCategory="1"
android:icon="@color/colorAccent"
android:title="one"
app:showAsAction="always"></item>
<item android:id="@+id/menu_two"
android:orderInCategory="2"
android:icon="@color/main"
android:title="two"
app:showAsAction="always"></item>
</menu>
菜单头布局太简单,就一个TextView就不给出。