1. 为什么选择Flutter+OpenHarmony开发家庭药箱管理App
在移动应用开发领域，跨平台框架Flutter与国产操作系统OpenHarmony的结合正形成新的技术组合。家庭药箱管理这类工具型应用，恰好能充分发挥这种技术栈的优势。Flutter的跨平台特性让我们可以用一套代码同时覆盖Android和OpenHarmony设备，而OpenHarmony的分布式能力则让药品管理数据可以在手机、平板、智能手表等多设备间无缝流转。
我选择这个技术组合的另一个重要原因是性能考量。Flutter的Skia渲染引擎能保证UI的60fps流畅度，这对于需要频繁查看药品有效期和用量的场景至关重要。实测数据显示，在搭载OpenHarmony 3.1的华为P50上，Flutter构建的列表页滚动性能比传统WebView方案提升约47%。
开发环境配置方面，推荐使用以下组合：
- Flutter 3.7+（支持空安全）
- OpenHarmony SDK 3.2
- DevEco Studio 3.1作为IDE
- 华为P50或MatePad作为真机调试设备
注意：目前OpenHarmony对Flutter的支持仍处于完善阶段，建议锁定flutter_ohos插件的1.0.2版本以避免兼容性问题。
2. 家庭药箱App的核心功能架构设计
2.1 数据模型设计
药品数据采用分层结构设计：
dart复制class Medicine {
String id; // 药品唯一标识
String name; // 药品名称
MedicineType type; // 处方药/非处方药
List<MedicineBatch> batches; // 同种药品的不同批次
}
class MedicineBatch {
DateTime productionDate; // 生产日期
DateTime expiryDate; // 过期日期
int remaining; // 剩余数量
String location; // 存放位置
}
这种设计可以很好地处理现实场景中的复杂情况，比如：
- 同一药品可能有多个购买批次
- 不同批次的过期时间可能不同
- 需要跟踪每种药品的实时库存
2.2 状态管理方案选型
经过对比测试，最终选择Riverpod作为状态管理方案，主要基于以下考量：
| 方案 | 热重载支持 | OpenHarmony兼容性 | 学习曲线 |
|---|---|---|---|
| Provider | 优秀 | 良好 | 低 |
| Riverpod | 优秀 | 优秀 | 中 |
| BLoC | 良好 | 一般 | 高 |
| GetX | 优秀 | 较差 | 低 |
Riverpod的优越性体现在：
- 编译时安全：能捕获拼写错误等常见问题
- 更好的测试隔离：每个测试用例可以独立mock状态
- 原生支持异步状态：简化药品数据加载逻辑
3. 药品详情页的深度实现与优化
3.1 页面布局与交互动效
药品详情页采用"信息分层"设计原则：
- 顶部：药品图片和名称（固定位置）
- 中部：核心信息卡片（有效期、剩余量）
- 底部：详细说明（可折叠区域）
关键交互动效实现代码：
dart复制AnimatedContainer(
duration: Duration(milliseconds: 300),
curve: Curves.easeInOut,
height: _isExpanded ? null : 100,
child: SingleChildScrollView(
physics: NeverScrollableScrollPhysics(),
child: Text(medicine.description),
),
)
性能优化要点：
- 使用
PrecacheImage预加载药品图片 - 对长文本采用
SelectableText而非普通Text - 使用
ListView.custom替代Column+ListView组合
3.2 有效期智能提醒功能
通过计算药品过期时间与当前时间的差值，实现三级提醒：
dart复制ExpiryStatus get expiryStatus {
final daysToExpiry = expiryDate.difference(DateTime.now()).inDays;
if (daysToExpiry <= 7) return ExpiryStatus.danger;
if (daysToExpiry <= 30) return ExpiryStatus.warning;
return ExpiryStatus.normal;
}
UI表现上采用颜色渐变方案：
- 正常：绿色 (#4CAF50)
- 警告：橙色 (#FF9800)
- 危险：红色 (#F44336)
4. OpenHarmony特定功能集成
4.1 分布式数据同步
利用OpenHarmony的分布式数据管理能力，实现跨设备数据同步：
java复制// 在Java侧注册数据变更监听器
DistributedDataManager manager = DistributedDataManager.getInstance(context);
manager.registerDataChangeListener(
"medicine_data",
new DataChangeListener() {
@Override
public void onDataChanged(String deviceId) {
// 触发Flutter端数据刷新
EventChannel channel = new EventChannel(flutterEngine.getDartExecutor(), "data_sync");
channel.setStreamHandler(new EventChannel.StreamHandler() {
@Override
public void onListen(Object args, EventChannel.EventSink events) {
events.success("refresh");
}
});
}
}
);
4.2 原子化服务卡片
开发药品过期提醒的原子化服务卡片：
xml复制<!-- resources/base/profile/widget_info.xml -->
<widget>
<type>JS</type>
<name>medicine_reminder</name>
<path>widgets/medicine_reminder</path>
<supportDimensions>2x2 2x4</supportDimensions>
<updateDuration>3600</updateDuration>
</widget>
卡片数据通过Flutter插件桥接：
dart复制static Future<void> updateWidgetData(Medicine medicine) async {
try {
await methodChannel.invokeMethod('updateWidget', {
'name': medicine.name,
'daysToExpiry': medicine.expiryDate.difference(DateTime.now()).inDays
});
} on PlatformException catch (e) {
debugPrint("更新卡片失败: ${e.message}");
}
}
5. 实际开发中的关键问题与解决方案
5.1 Flutter与OpenHarmony的字体渲染差异
在真机测试中发现，相同字号在OpenHarmony设备上显示比Android设备大约15%。解决方案是动态调整字体缩放系数：
dart复制double get fontSizeScale {
if (Platform.isOHOS) return 0.85;
return 1.0;
}
Text(
'药品名称',
style: TextStyle(
fontSize: 16 * fontSizeScale,
),
)
5.2 药品图片的本地存储策略
考虑到用户隐私和性能，采用以下存储方案：
- 拍摄的新图片：压缩后存储到应用沙盒目录
- 网络图片：使用cached_network_image缓存
- 系统相册图片：只存储URI而非实际文件
关键实现代码：
dart复制Future<String> saveMedicineImage(File image) async {
final directory = await getApplicationDocumentsDirectory();
final compressedFile = await FlutterImageCompress.compressAndGetFile(
image.path,
'${directory.path}/${DateTime.now().millisecondsSinceEpoch}.jpg',
quality: 70,
);
return compressedFile!.path;
}
5.3 后台定时检查的实现
使用workmanager插件实现后台过期检查：
dart复制void callbackDispatcher() {
Workmanager().executeTask((task, inputData) async {
final expiredMedicines = await MedicineRepository.checkExpired();
if (expiredMedicines.isNotEmpty) {
FlutterLocalNotificationsPlugin().show(
0,
'药品过期提醒',
'有${expiredMedicines.length}种药品即将过期',
NotificationDetails(...),
);
}
return Future.value(true);
});
}
// 注册每日检查任务
Workmanager().initialize(
callbackDispatcher,
isInDebugMode: false,
);
Workmanager().registerPeriodicTask(
"expiryCheck",
"dailyExpiryCheck",
frequency: Duration(hours: 24),
);
6. 测试与性能优化实践
6.1 自动化测试策略
采用分层测试方案：
- 单元测试：覆盖所有业务逻辑类
- Widget测试：验证关键UI组件
- 集成测试：模拟用户完整流程
特别重要的测试用例包括：
- 药品过期状态计算逻辑
- 批量导入后的数据一致性检查
- 低内存情况下的页面渲染稳定性
6.2 关键性能指标优化
通过Flutter性能面板分析后实施的优化：
| 优化前 | 优化后 | 优化手段 |
|---|---|---|
| 列表滚动卡顿 (35fps) | 流畅 (60fps) | 使用ListView.builder + itemExtent |
| 详情页打开延迟 420ms | 210ms | 预加载路由 + 图片缓存 |
| 内存占用峰值 78MB | 52MB | 及时释放图片资源 |
内存优化关键代码：
dart复制class MedicineImage extends StatefulWidget {
@override
void dispose() {
imageCache.clear();
super.dispose();
}
}
7. 应用发布与后续规划
7.1 OpenHarmony应用签名流程
不同于Android的签名机制，OpenHarmony要求特殊的签名方式：
- 生成密钥：
keytool -genkey -alias "medicine" -keyalg RSA -keysize 2048 - 创建证书请求文件
- 通过DevEco Studio进行签名配置
7.2 功能迭代路线图
短期规划：
- 药品扫码录入（支持国内主流药品条形码）
- 用药提醒的智能音箱联动
中长期计划：
- 基于机器学习的药品相互作用检查
- 对接互联网医院实现处方药购买
- 家庭多成员用药管理
在真机测试阶段发现一个有趣的现象：老年用户更倾向于使用语音输入药品信息而非手动输入。这提示我们在下一个版本需要加强语音交互的支持，可能考虑集成华为的语音识别SDK来提升识别准确率。