HarmonyOSNEXT实战:搭建模块化项目架构，附完整代码仓

搭建模块化项目架构

情况以及工程目次

1. **当前适配版本为 5.0.0(12)**
3. ## 环境
4. - [点击下载最新IDE](https://developer.huawei.com/consumer/cn/download/)
5. - DevEco Studio 5.0.1 Beta3
6.     - Build Version: 5.0.5.200, built on November 9, 2024
7. - Harmony OS Api 5.0.0(12)
8. - hvigor 5.0.0
10. ### 工程目录
12.    commons                                         # 公共能力层，包括公共UI组件、数据管理、通信和工具库等
13.    |---network                                    // 网络相关
14.    |---uicomponents                               // 公共组件相关
15.    |---utils                                      // 基础工具类、基础资源相关
16.    features                                       # 基础特性层，包含独立的业务模块，如启动页、登录模块等              
17.    |---home                                       // 首页
18.    |   |---bean                                   // 数据模型
19.    |   |---components                             // 自定义组件
20.    |   |---constants                              // 常量
21.    |   |---model                                  // 业务模型
22.    |   |---service                                // 业务服务/接口
23.    |   |---views                                  // 视图层
24.    |   |---utils                                  // 此模块工具类 需要再加   
25.    |---login                                      // 登录
26.    |---question                                   // 问答
27.    |---scheme                                     // 体系
28.    |---mine                                       // 我的
29.    |---login                                      // 登录
30.    libs                                           # 本地三方依赖库
31.    products                                       # 产品定制层，作为不同设备或场景应用入口，例如phone、tv等
32.    |---phone                                      // 手机
33.    |   |---app                                    // 全局初始化配置
34.    |   |---bean                                   // 数据模型
35.    |   |---components                             // 自定义组件
36.    |   |---constants                              // 常量
37.    |   |---model                                  // 业务模型
38.    |   |---pages                                  // 页面
39.    |   |---service                                // 业务服务/接口
40.    |   |---test                                   // 测试某个效果的例子
43. ## 产品层目录参考
45. 
47. ## 后期迭代各种APP分支规则,(全是仿照)
48. - 基于 master分支开发，APP都在**case**分支下
49. - 新建APP命名规则：case/APP名字。
50. - 目前分支：
52.   |---case/wanandroid    打造鸿蒙版玩安卓APP，参考项目：https://github.com/goweii/WanAndroid
53.   |---case/
57. ## 开源协议
59. 本项目基于 [Apache License](https://gitee.com/jiaojiaoone/explore-harmony-next/blob/master/LICENSE.txt) ，请自由地享受和参与开源。
61. ## 源码
63. - gitee：https://gitee.com/jiaojiaoone/explore-harmony-next.git
64. - github：https://github.com/JasonYinH/ExploreHarmonyNext.git
66. ## 博客地址
68. - csdn：https://blog.csdn.net/qq_40533422?type=blog
69. - juejin: https://juejin.cn/user/1151943919282350/posts
71. ## 交流
73. 使用有疑问或建议， **请提交issue（这样可以统一收集问题，方便更多人查阅，另外会也第一时间回复处理）**

复制代码

部门代码如下

1. import { Route, ZRouter } from "@hzw/zrouter"
2. import { AppUtil, ToastUtil } from "@pura/harmony-utils"
3. import { HomeView } from "home"
4. import { MineView } from "mine"
5. import { QuestionView } from "question"
6. import { SchemeView } from "scheme"
7. import { TabModel } from "uicomponents"
8. import { CommonConst, NavName } from "utils"
9. import { tabBarModel } from "../model/MainModel"
11. /**
12. * Author:J
13. * Describe: 主页
14. */
15. // 定义一个状态变量来记录上次点击返回键的时间
16. let lastBackPressedTime = 0
18. @Preview
19. @ComponentV2
20. @Route({ name: NavName.MAIN_PAGE })
21. export struct MainPage {
22.   @Local selectedIndex: number = 0 // 当前选中的tab下标
23.   @Local msgCount: number = 9 // 消息数量
24.   //存储页面状态
25.   @Local tabContentArr: boolean[] = [true, false, false, false]
27.   aboutToAppear(): void {
28.     console.log(`xxx ： ---` + 'MainPage')
29.     console.log(`xxx获取参数 ： ---` + ZRouter.getInstance().getParamByName(NavName.MAIN_PAGE))
31.   }
33.   build() {
34.     NavDestination() {
35.       Stack() {
36.         Tabs({ index: this.selectedIndex, barPosition: BarPosition.End }) {
37.           ForEach(tabBarModel, (item: TabModel, index: number) => {
38.             TabContent() {
39.               if (this.selectedIndex === index || this.tabContentArr[index]) {
40.                 this.tabContentBuilder(item)
41.               }
42.             }.tabBar(this.tabBottom(tabBarModel[item.index], item.index))
43.           }, (item: string) => item)
45.         }.barWidth(CommonConst.FULL_PARENT)
46.         .barHeight(56) //设置导航栏高度
47.         .scrollable(false) // 禁止左右滑动
48.         .onChange((index: number) => {
49.           this.selectedIndex = index;
50.           this.tabContentArr[index] = true;
51.         })
52.       }.width(CommonConst.FULL_PARENT)
53.       .height(CommonConst.FULL_PARENT)
54.     }.hideTitleBar(true)
55.     .width(CommonConst.FULL_PARENT)
56.     .height(CommonConst.FULL_PARENT)
57.     .onBackPressed(() => {
58.       const currentTime = new Date().getTime()
59.       const timeDifference = currentTime - lastBackPressedTime
60.       if (timeDifference < 2000) { // 2秒内再次点击
61.         //退出应用
62.         AppUtil.exit()
63.       } else {
64.         // 提示用户
65.         ToastUtil.showToast('再按一次退出应用')
66.         lastBackPressedTime = currentTime
67.       }
69.       return true
70.     })
72.   }
74.   @Builder
75.   tabContentBuilder(item: TabModel) {
76.     if (item.index == 0) {
77.       // 首页
78.       HomeView()
79.     } else if (item.index == 1) {
80.       // 问答
81.       QuestionView()
82.     } else if (item.index == 2) {
83.       // 体系
84.       SchemeView()
85.     } else if (item.index == 3) {
86.       // 我的
87.       MineView()
88.     }
90.   }
92.   @Builder
93.   tabBottom(item: TabModel, index: number) {
94.     Column() {
95.       Divider().color($r('app.color.color_F0F0F0'))
96.       Badge({
97.         count: index != 1 ? 0 : this.msgCount,
98.         position: BadgePosition.RightTop,
99.         style: {
100.           fontSize: 8,
101.           badgeSize: 13
102.         }
103.       }) {
104.         Image(item.selectImage /*this.selectedIndex == index ? item.selectImage : item.unSelectImage*/)
105.           .colorBlend(this.selectedIndex == index ? $r('app.color.colorPrimary') : $r('app.color.color_222222'))
106.           .height(24)
107.           .margin(4)
108.       }.margin({ top: 4 })
110.       Text(item.title)
111.         .width(CommonConst.FULL_PARENT)
112.         .fontSize(14)
113.         .fontWeight(500)
114.         .textAlign(TextAlign.Center)
115.         .fontColor(this.selectedIndex == index ? $r('app.color.colorPrimary') : $r('app.color.color_222222'))
116.         .margin({ bottom: 4 })
117.     }
118.     .width(CommonConst.FULL_PARENT)
119.     .height(CommonConst.FULL_PARENT)
120.     .backgroundColor($r('app.color.white'))
122.   }
123. }

复制代码

相关文章如下

• 《探索 HarmonyOS NEXT(5.0)：开启构建模块化项目架构奇幻之旅 —— 模块化根本篇》
  
• 《探索 HarmonyOS NEXT(5.0)：开启构建模块化项目架构奇幻之旅 —— 构建根本特性层》
  
• 《探索 HarmonyOS NEXT(5.0)：开启构建模块化项目架构奇幻之旅 —— 构建公共本领层》
  

想要完整代码点击下方代码仓查看

1. ## 源码
3. - gitee：https://gitee.com/jiaojiaoone/explore-harmony-next.git
4. - github：https://github.com/JasonYinH/ExploreHarmonyNext.git
6. ## 博客地址
8. - csdn：https://blog.csdn.net/qq_40533422?type=blog
9. - juejin: https://juejin.cn/user/1151943919282350/posts

复制代码

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。