的重要工具 , 可以极大地提高开发效率 ; 一、NavigationUI 类简介 NavigationUI 是 Google 官方提供的 用于管理 Navigation 导航的组件 , 属于 Android...系统的 Jetpack 工具包 ; 借助 NavigationUI 可以很方便的 创建和组织应用程序的导航界面 ; 如 : 构建复杂的导航结构，垂直或水平的主菜单 , 侧边栏 , 抽屉导航栏等 ; 开发者...可以 通过 NavigationUI 轻松地管理页面的转换和导航 ; NavigationUI 提供了一些静态方法来处理 顶部应用栏 / 抽屉式导航栏 / 底部导航栏中 的界面导航 ; 本篇博客中介绍一种使用场景...: 使用 AppBar 中的菜单选项控制 Navigation 界面跳转 ; 在 Activity 中 , 使用 Navigation 组件 切换 Fragment 界面时 , 除了进行界面切换之外...( 重点 ) 首先 , 获取 NavController , 从布局文件中定义的 Fragment 布局中获取 ; // 1.
应用内导航，也就是我们通常所说屏幕切换，一直是 Android 开发很关键的一部分。...我们已正式发布稳定版 Android Jetpack 导航组件，它包含丰富的库、工具和指南，为开发者们提供了一个强劲、完整的导航框架，让开发者可以轻松应对复杂的导航场景。...我们在这个视频中通过一些导航组件的应用实例，向您演示如何通过 "单个 activity 嵌套多个 fragment" 的方法来完成导航工作。....html Bilibili 视频链接： https://www.bilibili.com/video/av54529064/ 如果您想获取更详细的技术指导，可以查看 Android 开发者网站上有关导航组件的
Fragment / Activity 之间的数据传递 , 应用 App Bar 管理 等操作 ; 上述操作都是 使用纯代码方式进行实现 , 在页面和 App Bar 管理过程中使用比较繁琐 , 维护难度较大 ; Jetpack..., 抽屉菜单 的页面及跳转逻辑 , 进行统一管理 ; 支持 DeepLink 深层链接 , 可以直接跳转到指定的 Fragment 中 ; 三、Navigation 重要组件 ---- Navigation...: 该组件是 NavHostFragment 中的管理对象 , 用于管理应用中的导航操作 , 主要是完成在 Navigation Graph 中定义的页面切换操作 ; 通过 NavController...执行 Fragment 页面跳转 , 并添加动画效果 使用 NavController 组件实现页面导航 使用 Safe Args 插件安全传递数据 创建 Navigation Graph 组件有一个前提...上 , 可以看到右侧的 圆圈 , 在 圆圈 上 , 按住鼠标左键 , 拖动到 fragmentB 上 , 会自动生成一个箭头 , 这个箭头就是 action , 代表了一次跳转 ; 也可以设置一个从
为了帮助开发者把 Jetpack 组件集成到自己的应用中，我们开发出一款名为 Sunflower(太阳花) 的圆艺应用，让您能够在模拟养花的过程中学习最佳 Android 开发实践，了解别的开发者是如何利用...该系列的其它文章会陆续与各位开发者见面，如果您对 Jetpack 和 Android 开发感兴趣，或者想要进一步探索 Jetpack 导航组件，了解如何利用 WorkManager 调度循环任务，请持续关注...应用检测 (方面) 使用了本地 JUnit 单元测试和 Espresso Android UI 测试。...在今后的文章中，我们会进一步探讨 Sunflower 中的其它 Jetpack 组件，如导航和重复任务，尽情期待。谢谢您对 Sunflower 的关注！ ?...获取更多 Jetpack 相关信息，了解如何构建您的第一个 Jetpack 应用。 点击这里 "我们愿意更好地倾听您的声音 " ?
打开 " res/navigation " 下的 Navigation Graph 的 Xml 配置文件 ,
: https://github.com/han1202012/Navigation 一、页面跳转间的传统的数据传递方式 1、传统的数据传递方式 - Bundle 传递数据 1、Navigation 组件中的...val navController = Navigation.findNavController(it) // 按照 action_fragmentA_to_fragmentB 对应的 action 的导航路线走...R.id.action_fragmentA_to_fragmentB, args) 再后 , 调用 NavigationController#navigate 方法 , 传入对应的 Navigation 导航资源...val navController = Navigation.findNavController(it) // 按照 action_fragmentB_to_fragmentA 对应的 action 的导航路线走...savedInstanceState) setContentView(R.layout.activity_main) // fragmentContainerView 组件的
现在便会介绍如何通过新的 Jetpack API 和 Android Studio 功能，来对现有应用进行更新，以针对所有屏幕尺寸进行优化。...通过这种方式更新应用导航，无论屏幕尺寸如何都能够拥有相同的导航图，这意味着调整屏幕尺寸不会产生导航的变化，从而让用户感到困惑。...△ JetNews 侧边抽屉导航栏展示 回到 JetNews，我们可以看到在大屏状态下，侧边的抽屉导航栏会以模态的方式出现，但它会延伸到整个屏幕而出现大量空白区域。...其中比较有趣的一点是思考应用如何在不同尺寸布局之间转换，例如对于可折叠手机，应用可能会从较大的屏幕变为较小的屏幕。...测试和维护 现在您已了解如何轻松更新应用，来构建可调整尺寸的新界面。如何测试和维护项目也是一个非常重要的课题。
） Navigation 说到Navigation Editor我们就不得不先简单说一下Navigation（导航） 什么是Navigation 在Android开发当中，导航是指允许用户再应用内进入和退出不同内容的交互组件...而我们通过 Android Jetpack的导航组件可以帮助我们实现导航功能。导航组件还能可能遵循既定的原则来保证用户有一个良好的用户体检。...导航组件的构成 导航组件由三个关键的部分组成： Navigation graph（导航图）: 这是一个包含所有位置导航相关信息的XML资源文件。...导航组件有很多的好处： 可以处理fragment的事务。 默认情况下可以正确的处理好各个事物之间前后的操作。 可以供标准化的过渡动画资源。 实现和处理深度链接。...涵盖了一些导航UI模式，比如只需要很少的额外工作就能实现抽屉导航和底部导航。 Safe Args - 一种Gradle插件，可在目的地之间导航和传递数据时提供安全的数据类型。
概览 本文会简要概述导航组件，包括如何创建一个带有导航能力的、已启用导航的 UI 中有关包含层级的细节的新应用，以及对于一些主要 API 和导航组件工作原理的解释。...关于导航组件，网上已经有一些不错的内容资料: 官方的入门教程 Ian Lake 最近发布的视频 Android 中文教学视频: Android Jetpack 导航组件 撰写本章是为了本系列接下来的内容铺垫一些基础知识...导航部件 我们已经在层级结构中查看了几个 UI 组件，以及它们彼此之间是如何关联的，接下来我想介绍一下几个重要部件，导航组件正是利用它们来在目的地之间实现导航。...应用展示了 NavigationView (抽屉式导航栏) 覆盖在 activity 内容上方 接下来是 NavigationView，它是一个从左边划入的抽屉式导航栏。...总结 这篇文章只是关于导航组件的一个快速概览，目的是为了让您体验如何创建一个可以使用导航功能的应用，以及看一下这种应用的大致结构。
前言 本文承接上文 如何测试驱动开发 React 组件？，这次我将继续使用 @testing-library/react 来测试我们的 React 应用，并简要简要说明如何测试异步组件。...异步组件的测试内容 我们知道异步请求主要用于从服务器上获取数据，这个异步请求可能是主动触发的，也可能是（鼠标）事件响应，本文主要包含 2 方面内容： 如何测试在 componentDidMount 生命周期中发出的异步请求...如何测试（鼠标）事件发出的异步请求 ？ ---- 对于异步组件，有两件步骤需要进行测试： 第一：测试异步方法本身有没有被调用，并且传了正确的参数。 第二：在调用之后，应用程序应该做出响应。...: 通过 mock 使组件可以获取静态假数据; 测试加载状态; 测试异步方法是否被正确调用，并且带上了正确的参数; 测试组件是否正确地渲染了数据 测试异步方法错误时，组件是是否渲染了正确的状态 文中关于登录成功后页面跳转并未测试...，那么如何测试 react 路由 ？
download/han1202012/87936252 GitHub ( 可能已经覆盖 ) : https://github.com/han1202012/Navigation 一、Navigation 导航组件开发核心要点说明...1、Navigation 各子部件的创建顺序 Navigation 导航组件各子部件的创建顺序要点如下 : 首先 , 创建被导航的 Fragment 页面代码 和 对应的布局文件 ; 然后 , 基于创建的...-> NavHostFragment -> NavController , 后面的组件依赖于前面的组件 , 否则无法实现 Navigation 导航 ; 2、导入 Navigation 依赖 使用 Navigation...组件 , 必须导入 Navigation 依赖 , 不同的开发语言导入不同的依赖 : 使用 Java 语言 开发 Navigation 导航 , 导入如下依赖 : dependencies {...action_fragmentA_to_fragmentB" app:destination="@id/fragmentB" /> 二、Navigation 导航组件完整代码示例
Android组件化调研——知己知彼 基于倒推的思路，要评估测试策略，本质上我们需要了解测试回归范围，而测试回归范围依托于开发改动的影响范围，但若要与开发沟通改动和影响范围，我们最好先了解下Android...举个栗子，比如搜狗手机浏览器积分中心需求中的积分任务： 1、测试角度评估回归范围 首先，我们根据调研了解到的Android组件化的特点及关注点，从测试角度评估初步的影响范围和回归范围，这具体包含：积分任务的主路径功能...Android组件化测试策略制定——运筹帷幄 在做好一切准备工作之后，接下来就是制定测试策略。首先，是制定各个模块的测试策略，进而站在全局角度，确定整体的项目测试策略。...确定了各个模块的测试策略后，考虑到本次Android组件化的特点，从全局角度出发我们制定了整体的测试策略，如下所示： 1、整体各个模块进行冒烟/二轮粒度的测试； 2、在测试过程中，根据实际bug情况实时调整测试策略...至此，已完成了Android组件化这一工程优化需求的测试策略评估，接下来就是开始正式的测试阶段。
还没有看过上篇文章的可以查看一下： Jetpack组件之Navigation—看完你就知道Navigation是什么了？ 1....它可以自动构建正确的“向上”和“返回”行为，包含对深层链接的完整支持，并提供了帮助程序，用于将导航关联到合适的 UI 小部件，例如抽屉式导航栏和底部导航。...返回都做了什么 3.1 onBackPressed 我们同样从首页的onBackPressed入手： override fun onBackPressed() { if (drawerLayout.isDrawerOpen...4.1 建议 这里我的建议是：如果你的每个Fragment真的每次都需要重新绘制的话，你可以考虑使用Navigation组件来实现，毕竟通过Navgation组件真的很方便帮助我们切换导航，而且虽然布局会重新绘制...，但是Google的官方Demo–SunFlower还是使用了这种方式，所以这里面我觉得：官方推荐我们使用Jetpack组件中的ViewModel、LiveData…等，可以发现SunFlowerdemo
作者 / 开发者关系工程师 Jeremy Walker 在今年的 Google I/O 大会 上，我们宣布将 Jetpack Compose 的优秀特性引入 Wear OS。...除此之外，您在使用 Jetpack Compose 构建移动应用的经验，也可以直接运用在 Wear OS 版本上。...就像在移动设备上一样，欢迎您立即着手测试，我们也希望在发布 Beta 版前，将您的 反馈 纳入库的早期迭代中。 本文将回顾我们构建的几个主要可组合项，并介绍帮助您开始使用的多种资源。 现在就开始吧！...Scaffold Scaffold 提供了布局结构，以帮助您像移动设备一样，用常见模式排列屏幕，但并非应用栏、悬浮操作按钮 (FAB) 或抽屉式导航栏等模式。...Scaffold 可支持 Wear 专属布局，并提供时间、曲线文本样式及滚动/位置指示器等顶层组件。
因此，Jetpack提供了一个名为Navigation的组件，旨在方便开发者管理Fragment页面和Appbar。...相比之前Fragment的管理需要借助FragmentManager和FragmentTransaction，使用Navigation组件有如下一些优点： 可视化的页面导航图，方便我们理清页面之间的关系...通过destination和action完成页面间的导航 方便添加页面切换动画 页面间类型安全的参数传递 通过Navigation UI类，对菜单/底部导航/抽屉蓝菜单导航进行统一的管理 支持深层链接...[在这里插入图片描述] 参考： Android Jetpack架构组件(四)之LiveData Android Jetpack架构组件(三)之ViewModel Android Jetpack架构组件(...二)之Lifecycle Android Jetpack架构组件(一)与AndroidX
本文将以创建一个 Confirmation 组件来说明，如何在 React 中如何实现测试驱动开发。...确保渲染测试 第一个测试相当抽象。仅仅需要检查组件是否展现(任何东西) ，以确保这个组件是存在。但是实际上，我将要测试的组件还不存在。...动态问题测试 这个问题也是动态的，这样它就可以从组件外部传入。...现在我们得到了我们想要的组件渲染的 HTML ，现在我想要确保我可以从外部传递这个组件的按钮的回调函数，并确保它们在单击按钮时被调用。...image.png 未来可能会出一些文章关于测试的文章。例如： 如何出测试 react hooks ？ 如何测试 react 路由？ 如何测试接口？
本文将以创建一个 Confirmation 组件来说明，如何在 React 中如何实现测试驱动开发。...确保渲染测试 第一个测试相当抽象。仅仅需要检查组件是否展现(任何东西) ，以确保这个组件是存在。但是实际上，我将测试的组件还不存在。...动态问题测试 这个问题也是动态的，这样它就可以从组件外部传入。...现在我们得到了我们想要的组件渲染的 HTML ，现在我想要确保我可以从外部传递这个组件的按钮的回调函数，并确保它们在单击按钮时被调用。...未来可能会出一些文章关于测试的文章。例如： 如何出测试 react hooks ？ 如何测试react 路由？ 如何测试接口？
Hi , :) 世界很大，也很小，组件很多，也很少。 关于开发中常见的状态页组件，我们已经见了很多，但是在 JetPack Compose 中该如何去写呢？...本篇要解决的就是如何定制一个符合 实际开发 的状态页工具，并分析具体原理与设计思路。...看完基本条件，其实也都不难，在 View 中设计一个状态页组件，大家都知道怎么做，但是 Compose 呢？ 那么我们下面就开始构思一下，如何设计这个状态页组件 StateX。...而在 compose 中，重组会执行所有调用的地方，并判断是否需要执行，我们必须要考虑如何避免重复的重组。...一切就是这么简单，在 compose 中如何使用状态页，已经分享大家了，至于大家要怎么改，可以参考 StateX 。
引言 世界很大，也很小，组件很多，也很少。 关于开发中常见的状态页组件，我们已经见了很多，但是在 JetPack Compose 中该如何去写呢？...本篇要解决的就是如何定制一个符合 实际开发 的状态页工具，并分析具体原理与设计思路。...那么我们下面就开始构思一下，如何设计这个状态页组件 StateX。 基本思路 其实只要写过 compose 的代码，应该都明白，其实更简单了。...而在 compose 中，重组会执行所有调用的地方，并判断是否需要执行，我们必须要考虑如何避免重复的重组。...一切就是这么简单，在 compose 中如何使用状态页，已经分享大家了，至于大家要怎么改，可以参考 StateX 。
Tech 导读 本文主要介绍了组件库的意义，并列举了一些常见的组件库框架选型，重点讲述了组件库如何从0开始搭建的过程以及如何发布到npm私服，最后讲述了在具体项目中如何引用组件库的几种方法，...从设计稿出发，提升页面搭建效率，亟需解决的核心问题有： 首先组件库可以帮助降本提效，其次可以保持视觉风格统一以及交互一致，可以快速构建使用场景，便于多个项目后续迭代升级 。...5.naive-ui - 宝藏 Vue UI 库，Vue UI 新星，从 Vue 3 起步。 6.vant - 有赞团队开源移动 UI 组件库，全面支持 Vue 3。...生成压缩包 npm pack # 在项目中安装测试包 npm install 压缩包的绝对路径（例如：/Users/用户名/work/XXX/XXX.0.tgz） 3.5 如何发布到公司npm或者npm...官网 为了让研发测试阶段和线上的数据安全隔离，预发和线上的数据是隔离的，在预发环境测试验证OK后，配置数据再同步到线上。
领取专属 10元无门槛券
手把手带您无忧上云
