Flutter for OpenHarmony 实战喝水提醒应用数据持久化与定时任务文章目录Flutter for OpenHarmony 实战喝水提醒应用数据持久化与定时任务前言一、数据持久化系统1.1 SharedPreferences集成1.2 数据保存1.3 数据加载二、定时提醒系统2.1 Timer.periodic使用2.2 提醒显示2.3 定时器管理三、饮水记录管理3.1 记录数据结构3.2 添加记录3.3 记录显示四、UI界面设计4.1 进度显示4.2 快捷按钮4.3 统计信息五、状态管理5.1 状态变量5.2 setState更新六、用户体验优化6.1 即时反馈6.2 持久化保证6.3 友好提示总结欢迎加入开源鸿蒙跨平台社区 开源鸿蒙跨平台开发者社区前言喝水提醒应用的核心功能是帮助用户养成良好的饮水习惯其中数据持久化和定时提醒是两个关键技术点。本文将详细介绍如何使用SharedPreferences实现数据存储如何使用Timer.periodic实现定时提醒以及如何设计直观的UI界面。一、数据持久化系统1.1 SharedPreferences集成首先在pubspec.yaml中添加依赖dependencies:shared_preferences:^2.0.15然后导入并在应用中使用importpackage:shared_preferences/shared_preferences.dart;1.2 数据保存Futurevoid_saveData()async{finalprefsawaitSharedPreferences.getInstance();awaitprefs.setInt(current_water,_currentWater);finalrecordsJson_records.map((record){return${record.amount}|${record.timestamp.toIso8601String()};}).toList();awaitprefs.setStringList(water_records,recordsJson);}将当前饮水量和历史记录保存到本地存储。饮水量使用整数存储记录列表转换为字符串列表存储每条记录格式为数量|时间戳。1.3 数据加载Futurevoid_loadData()async{finalprefsawaitSharedPreferences.getInstance();setState((){_currentWaterprefs.getInt(current_water)??0;finalrecordsJsonprefs.getStringList(water_records);if(recordsJson!null){_recordsrecordsJson.map((json){finalpartsjson.split(|);returnWaterRecord(amount:int.parse(parts[0]),timestamp:DateTime.parse(parts[1]),);}).toList();}});}从本地存储加载数据恢复应用状态。使用??提供默认值确保首次运行时不会出错。二、定时提醒系统2.1 Timer.periodic使用Timer?reminderTimer;void_startReminder(){reminderTimer?.cancel();reminderTimerTimer.periodic(constDuration(minutes:30),(timer){_showReminder();});}每30分钟触发一次提醒。使用Timer.periodic创建周期性任务返回的Timer对象可以用于取消任务。2.2 提醒显示void_showReminder(){if(mounted){ScaffoldMessenger.of(context).showSnackBar(constSnackBar(content:Text(该喝水了),duration:Duration(seconds:3),),);}}使用SnackBar显示提醒信息。mounted检查确保组件仍然挂载避免在组件销毁后显示错误。2.3 定时器管理overridevoiddispose(){reminderTimer?.cancel();super.dispose();}组件销毁时取消定时器防止内存泄漏。三、饮水记录管理3.1 记录数据结构classWaterRecord{finalint amount;finalDateTimetimestamp;WaterRecord({requiredthis.amount,requiredthis.timestamp});}每条记录包含饮水量和时间戳。3.2 添加记录void_addWater(int amount){setState((){_currentWateramount;_records.add(WaterRecord(amount:amount,timestamp:DateTime.now(),));});_saveData();}增加饮水量添加记录并保存到本地存储。3.3 记录显示ListView.builder(itemCount:_records.length,itemBuilder:(context,index){finalrecord_records[index];finalhoursDateTime.now().difference(record.timestamp).inHours;returnListTile(title:Text(${record.amount}ml),subtitle:Text(hours1?刚刚:$hours小时前喝过),);},)使用ListView显示历史记录根据时间差显示友好的时间描述。四、UI界面设计4.1 进度显示CircularProgressIndicator(value:_currentWater/_goal,strokeWidth:10,backgroundColor:Colors.grey.shade200,)使用环形进度条显示当前进度目标为2000ml。4.2 快捷按钮Row(mainAxisAlignment:MainAxisAlignment.spaceEvenly,children:[ElevatedButton(onPressed:()_addWater(200),child:constText(200ml),),ElevatedButton(onPressed:()_addWater(500),child:constText(500ml),),],)提供200ml和500ml两个常用选项方便快速记录。4.3 统计信息Text(今日已喝:$_currentWaterml/$_goalml,style:constTextStyle(fontSize:18,fontWeight:FontWeight.bold),)显示当前饮水量和目标让用户清晰了解进度。五、状态管理5.1 状态变量int _currentWater0;finalint _goal2000;ListWaterRecord_records[];使用简单的状态变量管理应用状态。5.2 setState更新setState((){_currentWateramount;});使用setState触发UI更新这是Flutter中最基本的状态管理方式。六、用户体验优化6.1 即时反馈每次添加饮水后立即更新UI并保存数据给用户即时反馈。6.2 持久化保证每次状态变化都保存到本地确保应用重启后数据不丢失。6.3 友好提示使用SnackBar而不是AlertDialog提醒不会打断用户当前操作。总结本文详细介绍了喝水提醒应用的数据持久化和定时提醒系统。从SharedPreferences的使用到Timer.periodic的应用从数据结构设计到UI界面实现每个技术点都直接影响应用的功能性和用户体验。通过这些技术的综合应用实现了功能完整且实用的喝水提醒应用。