学习使用Material Design控件(二)使用DrawerLayout实现侧滑菜单栏效果
时间:2022-07-27
本文章向大家介绍学习使用Material Design控件(二)使用DrawerLayout实现侧滑菜单栏效果,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
本文介绍如何使用DrawerLayout和NavigationView实现侧滑菜单栏的效果。
效果如下:
Layout布局
<android.support.v4.widget.DrawerLayout xmlns:android=“http://schemas.android.com/apk/res/android”
xmlns:app=“http://schemas.android.com/apk/res-auto”
android:id=“@+id/drawer_layout”
android:layout_width=“match_parent”
android:layout_height=“match_parent”
android:fitsSystemWindows=“true”
<android.support.design.widget.NavigationView
android:id=“@+id/navigation_view”
android:layout_width=“wrap_content”
android:layout_height=“match_parent”
android:layout_gravity=“start”
app:headerLayout=“@layout/navigation_header”
app:menu=“@menu/drawer” /
</android.support.v4.widget.DrawerLayout
NavigationView需要设置app:headerLayout 和 app:menu,headerLayout对应菜单的上面部分,一般用来显示用户信息,menu则对应实际的菜单项文件。
headerLayout
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="192dp"
android:background="?attr/colorPrimaryDark"
android:gravity="center"
android:orientation="vertical"
android:padding="16dp"
android:theme="@style/ThemeOverlay.AppCompat.Dark"
<de.hdodenhof.circleimageview.CircleImageView
android:id="@+id/profile_image"
android:layout_width="72dp"
android:layout_height="72dp"
android:layout_marginTop="20dp"
android:src="@mipmap/profile"
app:border_color="@color/primary_light"
app:border_width="2dp" /
<TextView
android:layout_marginTop="10dp"
android:textSize="18sp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="APP开发者"
android:gravity="center"
android:textAppearance="@style/TextAppearance.AppCompat.Body1"
/
</LinearLayout
menu
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
tools:context=".MainActivity"
<group android:checkableBehavior="single"
<item
android:id="@+id/navigation_item_example"
android:icon="@drawable/ic_favorite"
android:title="@string/navigation_example" /
<item
android:id="@+id/navigation_item_blog"
android:icon="@drawable/ic_favorite"
android:title="@string/navigation_my_blog" /
<item
android:id="@+id/navigation_item_about"
android:icon="@drawable/ic_favorite"
android:title="@string/navigation_about" /
</group
</menu
代码实现
ActionBarDrawerToggle可以配合Toolbar,实现Toolbar上菜单按钮开关效果。
//设置Toolbar
mToolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(mToolbar);
//设置DrawerLayout
mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, mToolbar,
R.string.drawer_open, R.string.drawer_close);
mDrawerToggle.syncState();
mDrawerLayout.setDrawerListener(mDrawerToggle);
//设置NavigationView点击事件
mNavigationView = (NavigationView) findViewById(R.id.navigation_view);
setupDrawerContent(mNavigationView);
//设置NavigationView点击事件
private void setupDrawerContent(NavigationView navigationView) {
navigationView.setNavigationItemSelectedListener(
new NavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(MenuItem menuItem) {
switch (menuItem.getItemId()) {
case R.id.navigation_item_example:
switchToExample();
break;
case R.id.navigation_item_blog:
switchToBlog();
break;
case R.id.navigation_item_about:
switchToAbout();
break;
}
menuItem.setChecked(true);
mDrawerLayout.closeDrawers();
return true;
}
});
}
项目源码已发布到Github,以后慢慢加入其他控件的使用。
以上就是本文的全部内容,希望对大家的学习有所帮助。
- python常用可视化技巧
- Spring+SpringMVC+MyBatis+easyUI整合基础篇(六)maven整合SSM
- 通过java程序抽取日志中的sql语句(r4笔记第4天)
- Spring+SpringMVC+MyBatis+easyUI整合基础篇(七)JDBC url的连接参数
- Spring+SpringMVC+MyBatis+easyUI整合基础篇(十)SVN搭建
- position:sticky的兼容性尝试
- Python爬虫股票评论,snowNLP简单分析股民用户情绪
- Spring+SpringMVC+MyBatis+easyUI整合基础篇(十一)SVN服务器进阶
- node服务的监控预警系统架构
- Maven构建项目速度太慢的解决办法
- 分析函数之窗口子句(r4笔记第3天)
- node模块加载层级优化
- 使用ajax方法实现form表单的提交
- 翻译:如何使用CSS实现多行文本的省略号显示
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- R语言自适应平滑样条回归分析
- R语言区间数据回归分析
- R语言ggsurvplot绘制生存曲线报错 : object of type ‘symbol‘ is not subsettable
- R软件SIR模型网络结构扩散过程模拟
- R语言中使用线性模型、回归决策树自动组合特征因子水平
- R语言缺失值的处理:线性回归模型插补
- R语言如何解决线性混合模型中畸形拟合(Singular fit)的问题
- Android如何在Gradle中更改APK文件名详解
- 面试中常见的 C 语言与 C++ 区别的问题
- Linux系统实现ansible自动化安装配置httpd的方法
- 常用Linux发行版镜像源配置小结
- Linux如何处理文件已删除但空间不释放的问题
- 解析linux或android添加文件系统的属性接口的方法
- linux查看软件的安装位置简单方法
- 使用 bind 设置 DNS 服务器的方法