HarmonyOS 5.0.0 或以上：构建分布式会议管理原型（角色控制 + 操作同步 + 页面协同）

前端付豪3号

于 2025-05-20 17:51:46 发布

阅读量204

点赞数 6

分类专栏：鸿蒙 x AI 产品实战文章标签： harmonyos 分布式 wpf 华为

本文链接：https://blog.csdn.net/2501_92052054/article/details/148094815

版权

鸿蒙 x AI 产品实战专栏收录该内容

105 篇文章

订阅专栏

HarmonyOS 5.0.0 或以上：构建分布式会议管理原型（角色控制 + 操作同步 + 页面协同）

📌 场景说明

本篇整合前几篇的模块封装，构建一个可运行的“分布式会议管理系统”原型，具备：

主持人控制议程（下一页）
参与者只能被动同步页面
跨设备同步议题内容、会议页面跳转
使用统一角色与指令控制封装

🧱 项目结构

/entry/src/main/ets
  ├── services/
  │     ├── DistributedMessenger.ets
  │     └── MeetingCoordinator.ets          // ✅ 本篇封装模块
  └── pages/
        └── MeetingRoom.ets                 // 演示页：会议协同

🧩 services/MeetingCoordinator.ets

import { DistributedMessenger } from './DistributedMessenger'

type MeetingCommand = {
  type: 'switch_topic',
  index: number,
  timestamp: number,
  from: 'host' | 'guest'
}

export class MeetingCoordinator {
  private static key = 'meeting_cmd'
  private static currentRole: 'host' | 'guest' = 'guest'
  private static listeners: ((cmd: MeetingCommand) => void)[] = []

  static async init(context: Context, role: 'host' | 'guest') {
    this.currentRole = role
    const messenger = await DistributedMessenger.getInstance(context)
    messenger.onMessage(this.key, (val) => {
      const cmd = JSON.parse(val) as MeetingCommand
      for (const cb of this.listeners) cb(cmd)
    })
  }

  static onCommand(cb: (cmd: MeetingCommand) => void) {
    this.listeners.push(cb)
  }

  static async switchTopic(context: Context, index: number) {
    if (this.currentRole !== 'host') return
    const messenger = await DistributedMessenger.getInstance(context)
    const cmd: MeetingCommand = {
      type: 'switch_topic',
      index,
      from: 'host',
      timestamp: Date.now()
    }
    await messenger.sendMessage(this.key, JSON.stringify(cmd))
  }

  static isHost(): boolean {
    return this.currentRole === 'host'
  }
}

🧩 pages/MeetingRoom.ets

import { MeetingCoordinator } from '../services/MeetingCoordinator'

@Entry
@Component
struct MeetingRoom {
  @State currentIndex: number = 0
  @State log: string = ''
  private topics: string[] = ['项目介绍', '技术架构', 'Q&A', '总结']

  async aboutToAppear() {
    const context = getContext(this)
    const isHost = getUriParam(context, 'host') === 'true'
    await MeetingCoordinator.init(context, isHost ? 'host' : 'guest')

    MeetingCoordinator.onCommand((cmd) => {
      if (cmd.type === 'switch_topic') {
        this.currentIndex = cmd.index
        this.log = `🛰 来自 ${cmd.from} 的议题切换：${this.topics[cmd.index]}`
      }
    })
  }

  private async nextTopic() {
    if (this.currentIndex < this.topics.length - 1) {
      const context = getContext(this)
      await MeetingCoordinator.switchTopic(context, this.currentIndex + 1)
    }
  }

  build() {
    Column() {
      Text("🧑‍💻 分布式会议协同").fontSize(22).margin(20)
      Text(`当前议题：${this.topics[this.currentIndex]}`).fontSize(18).marginBottom(10)

      If(MeetingCoordinator.isHost(), () => {
        Button("下一议题").onClick(() => this.nextTopic()).marginBottom(10)
      }, () => {
        Text("⛔️ 参与者无法操作").fontColor('#999').marginBottom(10)
      })

      Text(this.log).fontSize(14).fontColor('#666')
      Text("💡 多端运行此页面，添加 `?host=true` 表示主持人身份").fontSize(12).fontColor('#999').marginTop(20)
    }
    .padding(20)
    .height('100%')
  }
}