HarmonyOS 鸿蒙Next官方模板优秀案例（第9期：工具行业 · 综合工具）

HarmonyOS 鸿蒙Next官方模板优秀案例（第9期：工具行业 · 综合工具） 💡 鸿蒙生态为开发者提供海量的HarmonyOS模板/组件，助力开发效率原地起飞 💡

★ 一键直达生态市场组件&模板市场 , 快速应用DevEco Studio插件市场集成组件&模板 ★

工具应用中有一款“六边形选手”，可以提供计算、笔记、记账、日历等生活中高频服务

本期为您介绍综合工具类应用的开发案例

👉 覆盖20+行业，点击查看往期案例汇总贴，持续更新，点击收藏！一键三连！常看常新！

【第9期】工具行业 · 综合工具

一、概述

1、行业洞察

1）行业诉求：

• 用户获取与留存：用户留存率低，“用完即走”；预装和渠道推广成本高，大部分工具app手机厂商直接开发。
• 跨平台兼容性难：设备碎片化，多系统，需要分别适配；性能问题（启动慢、卡顿、崩溃）；后期维护更新困难。
• 商业化与变现：广告变现效果下降、应用内购买订阅制接受度待提高。
• 数据安全与合规：隐私违规高发、安全漏洞普遍。

2）行业常用三方SDK：

说明：“以上三方库及链接仅为示例，三方库由三方开发者独立提供，以其官方内容为准”

2、案例概览（下载模板）

基于以上行业分析，本期将介绍鸿蒙生态市场工具类行业模板——综合工具应用模板，为行业提供常用功能的开发案例，模板主要分首页、我的两大模块。

• Stage开发模型 + 声明式UI开发范式。
• 分层架构设计 + 组件化拆分，支持开发者在开发时既可以选择完整使用模板，也可以根据需求单独选用其中的业务组件。
• 本模板只需做少量配置和定制即可快速实现数字计算、日期查询、空调遥控、个税计算等功能。

本模板主要页面及核心功能如下所示：

综合工具
 |-- 首页
 |    |-- 顶部操作区
 |    |    |    └-- 工具管理
 |    |-- 计算器
 |    |    └-- 数字计算
 |    |-- 个税计算器
 |    |    └-- 个税计算
 |    |-- 汇率计算器
 |    |    |-- 汇率计算
 |    |-- 热量计算
 |    |    |-- 饮食计划
 |    |    |    └-- 食物搜索
 |    |    |    └-- 食物添加
 |    |-- 日期计算
 |    |    |-- 日期间隔
 |    |    |-- 日期计算
 |    |-- 黄历
 |    |    |-- 黄历查看
 |    |-- 万能空调遥控器
 |    |    |-- 遥控器列表
 |    |-- 房贷计算器
 |    |    |-- 房贷计算
 |    |-- 科学计算器
 |    |    └-- 科学计算
 |    |-- 倒计日
 |    |    └-- 倒计日列表
 |    |-- 记账
 |    |    └-- 账单统计
 |    |-- 隐私笔记
 |    |    └-- 添加笔记
 |    |-- 图片水印
 |    |    └-- 编辑水印
 |    |    └-- 历史记录
 |    |-- 手机NFC
 |    |    └-- 读取门禁卡
 |    |    └-- 读取公交卡
 |    |    └-- 读取银行卡
 |    |    └-- 克隆卡片
 |    |-- 敲木鱼
 └-- 我的
      |-- 问题反馈
      |    └-- 提交反馈
      |-- 用户协议
      └-- 隐私政策

二、应用架构设计

1、分层模块化设计

• 产品定制层： 专注于满足不同设备或使用场景的个性化需求，作为应用的入口，是用户直接互动的界面。

  • 本实践暂时只支持直板机，为单HAP包形式，包含路由根节点、底部导航栏等。

• 基础特性层： 用于存放相对独立的功能UI和业务逻辑实现。

  • 本实践的基础特性层将应用底部导航栏的每个选项拆分成一个独立的业务功能模块。
  • 每个功能模块都具备高内聚、低耦合、可定制的特点，支持产品的灵活部署。

• 公共能力层： 存放公共能力，包括公共UI组件、数据管理、外部交互和工具库等共享功能。

  • 本实践的公共能力层分为公共基础能力和可分可合组件，均打包为HAR包被上层业务组件引用。
  • 公共基础能力包含日志、文件处理等工具类，公共类型定义，网络库，以及弹窗、加载等公共组件。
  • 可分可合组件将包含行业特点、可完全自闭环的能力抽出独立的组件模块，支持开发者在开发中单独集成使用，详见业务组件设计章节。

2、业务组件设计

为支持开发者单独获取特定场景的页面和功能，本模板将功能完全自闭环的部分能力抽离出独立的行业组件模块，不依赖公共基础能力包，开发者可以单独集成，开箱即用，降低使用难度。

三、行业场景技术方案

1、万能空调遥控器

1）场景说明

• 点击空调遥控器的开关按钮，通过空调是否有响应确定是否添加设备。
• 添加完成后，在空调遥控器页面通过发送不同电平信号控制空调行为。

2）技术方案

• 红外信号发送

通过[@ohos.multimodalInput.infraredEmitter (红外管理)](https://developer.huawei.com/consumer/cn/doc/harmonyos-references/js-apis-infraredemitter#infraredemittertransmitinfrared15)发送红外信号控制空调，且遥控按钮按下时发送当前遥控器所有设置信息，例如：按下开关按钮时，红外电平信号中包含“on，送风，26摄氏度，制冷”等信息。

2、热量计算

1）场景说明

• 点击搜索结果可自定义输入食物的摄入量，精准控制摄入热量。

2）技术方案

• 用餐时间自定义：通过Select的menuItemContentModifier属性自定义用餐时间下拉菜单的内容，细分用餐时间。
• 通过Text、Image组件在Grid组件中的混编实现自定义键盘。

3、工具管理

1）场景说明

• 长按工具卡片并拖拽可以调整工具在首页展示的顺序，并且可以对工具进行自动分类。
• 点击“默认打开”下拉菜单，并选择某个工具，清理应用后下次打开会默认打开所选工具。

2）技术方案

• 首页菜单持久化存储

  • 使用PersistenceV2实现对首页工具卡片的持久化数据管理，并对各分类工具卡片进行单独存储。

• 首页菜单持久化存储

  • 配合Grid组件的editMode属性、onItemDragStart事件和onItemDrop事件实现对工具卡片的拖拽。

四、模板代码

1、工程结构（下载模板）

详细代码结构如下所示：

ComprehensiveTool
  |- components                                            // 可分可合组件层
  |   |- almanac/src/main/ets                              // 黄历(har)
  |   |    |- apis                                         // 模块接口
  |   |    |- constants                                    // 模块常量     
  |   |    |- components                                   // 公共组件
  |   |    |- model                                        // 模型定义  
  |   |    |- pages                                        // 页面
  |   |    |- style                                        // 模块样式
  |   |    |- utils                                        // 模块工具
  |   |    |- viewmodel                                    // 与页面一一对应的vm层           
  |   |    
  |   |- basic_calculator/src/main/ets                     // 计算器(har)
  |   |    |- common                                       // 模块常量
  |   |    |- components                                   // 组件
  |   |    |- model                                        // 模型定义 
  |   |    └- pages                                        // 页面
  |   |    └- utils                                        // 模块工具类
  |   |    └- viewmodel                                    // 与页面一一对应的vm层
  |   |                               
  |   |- calories_calculate/src/main/ets                   // 热量计算(har)
  |   |    |- common                                       // 公共路由
  |   |    |- apis                                         // 模块接口
  |   |    |- components                                   // 模块组件
  |   |    |- pages                                        // 页面      
  |   |    |- mocks                                        // mock数据
  |   |    |- model                                        // 模型定义
  |   |    |- viewmodel                                    // 与页面一一对应的vm层
  |   |    └- utils                                        // 模块工具类
  |   |- date_calculate/src/main/ets                       // 日期计算(har)    
  |   |    |- apis                                         // 模块接口
  |   |    |- constants                                    // 模块常量     
  |   |    |- components                                   // 模块组件
  |   |    |- model                                        // 模型定义  
  |   |    |- pages                                        // 页面
  |   |    |- utils                                        // 模块工具
  |   |- exchange_calculator/src/main/ets                  // 汇率计算器(har)
  |   |    |- common                                       // 公共路由
  |   |    |- constants                                    // 模块常量     
  |   |    |- components                                   // 模块组件
  |   |    |- model                                        // 模型定义  
  |   |    |- pages                                        // 页面
  |   |    |- viewmodel                                    // 与页面一一对应的vm层 
  |   |- income_calculator/src/main/ets                    // 个税计算器(har)
  |   |    |- common                                       // 模块常量   
  |   |    |- components                                   // 模块组件
  |   |    |- model                                        // 模型定义  
  |   |    |- pages                                        // 页面
  |   |    |- utils                                        // 模块工具类
  |   |    |- viewmodel                                    //