在本文中，我们将为大家讲解另外一个用例，即类似操作栏 (Action Bar)、底部标签栏或者抽屉型导航栏之类的 UI 组件如何在应用中实现导航功能。...首先添加 bottom_nav_menu.xml 文件并且声明两个菜单元素。NavigationUI 依赖 MenuItem 的 id，用它与导航图中目的页面的 id 进行匹配。...这个布局文件与默认的 activity_main 布局相类似，其中已经包含了 Toolbar 和 FragmentContainerView。...现在布局文件已经就绪，我再创建一个 nav_drawer_menu.xml，并且将 donutList 和 coffeeList 作为主要的分组添加为目的页面。...Donut Tracker 应用并不需要底部标签栏或者抽屉式导航栏，但是添加了新的功能和目的页面后，NavigationUI 可以很大程度上帮助我们处理应用中的导航功能。
使用注意点 1、DrawerLayout的第一个子元素必须是默认内容，即抽屉没有打开时显示的布局（如FrameLayout），后面紧跟的子元素是抽屉内容，即抽屉布局（如ListView）。...解决办法:在include进的那个布局里面，添加clickable=true 2、除了抽屉的布局视图之外的视图究竟放哪里 左、右抽屉和中间内容视图默认是不显示的，其他布局视图都会直接显示出来，但是需要将其放在...实现抽屉菜单 NavigationView是Android M中提出一个新的MD风格的组件，它将自己一分为二，上面显示一个通用的布局，下面显示一组菜单。...与DrawerLayout一起使用可以实现通用的侧滑菜单，布局如下 xml version="1.0" encoding="utf-8"?...app:menu="@menu/menu_drawer_left" /> //导航的底部菜单 header.xml
您还需要在用户点击设备返回按钮和 ActionBar 的向上按钮时正确地处理返回和向上操作。有时候不同应用中处理这两个相关而又不完全相同的操作会产生一些不一致的结果。...IDE 加载完毕该应用之后，打开导航资源文件 nav_graph.xml 并在 Design 模式 (此外还有 Code 与 Split 模式) 下查看。您会看到当前应用导航图的样子。...到目前为止，我们一直在使用图形化工具开发导航，而像 Android Studio 中所有的资源文件一样，这些都是通过 XML 代码实现的，所以您也可以直接查看和编辑这些代码。...ConstraintLayout 容器是在 main_activity.xml 布局文件中被定义的，它包含了应用的实际内容 (但并不是所有内容，比如像 ActionBar 这种被模板创建好的元素)。...应用展示了 NavigationView (抽屉式导航栏) 覆盖在 activity 内容上方 接下来是 NavigationView，它是一个从左边划入的抽屉式导航栏。
（将这些控件结合在一起的手势滚动框架） 官方视频简介 Navigation View 抽屉导航是app识别度与内部导航的关键，保持这里设计上的一致对app的可用性至关重要，尤其是对第一次使用的用户。...NavigationView 通过提供抽屉导航所需要的框架让实现更简单，同时它还能够直接通过菜单资源文件来直接生成导航元素。 ?...的两个属性： app:headerLayout ：控制头部的布局（可选） app:menu：导航菜单的资源文件（必选），也可以在运行时配置。...NavigationView处理好了和状态栏的关系，可以确保NavigationView在API21（5.0）设备上正确的和状态栏交互。...，它为你提供被点击的 菜单元素 ，让你可以处理选择事件，改变复选框状态，加载新内容，关闭导航菜单，以及其他任何你想做的操作。
一般这种情况我们为了获取这类未初始布局里的空间会使用inflate方法，这里其实处理是类似的，后面会提到。...我们首先了解一下NavigationView的使用，新建一个抽屉活动后，我们可以看到主界面的布局文件是这样的 xml version="1.0" encoding="utf-8"?...就是左边抽屉拉出来后的布局了~可以看到它有两个属性app:headerLayout和app:menu 其实这两个属性后面就分别是上图中蓝色背景部分的抽屉头和下面的菜单。...image.png 这些方法都是对抽屉布局上的菜单和头布局进行操作时可以使用的。...这也就是说我们在进行前面的操作1其实是获得该布局的同时把其加入到抽屉布局中去，这样就会出现下面的情况： image.png 操作2 解决方法也很简单，就是在layout文件中去掉 app:headerLayout
对于Android来说，侧滑功能用到了抽屉布局DrawerLayout，我们只要把页面的根布局设置为DrawerLayout，并指定弹出的侧滑视图，就能通过右拉页面左侧边缘，从而拉出定义好的侧滑视图。...在布局文件中使用NavigationView，可设置以下几个专门属性： app:headerLayout : 指定头部布局的资源文件。 app:menu : 指定导航菜单的资源文件。...menu_one.xml，结构定义与普通的菜单文件基本相同，多出来的group节点用于给菜单项分组，不同的菜单组之间会显示分隔线。...4、无法设置每个菜单项的间距。 所以呢，要想实现丰富可定制的导航菜单，还得自己定义一个导航视图。...虽说是自定义，其实也没这么复杂，只需把布局文件中原来NavigationView的节点位置换成ListView即可，使用ListView就能随意定制菜单项的布局和风格了。
先上效果图： 主界面上drawlayou 和NavigationView形成抽屉效果，布局文件如下： <android.support.v4.widget.DrawerLayout xmlns...填充Menu菜单，也可在xml中使用app:menu="@menu/menu_nav"来设置 navigationView.inflateMenu(R.menu.menu_nav); 可以给...－－－－－－－－－－抽屉部分结束－－－－－－－－－－－ tab layout 和view pager 实现联动效果： // 初始化ViewPager的适配器，并设置给它...实现下拉刷新效果: 布局文件： 的是: 加载布局文件的方法一定是这个，要不然会出现match_parent 失效。
Android 中的 DrawerLayout 就是一个抽屉导航组件，所以这个组件的功能当然也是一样的。...我们的这个抽屉导航视图一开始是看不见的，就像抽屉一样，你不拉开抽屉你看不到东西，所以导航视图可以从drawerPosition指定的窗口侧面拖拽出来，并且抽屉的宽度可以使用drawerWidth属性来指定...unlocked (默认值)，意思是此时抽屉可以响应打开和关闭的手势操作。...抽屉可以有3种状态： dle（空闲），表示现在导航条上没有任何正在进行的交互。 dragging（拖拽中），表示用户正在与导航条进行交互。...settling（停靠中），表示用户刚刚结束与导航条的交互，导航条正在结束打开或者关闭的动画。
，后者就是我们要设计的Navigation布局文件. 2.1.3 navigation_main.xml 在Android Studio3.2版本以上里面内嵌了Navigation的设计面板工具，我们可以在...2.2 BottomNavigationView使用 2.2.1 配置文件 和上面的步骤类似：也是配置好 navigation.xml布局以及 BottomNavigationView所对应的menu...没错，就是我们在xml布局中设置的那一个。...它继承了Navigator，查看注释我们知道它是为每个Navigation设置策略的，也就是说Fragment之间通过导航切换都是由它来操作的，下面会详细介绍的，这里先简单看下。...接下来我们看到为NavController设置了setGraph()，也就是我们xml里面定义的navGraph，导航布局里面的Fragment及action跳转等信息。
，后者就是我们要设计的Navigation布局文件. 2.1.3 navigation_main.xml 在Android Studio3.2版本以上里面内嵌了Navigation的设计面板工具，我们可以在...2.2 BottomNavigationView使用 2.2.1 配置文件 和上面的步骤类似：也是配置好 navigation.xml布局以及 BottomNavigationView所对应的menu菜单文件...没错，就是我们在xml布局中设置的那一个。...它继承了Navigator，查看注释我们知道它是为每个Navigation设置策略的，也就是说Fragment之间通过导航切换都是由它来操作的，下面会详细介绍的，这里先简单看下。...接下来我们看到为NavController设置了setGraph()，也就是我们xml里面定义的navGraph，导航布局里面的Fragment及action跳转等信息。
DrawerLayout 控件用处：实现滑动菜单 1.1 首先它是一个布局，在布局中允许放入两个直接子控件， 第一个子控件是主屏幕中显示的内容；...调用了setHomeAsUpIndicator()方法来设置一个导航按钮图标； 1.2.5 在onOptionsItemSelected()方法中对HomeAsUp按钮的点击事件进行处理...menu是用来在NavigationView中显示具体的菜单项的； headerLayout则是用来在NavigationView中显示头部布局的。...然后右击menu文件夹→New→Menu resource file，创建一个nav_menu.xml文件，并编写如下代码： xml version="1.0" encoding="utf-8"?...然后右击layout文件夹→New→Layout resourcefile，创建一个nav_header.xml文件。 修改其中的代码，如下所示： <?
抽屉（通常用于导航切换）是通过renderNavigationView方法渲染的，并且DrawerLayoutAndroid的直接子视图会成为主视图（用于放置你的内容）。...有三种状态： unlocked (默认值)，意味着此时抽屉可以响应打开和关闭的手势操作。 locked-closed，意味着此时抽屉将保持关闭，不可用手势打开。...onDrawerOpen function 每当导航视图（抽屉）被打开之后调用此回调函数。 onDrawerSlide function 每当导航视图（抽屉）产生交互的时候调用此回调函数。...onDrawerStateChanged function 每当抽屉的状态变化时调用此回调函数。抽屉可以有3种状态： idle（空闲），表示现在导航条上没有任何正在进行的交互。...dragging（拖拽中），表示用户正在与导航条进行交互。 settling（停靠中），表示用户刚刚结束与导航条的交互，导航条正在结束打开或者关闭的动画。
Android自5.0后增加了不少新控件，帮助开发者实现了更酷更炫的UI效果。...Android 5.0 抽屉布局 DrawerLayout Android 5.0 滑动面板布局 SlidingPaneLayout Android 5.0 嵌套滚动视图 NestedScrollView...使用v4控件唯一需要注意的地方，是布局文件中要引用完整路径的控件名称，如抽屉布局android.support.v4.widget.DrawerLayout、下拉刷新布局android.support.v4...使用v7与design库的控件，类似于使用自定义控件，不但要在布局文件中引用完整路径的控件名称，还要在根布局声明命名空间（即添加属性xmlns:app="http://schemas.android.com...这部分控件数量最多，实现的界面特效最丰富，而且互相之间存在依赖关系，如design库依赖于appcompat-v7库，部分design控件如NavigationView还依赖于recyclerview-v7
这种方式即节省了屏幕空间，又实现了好看的动画效果，比如我们一直在用的扣扣的左侧菜单效果~ DrawerLayout是 SupportLibrary包中实现了侧滑菜单效果的控件。...在之前的应用中，实现侧滑菜单功能大多是通过开源库SlidingMenu来实现，后来谷歌在V4包中添加了 DrawerLayout来实现这个功能，完全可以替代 SlidingMenu。...布局代码如下： xml version="1.0" encoding="utf-8"?...先在 layout文件夹下创建 head.xml文件： xml version="1.0" encoding="utf-8"?...menu，在menu目录下新建 drawer_menu.xml文件，名字可以自己随意起。
此外，Navigation组件还可以让您声明我们为您处理的转场。...它可以自动构建正确的“向上”和“返回”行为，包含对深层链接的完整支持，并提供了帮助程序，用于将导航关联到合适的 UI 小部件，例如抽屉式导航栏和底部导航。...2.Fragment切换 通过现象分析，发现当切换NavigationView中的menu菜单来切换Fragment时，DrawerLayout抽屉关闭有一个短暂的动画(具体的这里就不分析了,感兴趣的可以自行查看...同样我们也没办法使用onHiddenChanged的方式来实现复杂逻辑的加载；但是你可以在进入Fragment的时候先显示一个Loading框，加载完数据之后再渲染布局，这样的话可以减少一些尴尬。...4.1 建议 这里我的建议是：如果你的每个Fragment真的每次都需要重新绘制的话，你可以考虑使用Navigation组件来实现，毕竟通过Navgation组件真的很方便帮助我们切换导航，而且虽然布局会重新绘制
而在 DrawerLayout 没诞生之前，需求中需要实现侧滑导航效果时，我们通常会选择去选择一些成熟的第三方开源库（如最有名的 SlidingMenu）来实现类似的效果。...NavigationView是一个导航菜单框架，使用menu资源填充数据，使我们可以更简单高效的实现导航菜单。它提供了不错的默认样式、选中项高亮、分组单选、分组子标题、以及可选的Header....用于NavigationView的典型menu文件，应该是一个可选中菜单项的集合。其中checked=”true”的item将会高亮显示，这可以确保用户知道当前选中的菜单项是哪个。...里面的图标，可以下载APP，解压后，去文件夹里取出来~ 主要就是一个线性布局的菜单并结合了 Translucent System Bar 的特性。...---- 左上角的导航动画效果实现 效果 ?
在项目迁移AndroidX的过程中遇到一些问题，特别是Navigation抽屉页面迁移的过程中遇到一些问题，跟着网上的教程走完了全程，却总是闪退，原因直指xml布局文件。...迁移固有流程 第一步：在project的gradle.properties文件里添加如下配置： android.useAndroidX=true android.enableJetifier=true...一般的项目经过以上的步骤就完成了，但是在我迁移Navigation时候发现还是无法运行，经过不断的排查发现在xml文件中使用的所有support型控件也需要替换，下面记录下我替换的控件。...替换为com.google.android.material.navigation.NavigationView android.support.design.widget.CoordinatorLayout...与Behavior使用指南 Android框架之路——NavigationView的使用（结合ToolBar） --------------------- Author: Frytea Title
今天我们讲一下它们的自定义配置。 DrawerLayout布局 xml version="1.0" encoding="utf-8"?...(this); 侧滑菜单中选项按钮的点击事件 MainActivity实现了NavigationView.OnNavigationItemSelectedListener这个监听事件，然后在实现的监听方法里判断点击事件...headerLayout上的控件实现 如果要实现headerLayout上的控件的点击，那就得这样做了，如下： View navHeaderView = navigationView.inflateHeaderView...我们需要在布局文件中把 app:headerLayout="@layout/header_layout" 这行代码去掉，否则会重复的。...主题和配色 上面用到的主题和颜色，我们可以在资源文件中配置。 比如color中： xml version="1.0" encoding="utf-8"?
5.通过NavigationUI类，对菜单，底部导航，抽屉菜单导航进行统一的管理 6.支持深层链接DeepLink 二.Navigation的主要元素 在正式学习Navigation...这里我们创建了MainFragment，还有对应的布局文件fragment_main.xml，此时可以看到AS为我们自动生成的代码如下： 导航 经过以上的步骤后，我们还需要通过NavController对象，在代码中完成具体的页面跳转工作，我们需要在MainFragment的布局文件中添加一个...我们可以通过下面的方式实现： 我们在res下新建一个menu菜单，然后添加一个menu_settings.xml文件，内容如下： 的id需要和导航图nav_graph.xml中SecondFragment的id一样，这表示，当该item被单击时，将会跳转到该id所对应的Fragment页面中。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
云直播
对象存储
腾讯会议
