1# ArkUI使用导航组件指南文档示例 2 3### 介绍 4 5本示例通过使用[ArkUI指南文档](https://gitee.com/openharmony/docs/tree/master/zh-cn/application-dev/ui)中各场景的开发示例，展示在工程中，帮助开发者更好地理解ArkUI提供的组件及组件属性并合理使用。该工程中展示的代码详细描述可查如下链接： 6 71. [Navigation](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-basic-components-navigation.md)。 82. [NavDestination](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-basic-components-navdestination.md)。 93. [无感监听](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/js-apis-arkui-observer.md)。 104. [SideBarContainer](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-container-sidebarcontainer.md) 115. [NavPathStack派生类](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-custom-component-api.md) 126. [Router](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/js-apis-router.md) 137. [Stepper](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-basic-components-stepper.md) 14 15### 效果预览 16 17| 首页 | 18|------------------------------------| 19|  | 20 21### 使用说明 22 231. 在主界面，可以点击对应卡片，选择需要参考的组件示例。 24 252. 在组件目录选择详细的示例参考。 26 273. 进入示例界面，查看参考示例。 28 294. 通过自动测试框架可进行测试及维护。 30 31### 工程目录 32``` 33entry/src/main/ets/ 34|---entryability 35|---pages 36| |---navDestination // NavDestination 37| | |---template1 38| | | |---Index.ets 39| | |---template2 40| | | |---Index.ets 41| | |---template3 42| | | |---Index.ets 43| | |---template4 44| | | |---Index.ets 45| |---navigation // Navigation 46| | |---template1 47| | | |---Index.ets 48| | |---template2 49| | | |---Index.ets 50| | |---template3 51| | | |---Index.ets 52| | |---template4 53| | | |---Index.ets 54| | |---template5 55| | | |---Index.ets 56| | |---template6 57| | | |---Index.ets 58| | |---template7 59| | | |---Index.ets 60| | |---template8 61| | | |---Index.ets 62| | |---template9 63| | | |---Index.ets 64| | |---template10 65| | | |---Index.ets 66| | |---template11 67| | | |---Index.ets 68| | |---template12 69| | | |---Index.ets 70| | |---template13 71| | | |---Index.ets 72| |---navPathStackExtend // NavPathStack派生类 73| | |---template1 74| | | |---Index.ets 75| |---observer // 无感监听 76| | |---template1 77| | | |---Index.ets 78| | |---template2 79| | | |---Index.ets 80| | |---template3 81| | | |---Index.ets 82| | |---template4 83| | | |---Index.ets 84| |---router // Router 85| | |---template1 86| | | |---Index.ets 87| |---sideBarContainer // SideBarContainer 88| | |---template1 89| | | |---Index.ets 90| |---stepper // Stepper 91| | |---template1 92| | | |---Index.ets 93|---pages 94| |---Index.ets // 应用主页面 95entry/src/ohosTest/ 96|---ets 97| |---test 98| | |---NavDestination.test.ets // NavDestination示例代码测试代码 99| | |---Navigation.test.ets // Navigation示例代码测试代码 100| | |---QueryNavDestinationInfo.test.ets // NavPathStack派生类示例代码测试代码 101| | |---Router.test.ets // Router示例代码测试代码 102| | |---SideBarContainer.test.ets // SideBarContainer示例代码测试代码 103| | |---Stepper.test.ets // Stepper示例代码测试代码 104| | |---UiObserver.test.ets // 无感监听示例代码测试代码 105``` 106 107### 相关权限 108 109不涉及。 110 111### 依赖 112 113不涉及。 114 115### 约束与限制 116 1171.本示例仅支持标准系统上运行, 支持设备：RK3568。 118 1192.本示例为Stage模型，支持API18版本SDK，版本号：5.1.0.56，镜像版本号：OpenHarmony_5.1.0.56。 120 1213.本示例需要使用DevEco Studio 6.0.0 Canary1 (Build Version: 6.0.0.270， built on May 9, 2025)及以上版本才可编译运行。 122 123### 下载 124 125如需单独下载本工程，执行如下命令： 126 127```` 128git init 129git config core.sparsecheckout true 130echo code/DocsSample/ArkUIDocSample/Navigation > .git/info/sparse-checkout 131git remote add origin https://gitee.com/openharmony/applications_app_samples.git 132git pull origin master 133````
