男生78和女生定眼：解密社交密码，点燃情感火花

Flutter for OpenHarmony 实战独木桥问题模拟系统完整开发指南文章目录Flutter for OpenHarmony 实战独木桥问题模拟系统完整开发指南摘要

项目背景与功能概述

1 独木桥问题背景

2 应用功能规划

3 人物参数设计

独木桥问题规则

1 桥的约束条件

2 过桥流程

3 人物分布

技术选型与架构设计

1 核心技术栈

2 应用架构

3 数据流设计

数据模型设计

1 人物类定义

2 桥状态枚举

3 人物初始化

UI界面实现

1 控制面板

2 桥状态显示

3 人员卡片

异步队列处理

1 开始模拟

2 队列处理核心

3 过桥模拟

4 重置模拟

完整代码实现

1 应用入口

2 状态管理

3 AppBar设计

运行效果与测试

1 项目运行命令

2 功能测试清单

九、

总结摘要独木桥问题是经典的并发同步问题展示了资源互斥访问的场景。

本文将详细介绍如何使用Flutter for OpenHarmony框架开发一款独木桥问题模拟系统。

文章涵盖了人物数据模型、桥状态管理、异步队列处理、Future延迟模拟等核心技术点。

通过本文学习读者将掌握Flutter在鸿蒙平台上的异步编程技巧了解并发模拟与资源管理的实现方法。

项目背景与功能概述

1 独木桥问题背景独木桥问题是操作系统中的经典同步问题南侧和北侧各有若干人要过桥桥一次只能容纳一个人需要保证所有人安全过桥展示了互斥锁和队列管理的概念

2 应用功能规划功能模块具体功能人物管理南侧9人、北侧8人不同过桥速度桥状态显示显示桥空闲/被占用状态队列处理按顺序依次过桥过程模拟异步模拟每个人过桥过程进度统计显示已过桥人数控制功能开始/重置模拟

3 人物参数设计参数说明示例id唯一标识S1, S2…N1, N2…name显示名称南1, 南2…北1, 北2…side所属方向south, northcrossingSpeed过桥速度(毫秒)

0

独木桥问题规则

1 桥的约束条件桥是一个共享资源具有以下约束桥一次只能容纳一个人同一时刻只能有一人过桥其他人必须等待桥空闲

2 过桥流程

3 人物分布方向人数标识南侧9人S1-S9北侧8人N1-N8总计17人-

技术选型与架构设计

1 核心技术栈UI组件ListView显示人员列表Card人员卡片展示SnackBar完成提示状态管理StatefulWidget管理模拟状态setState更新UI异步处理Future.delayed模拟过桥时间async/await异步队列处理

2 应用架构BridgeCrossingApp (应用根组件) └── BridgeCrossingPage (模拟页面) ├── AppBar (导航栏 进度显示) ├── 控制面板 │ ├── 开始按钮 │ └── 重置按钮 ├── 桥状态显示 │ ├── 空闲状态 │ └── 占用状态 └── 人员列表 └── PersonCard (17个)

3 数据流设计

数据模型设计

1 人物类定义classPerson{finalStringid;// 唯一标识finalStringname;// 显示名称finalStringside;// south 或 northbool isOnBridge;// 是否在桥上bool hasCrossed;// 是否已过桥int crossingSpeed;// 过桥速度毫秒Person({requiredthis.id,requiredthis.name,requiredthis.side,this.isOnBridgefalse,this.hasCrossedfalse,this.crossingSpeed1000,});Colorgetcolorsidesouth?Colors.blue:Colors.orange;}

2 桥状态枚举enumBridgeStatus{idle,// 空闲occupied,// 被占用}

3 人物初始化void_initializePeople(){_people.clear();// 南侧9人for(int i1;i9;i){_people.add(Person(id:S$i,name:南$i,side:south,crossingSpeed:1000(i*

,// 不同速度));}// 北侧8人for(int i1;i8;i){_people.add(Person(id:N$i,name:北$i,side:north,crossingSpeed:1000(i*

,// 不同速度));}setState((){_crossedCount0;_hasStartedfalse;});}

UI界面实现

1 控制面板Container(padding:constEdgeInsets.all(

,color:Colors.teal.shade50,child:Row(children:[ElevatedButton.icon(onPressed:_hasStarted?null:_startSimulation,icon:constIcon(Icons.play_arrow),label:constText(开始模拟),style:ElevatedButton.styleFrom(backgroundColor:Colors.green,foregroundColor:Colors.white,),),constSizedBox(width:

,ElevatedButton.icon(onPressed:_resetSimulation,icon:constIcon(Icons.refresh),label:constText(重置),style:ElevatedButton.styleFrom(backgroundColor:Colors.grey,),),],),)

2 桥状态显示Container(padding:constEdgeInsets.all(

,color:Colors.grey.shade100,child:Row(mainAxisAlignment:MainAxisAlignment.center,children:[Icon(_bridgeStatusBridgeStatus.occupied?Icons.block:Icons.check_circle,color:_bridgeStatusBridgeStatus.occupied?Colors.red:Colors.green,),constSizedBox(width:

,Text(_bridgeStatusBridgeStatus.occupied?桥被占用${_currentCrosser?.name}正在过桥:桥空闲,style:constTextStyle(fontSize:16,fontWeight:FontWeight.bold),),],),)

3 人员卡片Widget_buildPersonCard(Personperson){StringstatusText;ColorstatusColor;if(person.isOnBridge){statusText正在过桥...;statusColorColors.orange;}elseif(person.hasCrossed){statusText已过桥 ✓;statusColorColors.green;}else{statusText等待中;statusColorColors.grey;}returnCard(margin:constEdgeInsets.only(bottom:

,child:ListTile(leading:CircleAvatar(backgroundColor:person.color,child:Text(person.name.substring(

,style:constTextStyle(color:Colors.white,fontWeight:FontWeight.bold,),),),title:Text(person.name,style:constTextStyle(fontWeight:FontWeight.bold),),subtitle:Text(速度:${person.crossingSpeed}ms),trailing:Container(padding:constEdgeInsets.symmetric(horizontal:12,vertical:

,decoration:BoxDecoration(color:statusColor,borderRadius:BorderRadius.circular(

,),child:Text(statusText,style:constTextStyle(color:Colors.white,fontWeight:FontWeight.bold,),),),),);}

异步队列处理

1 开始模拟void_startSimulation(){if(_hasStarted)return;setState((){_hasStartedtrue;});_processQueue();}

2 队列处理核心void_processQueue()async{// 按顺序过桥for(varpersonin_people){if(!person.hasCrossed){await_crossBridge(person);setState((){_crossedCount;});// 滚动到底部if(_scrollController.hasClients){_scrollController.animateTo(_scrollController.position.maxScrollExtent,duration:constDuration(milliseconds:

,curve:Curves.easeInOut,);}}}// 全部完成if(mounted){setState((){_bridgeStatusBridgeStatus.idle;});ScaffoldMessenger.of(context).showSnackBar(constSnackBar(content:Text(所有人都已安全过桥),backgroundColor:Colors.green,),);}}算法要点使用async/await实现异步顺序处理await确保每个人完成后才开始下一个mounted检查避免内存泄漏自动滚动跟踪当前过桥人

3 过桥模拟Futurevoid_crossBridge(Personperson)async{setState((){_bridgeStatusBridgeStatus.occupied;_currentCrosserperson;person.isOnBridgetrue;});// 模拟过桥时间awaitFuture.delayed(Duration(milliseconds:person.crossingSpeed));if(mounted){setState((){person.isOnBridgefalse;person.hasCrossedtrue;_bridgeStatusBridgeStatus.idle;_currentCrossernull;});}}异步处理要点Future.delayed模拟时间消耗多次setState更新不同状态mounted检查确保组件存在

4 重置模拟void_resetSimulation(){setState((){_hasStartedfalse;_bridgeStatusBridgeStatus.idle;_currentCrossernull;_crossedCount0;for(varpersonin_people){person.isOnBridgefalse;person.hasCrossedfalse;}});_initializePeople();}

完整代码实现

1 应用入口voidmain(){runApp(constBridgeCrossingApp());}classBridgeCrossingAppextendsStatelessWidget{constBridgeCrossingApp({super.key});overrideWidgetbuild(BuildContextcontext){returnMaterialApp(title:独木桥问题,theme:ThemeData(colorScheme:ColorScheme.fromSeed(seedColor:Colors.teal),useMaterial3:true,),home:constBridgeCrossingPage(),);}}

2 状态管理class_BridgeCrossingPageStateextendsStateBridgeCrossingPage{finalListPerson_people[];BridgeStatus_bridgeStatusBridgeStatus.idle;Person?_currentCrosser;int _crossedCount0;finalScrollController_scrollControllerScrollController();bool _hasStartedfalse;overridevoidinitState(){super.initState();_initializePeople();}overridevoiddispose(){_scrollController.dispose();super.dispose();}}

3 AppBar设计AppBar(title:constText(独木桥问题),backgroundColor:Theme.of(context).colorScheme.inversePrimary,actions:[Center(child:Padding(padding:constEdgeInsets.only(right:

,child:Text(已过桥:$_crossedCount/17,style:constTextStyle(fontSize:16,fontWeight:FontWeight.bold),),),),],)

运行效果与测试

1 项目运行命令cdE:\HarmonyOS\oh.code\bridge_crossing flutter run -d ohos

2 功能测试清单初始化测试南侧显示9人蓝色北侧显示8人橙色所有人状态为等待中模拟流程测试点击开始模拟后按钮禁用第一人上桥状态变为正在过桥桥状态显示被占用过桥完成后状态变为已过桥自动开始下一人状态显示测试桥状态实时更新当前过桥人正确显示已过桥计数准确重置功能测试点击重置恢复初始状态所有进度清零可重新开始模拟完成提示测试17人全部过桥后显示提示提示内容“所有人都已安全过桥”

九、

总结本文详细介绍了使用Flutter for OpenHarmony开发独木桥问题模拟系统的完整过程涵盖了以下核心技术点数据模型Person类、桥状态枚举、多属性管理状态管理桥状态、人物状态、进度统计异步编程Future.delayed、async/await、队列处理UI设计ListView、Card、状态指示器用户交互开始/重置控制、自动滚动资源管理ScrollController生命周期这个项目展示了Flutter在并发模拟和异步编程方面的完整流程。

读者可以基于此项目添加更多功能如双向过桥南北对开优先级队列并行模拟多座桥性能统计与分析通过本文的学习读者应该能够理解异步编程的基本概念掌握Flutter在鸿蒙平台上的异步处理技巧为开发更复杂的并发应用打下基础。

欢迎加入开源鸿蒙跨平台社区: 开源鸿蒙跨平台开发者社区

713GccA片上-713GccA片上应用