外卖网站建设可行性分析,广州 互联网公司 网站首页,广东建筑人才网招聘信息网,做网站租用数据库Flutter for OpenHarmony 植物养护 App#xff1a;用数字花园培育你的绿色生活 在快节奏的都市生活中#xff0c;一盆绿植不仅是窗台的点缀#xff0c;更是心灵的慰藉。然而#xff0c;“忘记浇水” 或 “过度溺爱” 常常让我们的植物伙伴悄然枯萎。 #x1f310; 加入社…Flutter for OpenHarmony 植物养护 App用数字花园培育你的绿色生活在快节奏的都市生活中一盆绿植不仅是窗台的点缀更是心灵的慰藉。然而“忘记浇水”或“过度溺爱”常常让我们的植物伙伴悄然枯萎。 加入社区 欢迎加入开源鸿蒙跨平台开发者社区获取最新资源与技术支持 开源鸿蒙跨平台开发者社区完整效果一、核心理念让养护变得智能而有温度该 App 围绕三个关键体验构建智能提醒基于浇水间隔自动判断是否“口渴”可视化成长植物图标随生长阶段变化浇水可能触发“成长动画”情感反馈健康状态文字“茁壮成长”、“需浇水” 进度条颜色变化赋予植物“情绪”。技术不应冰冷而应成为连接人与自然的桥梁。二、数据模型会“思考”的Plant类classPlant{finalStringname;finalStringtype;// 观叶/多肉/开花finalint waterInterval;// 浇水周期天finalDateTimelastWatered;finalDateTimeplantedDate;finaldouble growthStage;// 0.0幼苗→ 1.0成熟boolgetneedsWater{...}// 是否需要浇水StringgethealthStatus{...}// 健康状态描述IconDatagetplantIcon{...}// 动态图标}时间感知通过DateTime.now().difference(lastWatered)计算“口渴程度”类型差异化多肉耐旱浇水间隔长达14天开花植物需频繁浇水2-3天生长系统growthStage模拟真实植物生命周期。浇水 ≠ 机械操作每次浇水有50%概率促进生长模拟“精心照料带来回报”的自然法则。三、交互亮点让每一次点击都有意义1.动态植物图标 旋转动画AnimatedSwitcher(transitionBuilder:(child,animation)RotationTransition(...),child:Icon(plant.plantIcon,key:ValueKey(plant.growthStage)),)当growthStage变化时图标自动切换 → → 切换时伴随顺时针旋转动画象征“焕发生机”不同类型使用不同图标local_florist开花/多肉、eco观叶。2.智能浇水按钮常态绿色“浇水”按钮缺水时变为红色“立即浇水”视觉警示点击后弹出 SnackBar“小绿已浇水已成熟”——即时正向反馈。3.浇水进度条时间的可视化LinearProgressIndicator(value:daysSinceWater/waterInterval,color:needsWater?Colors.red:Colors.green,)进度从绿渐变至红直观展示“距离下次浇水还有多久”超过100%时保持红色强调“急需关注”。4.撤销删除Undo Pattern删除植物后Snackbar 提供“撤销”选项避免误删心爱的“仙人球”体现人性化设计。四、细节巧思超越功能的情感化设计✅ 随机生成新植物finalplantNames[薄荷,绿萝,芦荟,...];finaltypes[观叶,多肉,开花];// 自动分配合理浇水间隔点击 FAB 按钮随机添加一株真实存在的植物自动匹配其类型对应的浇水频率如多肉14天开花2天降低使用门槛让用户立刻进入“园丁”角色。✅ 养护小贴士Help Dialog点击 AppBar 的info_outline图标弹出针对不同类型植物的养护建议“观叶避免阳光直射”“多肉宁干勿湿”“开花花期需磷钾肥”底部特别提示“进度条变红时请及时浇水”——强化核心交互逻辑。✅ 健康状态语义化状态条件用户感受需浇水超过浇水间隔紧迫感需立即行动状态良好距离下次浇水 50%安心维持现状茁壮成长刚浇完水成就感被认可 文字比颜色更能传递情感——“茁壮成长”比“健康”更有生命力。五、UI/UX 设计清新治愈的植物美学元素设计说明主色调Colors.green 深绿 AppBar (#2E7D32) —— 自然、专业背景色#FCFDFC—— 接近纸张的米白柔和不刺眼卡片圆角20—— 比常规更大模拟“花盆”轮廓空状态绿色描边圆形 local_florist图标引导明确FAB 按钮绿底白加号符合 Material 规范 整体风格宁静、有机、无干扰让用户专注于植物本身。六、技术实现亮点技术点应用说明AnimatedSwitcherRotationTransition实现图标切换的流畅旋转动画ValueKey(plant.growthStage)确保动画在growthStage变化时触发min(1.0, progress)防止进度条溢出保持 UI 稳定DateTime.now().millisecondsSinceEpoch生成唯一 ID简单可靠copyWith模式安全更新植物状态避免直接修改七、未来扩展方向当前版本已具备完整核心体验可进一步拓展本地持久化使用hive保存植物数据重启不丢失通知提醒集成flutter_local_notifications缺水时推送照片记录允许用户上传植物照片形成成长日记品种百科点击植物查看详细养护指南成就系统如“连续浇水30天”、“养活5种植物”等徽章AR 预览用 AR 将虚拟植物“放置”在真实桌面arkit_flutter_plugin。八、结语在数字世界种下一棵真实的树这个植物养护 App 的真正价值不在于它多么“智能”而在于它唤醒了我们对生命的关注。当你看到“小绿”的进度条变红点击“立即浇水”看着它图标旋转、状态变为“茁壮成长”——那一刻你不是在操作一个 App而是在履行一份对生命的承诺。完整代码importpackage:flutter/material.dart;importdart:math;voidmain(){runApp(const PlantCareApp());}class PlantCareApp extends StatelessWidget{const PlantCareApp({super.key});override Widget build(BuildContext context){returnMaterialApp(debugShowCheckedModeBanner: false, title: 植物养护, theme: ThemeData(brightness: Brightness.light, primarySwatch: Colors.green, scaffoldBackgroundColor: const Color(0xFFFCFDFC), appBarTheme: const AppBarTheme(backgroundColor: Colors.transparent, foregroundColor: const Color(0xFF2E7D32), elevation:0,), floatingActionButtonTheme: const FloatingActionButtonThemeData(backgroundColor: Colors.green, foregroundColor: Colors.white,),), home: const PlantCareScreen(),);}}// 植物数据模型 class Plant{final Stringid;final String name;final Stringtype;// 多肉/观叶/开花 final int waterInterval;// 浇水间隔天 final DateTime lastWatered;final DateTime plantedDate;final double growthStage;//0.0-1.0 生长阶段 Plant({required this.id, required this.name, required this.type, required this.waterInterval, required this.lastWatered, required this.plantedDate, this.growthStage0.0,});// 计算是否需要浇水 bool get needsWater{final daysSinceWaterDateTime.now().difference(lastWatered).inDays;returndaysSinceWaterwaterInterval;}// 计算健康状态 String get healthStatus{if(needsWater)return需浇水;final daysSinceWaterDateTime.now().difference(lastWatered).inDays;if(daysSinceWaterwaterInterval ~/2)return茁壮成长;return状态良好;}// 获取植物图标根据类型和生长阶段 IconData get plantIcon{if(growthStage0.3)returnIcons.spa;if(type开花)returnIcons.local_florist;if(type多肉)returnIcons.local_florist;returnIcons.eco;}// 创建新实例用于状态更新 Plant copyWith({DateTime? lastWatered, double? growthStage,}){returnPlant(id: id, name: name, type: type, waterInterval: waterInterval, lastWatered: lastWatered ?? this.lastWatered, plantedDate: plantedDate, growthStage: growthStage ?? this.growthStage,);}}class PlantCareScreen extends StatefulWidget{const PlantCareScreen({super.key});override StatePlantCareScreencreateState()_PlantCareScreenState();}class _PlantCareScreenState extends StatePlantCareScreen{// 初始植物数据 ListPlant_plants[Plant(id:1, name:小绿, type:观叶, waterInterval:3, lastWatered: DateTime.now().subtract(const Duration(days:4)), plantedDate: DateTime.now().subtract(const Duration(days:30)), growthStage:0.7,), Plant(id:2, name:仙人球, type:多肉, waterInterval:14, lastWatered: DateTime.now().subtract(const Duration(days:10)), plantedDate: DateTime.now().subtract(const Duration(days:60)), growthStage:0.9,), Plant(id:3, name:茉莉花, type:开花, waterInterval:2, lastWatered: DateTime.now().subtract(const Duration(days:1)), plantedDate: DateTime.now().subtract(const Duration(days:15)), growthStage:0.4,),];final Random _randomRandom();// 浇水操作 void _waterPlant(String plantId){setState((){ _plants_plants.map((plant){ if(plant.idplantId){//更新浇水时间 final newPlantplant.copyWith(lastWatered:DateTime.now());// 随机促进生长50%概率if(_random.nextDouble()0.5newPlant.growthStage1.0){final growthIncrement0.1 _random.nextDouble()*0.15;returnnewPlant.copyWith(growthStage: min(1.0, newPlant.growthStage growthIncrement),);}returnnewPlant;}returnplant;}).toList();});// 显示反馈 final plant_plants.firstWhere((p)p.idplantId);ScaffoldMessenger.of(context).showSnackBar(SnackBar(content:Text(${plant.name} 已浇水${plant.growthStage1.0?已成熟:}),duration:const Duration(seconds:2),),);}//添加新植物 void _addNewPlant(){ final plantNames[薄荷,绿萝,芦荟,吊兰,虎皮兰,长寿花,蟹爪兰];final types[观叶,多肉,开花];final intervals[2,3,5,7,10,14];final nameplantNames[_random.nextInt(plantNames.length)];final typetypes[_random.nextInt(types.length)];final intervalintervals[_random.nextInt(intervals.length)];final newPlantPlant(id:DateTime.now().millisecondsSinceEpoch.toString(),name:name,type:type,waterInterval:interval,lastWatered:DateTime.now(),plantedDate:DateTime.now(),);setState((){ _plants.add(newPlant);});ScaffoldMessenger.of(context).showSnackBar(SnackBar(content:Text(欢迎新成员$name)),);}// 删除植物 void _deletePlant(String plantId){final plantToDelete_plants.firstWhere((p)p.idplantId);setState((){ _plants.removeWhere((p)p.idplantId);});ScaffoldMessenger.of(context).showSnackBar(SnackBar(content:Text(${plantToDelete.name} 已移除),action:SnackBarAction(label:撤销,onPressed:(){ setState((){ _plants.insert(0,plantToDelete);});},),),);} override Widget build(BuildContext context){ return Scaffold(appBar:AppBar(title:const Text(我的植物,style:TextStyle(fontSize:22,fontWeight:FontWeight.bold),),centerTitle:true,actions:[ IconButton(icon:const Icon(Icons.info_outline,size:24),onPressed:_showCareTips,),],),body:_plants.isEmpty?_buildEmptyState():ListView.builder(padding:const EdgeInsets.only(top:16,bottom:90),itemCount:_plants.length,itemBuilder:(context,index){ return _buildPlantCard(_plants[index]);},),floatingActionButton:FloatingActionButton(onPressed:_addNewPlant,child:const Icon(Icons.add),tooltip:添加新植物,),);} Widget _buildEmptyState(){ return Center(child:Padding(padding:const EdgeInsets.all(32),child:Column(mainAxisAlignment:MainAxisAlignment.center,children:[ Container(padding:const EdgeInsets.all(24),decoration:BoxDecoration(color:Colors.green.withOpacity(0.1),shape:BoxShape.circle,),child:const Icon(Icons.local_florist,size:64,color:Colors.green,),),const SizedBox(height:24),const Text(还没有植物伙伴,style:TextStyle(fontSize:20,fontWeight:FontWeight.bold),),const SizedBox(height:8),const Text(点击下方按钮添加你的第一株植物,textAlign:TextAlign.center,style:TextStyle(color:Colors.grey,height:1.5),),],),),);} Widget _buildPlantCard(Plant plant){ final isNeedingWaterplant.needsWater;final healthColorisNeedingWater?Colors.red:Colors.green;return Card(margin:const EdgeInsets.symmetric(horizontal:16,vertical:12),elevation:2,shape:RoundedRectangleBorder(borderRadius:BorderRadius.circular(20)), child: Padding(padding: const EdgeInsets.all(16), child: Row(children:[// 植物图标带动画 Container(width:70, height:70, decoration: BoxDecoration(color: Colors.green.withOpacity(0.1), borderRadius: BorderRadius.circular(16),), child: AnimatedSwitcher(duration: const Duration(milliseconds:500), transitionBuilder:(Widget child, Animationdoubleanimation){returnRotationTransition(turns: Tweendouble(begin:0, end:1).animate(animation), child: child,);}, child: Icon(plant.plantIcon, key: ValueKey(plant.growthStage), size:40, color: Colors.green.shade700,),),), const SizedBox(width:16), // 植物信息 Expanded(child: Column(crossAxisAlignment: CrossAxisAlignment.start, children:[// 名称和类型 Row(children:[Expanded(child: Text(plant.name, style: const TextStyle(fontSize:18, fontWeight: FontWeight.bold,), maxLines:1, overflow: TextOverflow.ellipsis,),), GestureDetector(onTap:()_deletePlant(plant.id), child: const Icon(Icons.delete_outline, size:20, color: Colors.grey,),),],), const SizedBox(height:4), Text(${plant.type} · 种植${DateTime.now().difference(plant.plantedDate).inDays}天, style: const TextStyle(color: Colors.grey, fontSize:14),), const SizedBox(height:12), // 健康状态 Row(children:[Container(width:12, height:12, decoration: BoxDecoration(color: healthColor, shape: BoxShape.circle,),), const SizedBox(width:8), Text(plant.healthStatus, style: TextStyle(color: healthColor, fontWeight: FontWeight.w600),),],), const SizedBox(height:8), // 浇水进度条 LinearProgressIndicator(value: min(1.0, DateTime.now().difference(plant.lastWatered).inDays / plant.waterInterval,), backgroundColor: Colors.grey.shade200, color: isNeedingWater ? Colors.red:Colors.green, minHeight:6, borderRadius: BorderRadius.circular(3),),],),), const SizedBox(width:16), // 浇水按钮 ElevatedButton(onPressed:()_waterPlant(plant.id), style: ElevatedButton.styleFrom(backgroundColor: isNeedingWater ? Colors.red:Colors.green, shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)), padding: const EdgeInsets.symmetric(vertical:12, horizontal:16),), child: Text(isNeedingWater ?立即浇水:浇水, style: const TextStyle(color: Colors.white, fontWeight: FontWeight.bold),),),],),),);}void_showCareTips(){showDialog(context: context, builder:(context)AlertDialog(title: const Text( 养护小贴士), content: SingleChildScrollView(child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: const[Text(• 观叶植物保持土壤微湿避免阳光直射), SizedBox(height:8), Text(• 多肉植物宁干勿湿充足光照), SizedBox(height:8), Text(• 开花植物花期需充足水分和磷钾肥), SizedBox(height:16), Divider(), SizedBox(height:8), Text(浇水提示当进度条变红时请及时浇水, style: TextStyle(color: Colors.red),),],),), actions:[TextButton(onPressed: Navigator.of(context).pop, child: const Text(知道了),),],),);}}