引言
在Android开发中的侧边滑出菜单栏。DrawerLayout+NavigationView实现侧边滑出菜单，一篇就够了！
效果预览
滑出菜单.gif
用法
第一步：布局文件
（1）主布局：activity_case13.xml
<androidx.constraintlayout.widget.ConstraintLayout
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:context=".show.Case13"
tools:ignore="MissingConstraints">
<TextView
android:layout_width="match_parent"
android:layout_height="60dp"
android:background="@color/green"
android:gravity="center"
android:text="滑出菜单"
android:textColor="@color/white"
android:textSize="20sp" />
<androidx.drawerlayout.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="match_parent"
android:layout_height="60dp"
android:background="@color/green"
android:gravity="center"
android:text="滑出菜单"
android:textColor="@color/white"
android:textSize="20sp" />
<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>
<!-- 左边菜单 -->
<com.google.android.material.navigation.NavigationView
android:id="@+id/navigation_view"
android:layout_width="260dp"
android:layout_height="match_parent"
app:itemIconTint="@color/green"
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>
</androidx.drawerlayout.widget.DrawerLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
（2）layout下新建：滑出菜单顶部布局draw_header.xml
<?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="200dp"
android:orientation="vertical">
<ImageView
android:id="@+id/iv"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="@drawable/meizi" />
</LinearLayout>
（3）新建res下的menu文件夹，并新建menu_drawer_left.xml
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/favorite"
android:icon="@drawable/icon"
android:title="我的积分" />
<item
android:id="@+id/wallet"
android:icon="@drawable/icon"
android:title="我的分享" />
<item
android:id="@+id/photo"
android:icon="@drawable/icon"
android:title="我的收藏" />
<item
android:id="@+id/file"
android:icon="@drawable/icon"
android:title="TODO" />
<item
android:id="@+id/setting"
android:icon="@drawable/icon"
android:title="系统设置" />
<item
android:id="@+id/about"
android:icon="@drawable/icon"
android:title="关于我们" />
<item
android:id="@+id/esc"
android:icon="@drawable/icon"
android:title="退出登录" />
</menu>
第二步：activity处理点击事件
public class Case13 extends AppCompatActivity {
@SuppressLint("WrongConstant")
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_case13);
//初始化
DrawerLayout drawerLayout = findViewById(R.id.drawer_layout);
Button btnOpenLeft = findViewById(R.id.btn_open_left);
Button btnOpenRight = findViewById(R.id.btn_open_right);
Button btnCloseRight = findViewById(R.id.btn_close_right);
//点击事件处理
btnOpenLeft.setOnClickListener((View)->{
drawerLayout.openDrawer(Gravity.START);
});
btnOpenRight.setOnClickListener((View)->{
drawerLayout.openDrawer(Gravity.END);
});
btnCloseRight.setOnClickListener((View)->{
drawerLayout.closeDrawer(Gravity.END);
});
//监听事件
drawerLayout.addDrawerListener(new DrawerLayout.DrawerListener() {
@Override
public void onDrawerSlide(@NonNull View drawerView, float slideOffset) {
Log.i("---", "滑动中");
}
@Override
public void onDrawerOpened(@NonNull View drawerView) {
Log.i("---", "打开");
}
@Override
public void onDrawerClosed(@NonNull View drawerView) {
Log.i("---", "关闭");
}
@Override
public void onDrawerStateChanged(int newState) {
Log.i("---", "状态改变");
}
});
}
}
关于menu文件中的图标显示问题：
默认：灰色（会将你的图标色重置为灰色）
设为统一颜色
在com.google.android.material.navigation.NavigationView中设置：
app:itemIconTint="@color/blue"
代码中设为图标原色
navigationView.setItemIconTintList(null)
效果图
滑出菜单栏1.jpeg
滑出菜单栏2.jpeg
千夜零一："之前总是看各种博客学习东西，现在我想用博客记录下我的学习脚步，好东西也需要分享，索取和给予是相互的。以后会尽量日更的！目标完成1001篇博客哈哈。”
如果觉得对你有所帮助，请不要吝啬你的点赞，有问题也可以在下方评论区留言哦，关注我一起学习吧～
网友评论