HarmonyOS Navigation：开启流畅交互新体验-优快云博客

在 HarmonyOS 的开发世界里，Navigation 就像是一个城市的交通枢纽，是构建应用程序页面导航和路由功能的核心组件，在整个应用开发架构中占据着举足轻重的地位。它为开发者提供了一套强大且灵活的机制，用以管理应用内页面之间的跳转、参数传递以及页面栈的维护。无论是简单的单页面应用，还是复杂的多模块大型应用，Navigation 都能游刃有余地发挥作用，确保用户在应用中的操作流畅、自然，就像在城市中沿着清晰的道路指示牌，轻松抵达各个目的地一样。接下来，就让我们深入探索 HarmonyOS Navigation 的奥秘。

二、Navigation 功能全解析

（一）页面显示模式

Navigation 支持三种页面显示模式，以适应不同的设备屏幕尺寸和用户交互需求。

自适应模式：这是 Navigation 的默认模式（mode 属性为 NavigationMode.Auto）。在这种模式下，当页面宽度大于等于一定阈值（API version 9 及以前为 520vp，API version 10 及以后为 600vp ）时，组件会自动采用分栏模式，以充分利用屏幕空间，展示更多的信息；而当页面宽度小于该阈值时，则采用单栏模式，确保内容在小屏幕上也能清晰呈现，为用户提供简洁、舒适的浏览体验。这种自适应能力使得应用能够在手机、平板、折叠屏等多种设备上完美运行，无需开发者针对不同设备进行繁琐的布局调整。

单页面模式：将 mode 属性设置为 NavigationMode.Stack，即可启用单页面显示模式。在这种模式下，每次页面跳转都会覆盖当前页面，就像在一本厚厚的书中，每翻开新的一页，旧的页面就被完全遮盖。这种模式适用于强调内容的独立性和专注性的场景，比如新闻详情页、文章阅读页等，用户可以全身心地沉浸在当前页面的内容中，不受其他页面的干扰。

分栏模式：把 mode 属性设置为 NavigationMode.Split，便能切换到分栏显示模式。此时，页面会被分为两栏或多栏，常见的应用场景如文件管理器，左侧栏展示文件目录结构，右侧栏显示对应目录下的文件列表，用户可以在同一屏幕上快速进行文件的定位和操作；又如邮件客户端，一边显示邮件列表，另一边展示选中邮件的具体内容，大大提高了信息的获取效率和操作的便捷性。

（二）标题栏模式

标题栏位于界面顶部，是用户进入页面时首先映入眼帘的部分，Navigation 提供了两种主要的标题栏模式，以满足不同的设计和功能需求。

Mini 模式：这是一种普通型标题栏，适用于一级页面不需要突出标题的场景。Mini 模式下的标题栏通常较为简洁，占用屏幕空间较少，仅包含必要的操作入口，如返回按钮、菜单按钮等，将更多的屏幕区域留给内容展示。在一些工具类应用中，用户更关注的是工具的使用和操作结果，标题的突出显示并非必要，此时 Mini 模式就能很好地平衡界面的简洁性和功能性。

Full 模式：即强调型标题栏，用于一级页面需要突出标题的场景。Full 模式下，标题会更加醒目，字体更大，样式更加丰富，可能还会包含副标题、装饰元素等，以吸引用户的注意力，明确页面的主题和功能。在新闻类应用的首页，不同板块的标题采用 Full 模式，能够让用户快速了解各个板块的内容，方便用户选择感兴趣的新闻进行阅读。

（三）菜单栏与工具栏设置

菜单栏设置：菜单栏位于 Navigation 组件的右上角，是用户进行一些常用操作的便捷入口。开发者可以通过 menus 属性对其进行设置，menus 支持 Array和 CustomBuilder 两种参数类型。当使用 Array类型时，竖屏最多支持显示 3 个图标，横屏最多支持显示 5 个图标，多余的图标会被放入自动生成的 “更多” 图标中。在一个图片编辑应用中，菜单栏可以设置 “保存”“分享”“编辑” 等图标，用户点击相应图标即可快速执行对应的操作，大大提高了操作效率和用户体验。

工具栏设置：工具栏位于 Navigation 组件的底部，为用户提供了另一种操作方式。开发者可通过 toolbarConfiguration 属性进行设置，定义工具栏上的按钮、图标和相关操作。以音乐播放应用为例，工具栏可以设置 “播放 / 暂停”“上一曲”“下一曲”“音量调节” 等按钮，用户在操作过程中无需在复杂的界面中寻找这些常用功能，直接在底部工具栏即可完成操作，提升了用户操作的便捷性和流畅性。

（四）强大的路由操作

路由操作是 Navigation 的核心功能之一，它负责管理应用内页面之间的跳转、参数传递以及页面栈的维护，就像一位经验丰富的交通调度员，确保页面跳转的顺畅和高效。Navigation 路由相关的操作都是基于页面栈 NavPathStack 提供的方法进行，每个 Navigation 都需要创建并传入一个 NavPathStack 对象，用于管理页面。

页面跳转：使用 pushPath 或 pushPathByName 方法可以打开一个新页面。pushPath 通过指定页面的名称进行跳转，同时还可以携带参数，方便在新页面中使用；pushPathByName 则是通过页面的别名进行跳转，同样支持参数传递。在一个电商应用中，当用户点击商品列表中的某一商品时，就可以使用 pushPathByName 方法跳转到商品详情页，并将商品的 ID、名称、价格等参数传递过去，以便在商品详情页中展示相应的商品信息。