概览 本文会简要概述导航组件,包括如何创建一个带有导航能力的、已启用导航的 UI 中有关包含层级的细节的新应用,以及对于一些主要 API 和导航组件工作原理的解释。...IDE 加载完毕该应用之后,打开导航资源文件 nav_graph.xml 并在 Design 模式 (此外还有 Code 与 Split 模式) 下查看。您会看到当前应用导航图的样子。...我们可以用导航工具来定义新的目的地,当我们还没有准备好目的地的 Fragment 类的时候,我们可以用占位符,也可以使用已存在的 Fragment 类。...应用展示了 NavigationView (抽屉式导航栏) 覆盖在 activity 内容上方 接下来是 NavigationView,它是一个从左边划入的抽屉式导航栏。...大部分的导航相关的图像更新发生在 NavHostFragment 内部,但是系统中仍然存在其他需要更新且不在容器内的部件,比如我们上面看到的抽屉式导航栏,以及类似 tab bar 的元素 (该组件可以被用来展示当前目的地信息
它可以自动构建正确的“向上”和“返回”行为,包含对深层链接的完整支持,并提供了帮助程序,用于将导航关联到合适的 UI 小部件,例如抽屉式导航栏和底部导航。...使用对比 以下我仅从集成和页面跳转两个方面进行简单的使用比较,更多使用内容可以参阅本项目源码。...Navigation 1.在res/navigation/中创建navigation导航图。 在这里插入图片描述 2.在Activity的布局中增加Fragment占位容器。...下面是使用NavHostFragment进行占位。...// 使用类名打开 openPage(TestFragment.class); // 使用页面标识符打开 openPage("TestFragment"); 更多使用对比 更多使用内容可以参阅本项目源码
优点 可视化的页面导航图,可以使用 Android Studio 的 Navigation Editor 来查看和编辑导航图。 通过destination和action完成页面间的导航。...页面间类型安全的参数传递。 支持深层链接DeepLink。 通过NavigationUI类,对菜单、底部导航、抽屉菜单导航进行统一的管理。 主要元素 Navigation Graph。...使用Toolbar时,Navigation组件会自动处理导航按钮的点击事件,因此无需覆盖onSupportNavigateUp()。...当用户通过显式深层链接打开您的应用时,任务返回堆栈会被清除,并被替换为相应的深层链接页面。当用户从深层链接页面按下返回按钮时,他们会返回到相应的导航堆栈。...定制FragmentNavigator 阅读FragmentNavigator的源码时,可以看到页面切换的时候使用的是replace(),这会造成Fragment生命周期的重启,界面数据重新加载,不能复用
这是第二个关于导航 (Navigation) 的 MAD Skills 系列,如果您想回顾过去发布的内容,请参考下面链接查看: 导航组件概览 导航到对话框 在应用中导航时使用 SafeArgs 使用深层链接导航...在本文中,我们将为大家讲解另外一个用例,即类似操作栏 (Action Bar)、底部标签栏或者抽屉型导航栏之类的 UI 组件如何在应用中实现导航功能。...我需要在应用中增加一些页面,所以有必要使用抽屉式导航栏或者底部标签栏来辅助用户导航。但是我们该如何使用这些 UI 组件来集成导航功能呢?通过点击监听器手动触发导航动作吗? 不需要!无需任何监听器。...抽屉式导航栏 虽然看上去不错,但是如果您设备的屏幕尺寸较大,那么底部标签栏恐怕无法提供最佳的用户体验。...Donut Tracker 应用并不需要底部标签栏或者抽屉式导航栏,但是添加了新的功能和目的页面后,NavigationUI 可以很大程度上帮助我们处理应用中的导航功能。
主要功能就是帮助 Activity 管理 Fragment ; App Bar 是应用程序顶部的一个可用于导航和操作应用程序的界面元素。...管理 , 可以对 菜单 , 底部导航栏 , 抽屉菜单 的页面及跳转逻辑 , 进行统一管理 ; 支持 DeepLink 深层链接 , 可以直接跳转到指定的 Fragment 中 ; 三、Navigation...中定义的 Fragment 页面 需要通过 NavHostFragment 进行展示 ; NavController 组件 : 该组件是 NavHostFragment 中的管理对象 , 用于管理应用中的导航操作...指定的 Fragment 显示到 NavHostFragment 组件中 ; 四、Navigation 使用流程 ---- Navigation 使用流程 : 创建若干 Fragment 页面 创建 Navigation...Graph , 并指定要跳转的 destination 页面 创建 NavHostFragment 组件 执行 Fragment 页面跳转 , 并添加动画效果 使用 NavController 组件实现页面导航
通过destination和action完成页面间的导航 方便添加页面切换动画 页面间类型安全的参数传递 通过Navigation UI类,对菜单/底部导航/抽屉蓝菜单导航进行统一的管理 支持深层链接...Navigation Graph:一个包含所有导航和页面关系相关的 XML资源。 NavHostFragment:一种特殊的Fragment,用于承载导航内容的容器。...2.4 NavHostFragment 我们知道,Fragment需要有一个Activity容器才能正常运行,NavHostFragment就是承载导航内容的容器,并且它需要和Activity绑定。...[在这里插入图片描述] 4.2 URL 使用URL链接方式,当用户通过手机浏览器浏览网站上的某个页面时,可以通过网页浏览器的方式打开对应的应用页面。...如果用户的手机安装有我们得应用程序,那么通过DeepLink就能打开相应的页面;如果没有安装,那么网站可以导航到应用程序的下载页面,从而引导用户安装应用程序。
是 Google 官方提供的 用于管理 Navigation 导航的组件 , 属于 Android 系统的 Jetpack 工具包 ; 借助 NavigationUI 可以很方便的 创建和组织应用程序的导航界面...; 如 : 构建复杂的导航结构,垂直或水平的主菜单 , 侧边栏 , 抽屉导航栏等 ; 开发者 可以 通过 NavigationUI 轻松地管理页面的转换和导航 ; NavigationUI 提供了一些静态方法来处理...顶部应用栏 / 抽屉式导航栏 / 底部导航栏中 的界面导航 ; 本篇博客中介绍一种使用场景 : 使用 AppBar 中的菜单选项控制 Navigation 界面跳转 ; 在 Activity 中 ,...Activity 导入 NavHostFragment 进入 Launcher 界面 MainActivity 的布局中 , 删除布局中的其它元素 ; 将 NavHostFragment 拖入到 布局中..., navController) 代码的含义是 : 优先使用 NavigationUI 进行导航 , 如果跳转失败 , 再使用传统的方式执行默认动作 , 代码为 super.onOptionsItemSelected
大部分的导航发生在 Fragment 目的地之间,在 UI 中的 NavHostFragment 对象内部,fragment 会被替换出去。但其实导航到容器外的目的地包括对话框也是可行的。...导航组件默认的行为确实是替换掉 NavHostFragment 中的 fragment。但是导航组件同样可以处理在 NavHostFragment 之外的对话框目的地。....actionDonutListToDonutEntryDialogFragment(donut.id)) 关于上述代码片段,有几点需要注意: 首先,我们在此使用的 navigate...这是因为上述代码片段来自于 DonutTracker 应用的最终版本,在该版本中我使用了 SafeArgs。...点击任一甜甜圈会导航到编辑其信息的对话框 点击 DONE 按钮,将保存更改到数据库中并且返回更新的列表;而点击 CANCEL 按钮,将放弃掉所有的编辑并返回。
△ 更改之前的 Trackr 样式 上图是我们进行更改之前的 Trackr 样式,您会发现不管在什么设备或屏幕下,都会有一个单窗口任务列表以及用于导航到归档或设置页面的底部应用栏。...△ 警告窗口 展开警告可以查看到 Android Studio 是否提供了修改建议,这里关于底部应用栏警告的修改建议就是使用 Navigation Rail、抽屉式导航栏,或使用顶部应用栏代替。...对于 Trackr,我认为使用导航路由更有建设性。而针对 MaterialTextView 的修改建议是要么减少 TextView 的宽度,要么考虑使用多列布局,这里使用多列布局更适合我们的应用。...我们先来进行第一项优化,使用 NavRail 而非底部应用栏,首先我们要考虑的是导航模型,所幸我们不会更改很多具体的视图,仅仅只会更改导航方式,因为 NavRail 会一直存在于整个视图体系中,可以通过它导航到任何其他视图...△ JetNews 侧边抽屉导航栏展示 回到 JetNews,我们可以看到在大屏状态下,侧边的抽屉导航栏会以模态的方式出现,但它会延伸到整个屏幕而出现大量空白区域。
5.通过NavigationUI类,对菜单,底部导航,抽屉菜单导航进行统一的管理 6.支持深层链接DeepLink 二.Navigation的主要元素 在正式学习Navigation...Navigation Graph:导航图,包括应用程序所有的页面以及页面间的关系 NavHostFragment:这是一个特殊的Fragment,你可以认为它是其他Fragment的容器,Navigation...Graph中的Fragment正是通过NavHostFragment进行展示的 NavController:导航控制器,用于在代码中完成Navigation Graph中具体的页面切换动作 它们三者之间的关系可以通过下面的这段话来理解...5.使用NavController完成导航 经过以上的步骤后,我们还需要通过NavController对象,在代码中完成具体的页面跳转工作,我们需要在MainFragment的布局文件中添加一个...如果没有的话,可以重新编译一下项目。
以及Android Studio3.3的使用 在更新之后,其中还有一大亮点就是Navigation Editor(导航编辑器) Navigation 说到Navigation Editor我们就不得不先简单说一下...导航组件的构成 导航组件由三个关键的部分组成: Navigation graph(导航图): 这是一个包含所有位置导航相关信息的XML资源文件。...Navigation组件包含一个实现NavHostFragment的默认的NavHost,它是用来展示fragment的目的地。...当我们通过导航浏览我们的应用程序的时候,我们可以通知NavController我们要沿着导航图当中的特定的路径进行导航,或者直接导航到特定的目的地。...可以供标准化的过渡动画资源。 实现和处理深度链接。 涵盖了一些导航UI模式,比如只需要很少的额外工作就能实现抽屉导航和底部导航。
基本使用 虽然在之前的文章中已经很详细的介绍了Navigation,但是这里也简单的叙述一下我在项目中的具体使用: 2.1 Navigation+DrawerLayout+ToolBar 我们可以通过使用...,NavHostFragment通过navGraph与navigation导航编辑器进行关联。...打开Desgin面板,进入设计模式,在里面我们可以新建我们的目标页面。...打开Text模式的xml我们可以看到我们选择的Fragmengt配置信息,当然你也可以不通过面板设计,也可以直接在xml里进行代码编写。...大致意思就是NavHostFragment在布局中提供了一个区域,用于进行包含导航 接下来我们看一下它的源码: public class NavHostFragment extends Fragment
该功能是使用包含信息的 元素来替换主页 HTML 的主体 body。 console.log('Hello, Snippets!')...; document.body.appendChild(p); 当你点击 ▶️ 运行按钮,控制台抽屉 会弹出,输出 Hello, Snippets! 代码信息,且页面的内容发生更改。...图片 打开 Snippets 面板 Snippets 面板罗列了你的所有片段。你可以采用下面的两种方法之一打开该面板: 根据 Sources > 》 > Snippets 导航指引打开。...Sources 面板会在 Code Editor 中打开它。 图片 使用 Code Editor 去编辑你的片段代码。出现星号*在你片段名称的旁边,说明你还没有保存你更改的片段。...点击你想运行的一个片段。Sources 会在 Code Editor 中打开它。
当 bar 脱离FAB时,会恢复到默认的形状。 在返回到屏幕并重新附着 FAB 后,bar 重新获得了缺口形状。 ? ---- 海拔 Bottom app bar 的海拔高度为8dp。...底部的导航抽屉从底部的应用栏打开。 抽屉在底部应用程序栏前打开,并显示顶部应用程序栏以在达到完整高度时关闭抽屉。...Drawer 在 bottom app bar 前面打开,并显示 top app bar 以在达到完整高度时关闭抽屉。...---- 位置 导航 Bottom app bar 可显示 navigation menu icon 以打开 bottom navigation drawer,但该 bar 本身不包含任何导航操作(例如向上导航至主屏幕或一个关闭图标...不要将导航操作置于bottom app bar中,因为它们可以被临时表面覆盖 与 top app bar 同时使用 当与 bottom app bar 一起使用时,top app bars 可以提供向上导航和其他操作
R.id.fragment) as NavHostFragment //管理应用导航的对象 val navController = navHostFragment.navController...navigation的坑 分别在三个fragment中的主要生命周期中打印各自的log,运行程序,打开FragmentHome,可以看到生命周期是正常执行的 [ki8v26fq4w.png] 然后点击底部的发现切换到...FragmentHome,神奇的事情发生了,原来的FragmentHome销毁了,却又重新创建了一个新的FragmentHome实例,即fragment的重绘,并且从log日志中也可以看到,刚刚打开的FragmentDiscover...我们知道replace方法每次都会重新创建fragment,所以使用Navigation创建的底部导航页面,每次点击切换页面当前fragment都会重建。...,发现已经不会重新走生命周期了。
它可以自动构建正确的“向上”和“返回”行为,包含对深层链接的完整支持,并提供了帮助程序,用于将导航关联到合适的 UI 小部件,例如抽屉式导航栏和底部导航。...2.Fragment切换 通过现象分析,发现当切换NavigationView中的menu菜单来切换Fragment时,DrawerLayout抽屉关闭有一个短暂的动画(具体的这里就不分析了,感兴趣的可以自行查看...基于Navigation用来承载Fragment的容器是NavHostFragment,所以我们并不能使用ViewPager+Fragment的通过setUserVisibleHint实现懒加载的方式;...4.1 建议 这里我的建议是:如果你的每个Fragment真的每次都需要重新绘制的话,你可以考虑使用Navigation组件来实现,毕竟通过Navgation组件真的很方便帮助我们切换导航,而且虽然布局会重新绘制...我还发现一个问题,就是Play商店,现在就是这样的情况,抽屉栏中的Item每个基本都是重新绘制,而且第一个Item我的应用和游戏切换的时候就会有很明显的卡顿和闪屏,猜测Google play 商店具体是不是使用的
启动时,你可以导航到项目的 Google Cloud 控制台,在抽屉导航的 Stackdriver 部分中选择 Logging 选项: ?...让我们看看如何将你的日志从 Stackdriver 导出到你的基础设施中,让你在这些数据之上构建额外的集成。 使用 Stackdriver,你可以设置包含带有特定过滤器的日志接收装置。...在这里,你可以创建一个连接到 Google Cloud 发布/订阅的主题接收器。这将是你能够在每次出现日志条目时处理事件: ? 在抽屉导航中,打开发布/订阅概述,创建一个新的订阅: ?...下面的代码片段显示了使用 Node.js 的实现: app.post('/alerts/stackdriver', (req, res) => { console.log('post stackdriver...在你的服务器中,你也会看到此错误正在被记录。当你遇到此错误时,你可以查看已发送的 SYNC,并确定该错误来自设备类型的错误。你可以通过修复返回此设备信息的字符串来修复 webhook 中的错误。
自述 应用布局 应用程序布局是一个样式,指令和组件系统,当它们一起使用时,可以提供材质外观和感知应用程序的层叠关系。 它根据材料规格提供应用栏,抽屉和导航样式。...-- Content goes here --> 持久性抽屉 持久抽屉是可以通过动作打开和关闭的抽屉,例如按钮触发器。这些抽屉重新定位内容以适应抽屉的流动。...最后,将打开/关闭抽屉动作连系到抽屉。使用引用变量语法最容易完成。持久抽屉指令将其自身导出为抽屉,这允许其它操作可以轻松使用它。toggle()可用于打开/关闭抽屉。...临时抽屉具有可选的overlay属性,可用于在抽屉打开时在非抽屉内容上方显示透明覆盖。...如果它在material-content之内,它将与内容一起使用,并且如果适用,则与内容重新定位。
领取专属 10元无门槛券
手把手带您无忧上云