OpenHarmony标准设备应用开发（三）——分布式数据管理

原创

小帅聊鸿蒙

发布于 2025-04-09 08:08:31

8300

代码可运行

文章被收录于专栏：鸿蒙开发笔记鸿蒙开发笔记

运行总次数：0

代码可运行

本章是 OpenHarmony 标准设备应用开发的第三篇文章，将会在前面两章的基础上给大家讲解分布式数据管理在多台设备间，当数据出现变动时，通过订阅的方式，实现多台设备间的数据同步更新。为了更好的理解，我们使用 eTS 开发了一款如下动图所示的井字过三关游戏来讲解分布式数据管理在应用中的使用。

Demo 简介：Demo 基于 OpenHarmony 系统使用 eTS 语言进行编写，本 Demo 主要通过设备认证，分布式拉起，分布式数据管理等功能来实现。

项目创建以及页面布局等，这里就不再赘述，本章重点讲解自定义弹窗以及分布式数据管理。

一、自定义弹窗

通过对自定义弹窗的讲解，希望能让大家学到如何在项目中实现自己的自定义弹窗。

1.1 通过 @CustomDialog 装饰器来创建自定义弹窗，使用方式可参考自定义弹窗：

1.2 布局从上到下由 Text、List、Button 组成，List 中的子元素由 Text 和 Radio 组成，以下代码的省略号表示非 UI 相关的逻辑代码，具体实现参考源代码：

@CustomDialog
struct gameStart {
  build() {
    Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
      Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
        //顶部标题
        Text('发现以下在线设备').fontColor(Color.Black).fontSize(30)
      }.width('100%').height('20%')

      Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Start }) {
       //使用List容器动态加载在线设备
       List() {
          ForEach(this.deviceName, (item) => {
            ListItem() {
              Row() {
                //Text组件显示设备名
                Text(item.deviceName).width('80%').fontSize(30).fontColor(Color.Black)
                //Radio组件显示单选框
                Radio({ value: '' }).checked(this.check[item.id]).onChange(() => {
                  //这里保证List里面点击了多个Radio组件时，只有当前点击的为选中状态
                  for (let i = 0; i < this.check.length; i++) {
                    this.check[i] = false
                  }
                  this.check[item.id] = true
                })
              }
            }
          }, item => item.id)
        }
        .height('80%')

        Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
          Button('确定').width(200).height(50).fontSize(30).onClick(() => {
            //......
            this.controller.close()
          })
        }.height('30%')

      }.width('100%').height('80%')
    }.height('100%').width('100%')
  }
}

通过上述方式，完成我们的自定义弹窗，大家也可以在自己的项目中尝试完成自己的自定义弹窗。

二、分布式数据管理

分布式数据管理，可以在多台设备间，当数据出现变动时，通过订阅的方式，实现多台设备间的数据同步更新。当我们需要在多台设备间实现数据的同步更新，就可以使用分布式数据管理来实现。井字过三关游戏，通过分布式数据管理，实现多台设备间游戏界面的同步更新，实现多台设备同玩一个游戏的功能。

数据分布式运作示意图，如下所示。

实现步骤：

分布式数据管理依赖 @ohos.data.distributedData 模块实现，详细参考项目源码中的 RemoteDataManager.ets 实现步骤。

DD一下：`欢迎大家关注公众号<程序猿百晓生>，可以了解到以下知识点。`

`欢迎大家关注公众号<程序猿百晓生>，可以了解到以下知识点。`
1.OpenHarmony开发基础
2.OpenHarmony北向开发环境搭建
3.鸿蒙南向开发环境的搭建
4.鸿蒙生态应用开发白皮书V2.0 & V3.0
5.鸿蒙开发面试真题（含参考答案） 
6.TypeScript入门学习手册
7.OpenHarmony 经典面试题(含参考答案)
8.OpenHarmony设备开发入门【最新版】
9.沉浸式剖析OpenHarmony源代码
10.系统定制指南
11.【OpenHarmony】Uboot 驱动加载流程
12.OpenHarmony构建系统--GN与子系统、部件、模块详解
13.ohos开机init启动流程
14.鸿蒙版性能优化指南
.......

2.1 导入该模块

import factory from '@ohos.data.distributedData';

2.2 创建 KVManager 实例，用于管理数据库对象

registerDataListCallback(callback) {
    let that = this
    if (this.kvManager == null) {
      try {
        const config = {
          userInfo: {
            userId: '0',
            userType: 0
          },
          bundleName: 'com.example.tictactoegame'
        }
        factory.createKVManager(config).then((manager) => {
          that.kvManager = manager
          that.registerDataListCallback_(callback)
        }).catch((err) => {
        })
      } catch (e) {
      }
    } else {
      this.registerDataListCallback_(callback)
    }
  }

备注：bundleName 改成对应内容

2.3 创建并获取 KVStore 数据库

registerDataListCallback_(callback) {
    let that = this
    if (that.kvManager == null) {
      callback()
      return
    }
    if (that.kvStore == null) {
      try {
        let options =
          {
            createIfMissing: true,
            encrypt: false,
            backup: false,
            autoSync: true,
            kvStoreType: 1,
            securityLevel: 3
          }
        this.kvManager.getKVStore(this.STORE_ID, options).then((store) => {
          that.kvStore = store
          that._registerDataListCallback_(callback)
        }).catch((err) => {
        })
      } catch (e) {
      }
    } else {
      this._registerDataListCallback_(callback)
    }
  }

备注：STORE_ID 改成对应内容

2.4 订阅指定类型的数据变更通知

_registerDataListCallback_(callback) {
    let that = this
    if (that.kvManager == null) {
      callback()
      return
    }
    this.kvStore.on('dataChange', 1, function(data) {
      if (data) {
         that.arr = data.updateEntries
        callback()
      }
    })
  }

备注：kvStore.on 方法中的 1 对应订阅的类型，具体详情看上面官网参考中的详细描述。

2.5 添加指定类型键值对到数据库

dataChange(key, value) {
    let that = this
      try {
        that.kvStore.put(JSON.stringify(key), JSON.stringify(value)).then((data) => {
        }).catch((err) => {
          prompt.showToast({message:'put err:'+JSON.stringify(value)})
        })

      } catch (e) {
      }
  }