最全鸿蒙开发实例 ｜ 分布式涂鸦_鸿蒙开发大作业(1)，总结一下

于 2024-05-12 10:49:42 发布
阅读量378 收藏 6
点赞数 5
分类专栏： 程序员 文章标签： 大数据 面试 学习
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/2401_84185106/article/details/138748813
版权

img
img

网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。

需要这份系统化资料的朋友，可以戳这里获取

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！

onShow() {
this.cxt = this.$element(“board”).getContext(“2d”);
//恢复数据后，重新绘制
if (this.sharePoints.length > 0) {
for (let index = 0; index < this.sharePoints.length; index++) {
this.paintCanvas(this.sharePoints[index])
}
}
},
//Touch start事件
painStart(e) {
this.isShow = true;
var p = {
x: e.touches[0].localX,
y: e.touches[0].localY,
c: this.selColor,
flag: “start”
}
this.sharePoints.push§
//本地绘制
this.paintCanvas§
},
//Touch move事件
paint(e) {

    //坐标
    var p = {
        x: e.touches[0].localX,
        y: e.touches[0].localY,
        c: this.selColor,
        flag: "line"
    }
    this.sharePoints.push(p)

this.paintCanvas§
},
//Touch事件结束
paintEnd(e) {
this.cxt.closePath();
},
//本地绘制自由线条
paintCanvas(point) {
if (point.flag == “start”) {
this.cxt.beginPath();
this.cxt.strokeStyle = point.c
this.cxt.lineWidth = this.lineHeight
this.cxt.lineCap = “round”
this.cxt.lineJoin = “round”
this.cxt.moveTo(point.x,point.y);
} else if (point.flag == “line”) {
this.cxt.lineTo(point.x,point.y);
this.cxt.stroke()
}
},

//启动流转
setUpRemote: async function transfer() {
try {
await FeatureAbility.continueAbility(0,null)
} catch (e) {
console.error(“迁移出错：” + JSON.stringify(e))
}
},
onStartContinuation: function onStartContinuation() {
//判断当前的状态是不是适合迁移
return true;
},
onCompleteContinuation: function onCompleteContinuation(code) {
//迁移操作完成，code返回结果
return true
},
onSaveData: function onSaveData(saveData) {
//数据保存到savedData中进行迁移。
saveData.points = this.sharePoints;
return true
},
onRestoreData: function onRestoreData(restoreData) {
//收到迁移数据，恢复。
this.sharePoints = restoreData.points;
return true
}
}


## 2、**实现画板实时共享功能**


多设备间实现涂鸦画板数据同步,在鸿蒙操作系统中,需要通过分布式数据库来完成。同时需要Service Ability把分布式数据库中的数据推送给前端的FA(JavaScript页面)。


下面介绍如何为涂鸦画板添加实时共享功能,步骤如下。


### **步骤1:****通过分布式数据库实现数据共享。**


定义一个BoardServiceAbility 的PA,如代码示例3所示,重写onStart方法,在onStart方法中引用和创建分布式数据服务,storeID为数据库名称。


代码示例3 创建分布式数据服务

public class BoardServiceAbility extends Ability {
private KvManagerConfig config;
private KvManager kvManager;
private String storeID = “board”;
private SingleKvStore singleKvStore;

@Override
protected void onStart(Intent intent) {
super.onStart(intent);
//初始化manager
config = new KvManagerConfig(this);
kvManager = KvManagerFactory.getInstance().createKvManager(config);

//创建数据库
Options options = new Options();

options.setCreateIfMissing(true).setEncrypt(false).setKvStoreType(KvStoreType.SINGLE_VERSION);
singleKvStore = kvManager.getKvStore(options, storeID);

}
}


### **步骤2:****Service Ability实现页面数据订阅与同步。**


把需要共享的数据保存到鸿蒙分布式数据库中,如果需要在页面中访问这些实时的数据,则需要通过创建Service Ability来推送分布式数据库中的数据。创建推送数据的逻辑如代码示例4所示。


代码示例4 推送数据

package com.cangjie.jsabilitydemo.services;

import com.cangjie.jsabilitydemo.utils.DeviceUtils;
import ohos.aafwk.ability.Ability;
import ohos.aafwk.content.Intent;
import ohos.data.distributed.common.;
import ohos.data.distributed.user.SingleKvStore;
import ohos.rpc.;
import ohos.hiviewdfx.HiLog;
import ohos.hiviewdfx.HiLogLabel;
import ohos.utils.zson.ZSONObject;

import java.util.*;

public class BoardServiceAbility extends Ability {

private KvManagerConfig config;
private KvManager kvManager;
private String storeID = "board";
private SingleKvStore singleKvStore;

@Override
protected void onStart(Intent intent) {
    super.onStart(intent);
    //初始化manager
    config = new KvManagerConfig(this);
    kvManager = KvManagerFactory.getInstance().createKvManager(config);

    //创建数据库
    Options options = new Options();
    options.setCreateIfMissing(true).setEncrypt(false).setKvStoreType(KvStoreType.SINGLE_VERSION);
    singleKvStore = kvManager.getKvStore(options, storeID);

}


private static final String TAG = "BoardServiceAbility";
private MyRemote remote = new MyRemote();

@Override
protected IRemoteObject onConnect(Intent intent) {
    super.onConnect(intent);
    return remote.asObject();
}

}


**步骤3:**在多个分布式设备中进行数据同步,创建一个RPC代理类MyRemote,代理类用于远程通信连接。MyRemote类可以是BoardServiceAbility这个PA 的内部类。


实现远程数据调用,这里最关键的是onRemoteRequest方法,这种方法的code参数是客户端发送过来的编号,通过这个编号便可以处理不同的客户端请求,如代码示例5所示。


代码示例5 远程代理

class MyRemote extends RemoteObject implements IRemoteBroker {

private static final int ERROR = -1;
private static final int SUCCESS = 0;
private static final int SUBSCRIBE = 3000;
private static final int UNSUBSCRIBE = 3001;
private static final int SAVEPOINTS= 2000; //保存绘制的坐标

private Set<IRemoteObject> remoteObjectHandlers = new HashSet<IRemoteObject>();

MyRemote() {
    super("MyService_MyRemote");
}

@Override
public boolean onRemoteRequest(int code, MessageParcel data, MessageParcel reply, MessageOption option) throws RemoteException {

    switch (code) {
        case SAVEPOINTS:{
            String zsonStr=data.readString();
            BoardRequestParam param= ZSONObject.stringToClass(zsonStr,BoardRequestParam.class);
            Map<String, Object> zsonResult = new HashMap<String, Object>();
            zsonResult.put("data", param.getPoint());
            try {
                singleKvStore.putString("point", param.getPoint());
            } catch (KvStoreException e) {
                e.printStackTrace();
            }
            zsonResult.put("code", SUCCESS);
            reply.writeString(ZSONObject.toZSONString(zsonResult));
            break;
        }

//开启订阅，保存对端的remoteHandler，用于上报数据
case SUBSCRIBE: {
remoteObjectHandlers.add(data.readRemoteObject());
startNotify();
Map<String, Object> zsonResult = new HashMap<String, Object>();
zsonResult.put(“code”, SUCCESS);
reply.writeString(ZSONObject.toZSONString(zsonResult));
break;
}
//取消订阅，置空对端的remoteHandler
case UNSUBSCRIBE: {
remoteObjectHandlers.remove(data.readRemoteObject());
Map<String, Object> zsonResult = new HashMap<String, Object>();
zsonResult.put(“code”, SUCCESS);
reply.writeString(ZSONObject.toZSONString(zsonResult));
break;
}
default: {
reply.writeString(“service not defined”);
return false;
}
}
return true;
}

public void startNotify() {
    new Thread(() -> {
        while (true) {
            try {
                Thread.sleep(30); //每30ms发送一次

BoardReportEvent();

            } catch (RemoteException | InterruptedException e) {
                break;
            }
        }
    }).start();
}

private void BoardReportEvent() throws RemoteException {
    String points = "";
    try {
        points = singleKvStore.getString("point");
        singleKvStore.delete("point");
    } catch (KvStoreException e) {
        e.printStackTrace();
    }
    MessageParcel data = MessageParcel.obtain();
    MessageParcel reply = MessageParcel.obtain();
    MessageOption option = new MessageOption();
    Map<String, Object> zsonEvent = new HashMap<String, Object>();
    zsonEvent.put("point", points);
    data.writeString(ZSONObject.toZSONString(zsonEvent));
    for (IRemoteObject item : remoteObjectHandlers) {
        item.sendRequest(100, data, reply, option);
    }
    reply.reclaim();
    data.reclaim();
}

@Override
public IRemoteObject asObject() {
    return this;
}

}


这里需要向页面订阅的方法提供推送的数据,需要定义startNotify方法启动一个线程来推送数据,推送的数据是在BoardReportEvent中定义的,推送的数据是从分布式数据库中获取的,通过singleKvStore.getString("point")方法获取共享的数据。


这里还需要创建BoardRequestParam 类,用于序列化页面传过来的字符串,并将字符串转换成对象。Point是坐标信息,如 {x:1,y:2,flag:"start"},是从前端的FA 中传递过来的数据,如代码示例6所示。


代码示例6 序列化页面传过来的字符串BoardRequestParam.java

package com.cangjie.jsabilitydemo.services;

public class BoardRequestParam {
private int code; //code
private String point; //坐标

public int getCode() {
    return code;
}

img
img
img

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，涵盖了95%以上大数据知识点，真正体系化！

由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、讲解视频，并且后续会持续更新

需要这份系统化资料的朋友，可以戳这里获取

Z-1715482151038)]
[外链图片转存中…(img-7LY2LkQE-1715482151038)]
[外链图片转存中…(img-SAhmW95s-1715482151039)]

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，涵盖了95%以上大数据知识点，真正体系化！

由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、讲解视频，并且后续会持续更新

需要这份系统化资料的朋友，可以戳这里获取

2401_84185106
关注
专栏目录
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值