HarmonyOS鸿蒙Next分布式多媒体互动应用-绘画版

HarmonyOS挑战赛第三期#分布式多媒体互动应用-绘画版

简介

分布式多媒体互动应用-绘画版是基于#HarmonyOS挑战赛第二期#分布式多媒体互动应用叠加绘画多屏互动功能，并在原来分布式流转phone端到TV端的基础上增加phone端到phone端，迭代开发而成的一款分布式多媒体互动的应用。应用功能包括滑动切换视频功能、评论功能（评论数据使用了分布式数据库实现了分布式和持久化）、分布式流转功能、远程控制播放和发弹幕互动功能、分布式流转后同步观看并发弹幕互动功能、绘画多屏互动功能。

本应用可满足个人娱乐、家庭互助、朋友娱乐社交等场景，例如以下使用场景：

1. 自己观看本地视频，并发送评论或者弹幕；
2. 把手机里视频流转到智慧屏上给小孩或者老人观看，并远程控制播放，同时可以发送弹幕互动；
3. 在视频流转后，也可同步观看同一视频，并发送评论、弹幕互动、绘画。

功能介绍

由于是迭代开发，前面5点的功能就不再赘述了，有兴趣可以去看看之前的帖子：#HarmonyOS挑战赛第二期#分布式多媒体互动应用

1. 滑动切换视频功能
2. 评论分布式持久化功能
3. 分布式流转远程控制功能
4. 分布式弹幕功能
5. 分布式流转后同步观看并发弹幕互动功能
6. 分布式流转后同步观看并绘画多屏互动功能

动画演示

核心代码展示

private void initDraw() {
    if (findComponentById(ResourceTable.Id_text_title) instanceof Text) {
        Text textTitle = (Text) findComponentById(ResourceTable.Id_text_title);
        textTitle.setText(isLocal ? "本地端绘画" : "远程端绘画");
    }
    if (findComponentById(ResourceTable.Id_bac_area) instanceof DependentLayout) {
        area = (DependentLayout) findComponentById(ResourceTable.Id_bac_area);
        showButton = (Button) findComponentById(ResourceTable.Id_draw_show_button);
        clearButton = (Button) findComponentById(ResourceTable.Id_draw_clear_button);
        if(area != null)
        {
            drawl = new DrawPoint(this, isLocal);
            drawl.setWidth(MATCH_PARENT);
            drawl.setWidth(MATCH_PARENT);
            area.addComponent(drawl);
            area.setVisibility(INVISIBLE);
            drawl.setOnDrawBack(points -> {
                drawPoint(points);
            });
            showButton.setClickedListener(listener -> {
                if(area.getVisibility() == VISIBLE)
                {
                    area.setVisibility(INVISIBLE);
                    showButton.setText("显示");
                }
                else
                {
                    area.setVisibility(VISIBLE);
                    showButton.setText("隐藏");
                }
            });
            clearButton.setClickedListener(listener -> {
                if(area.getVisibility() == VISIBLE)
                {
                    drawl.Clear();
                }
            });
        }
    }
}
private void drawPoint(List<MyPoint> points) {
    if (connectFlag & points != null & points.size() > 1) {
        pointXs = new float[points.size()];
        pointYs = new float[points.size()];
        isLastPoints = new boolean[points.size()];
        for (int i = 0; i < points.size(); i++) {
            pointXs[i] = points.get(i).getPositionX();
            pointYs[i] = points.get(i).getPositionY();
            isLastPoints[i] = points.get(i).isLastPoint();
        }
        // After the drawing is completed, send the data to the remote
        if (myProxy != null) {
            try {
                myProxy.sendDataToRemote(MyRemoteProxy.REQUEST_SEND_DATA,pointXs,pointYs,isLastPoints);
            } catch (RemoteException e) {
                LogUtil.info(TAG, "processEvent RemoteException");
            }
        }
    }
}

参考资料

• 分布式手写板

工程源码

代码工程和相关视频演示、gif演示、程序截图已放到了Gitee指定的代码仓里-代码仓，欢迎大家指导指导，有兴趣一起开源开发！

总结

本次开发是是迭代开发，前期时间花在把之前Phone端到TV改造为可以对Phone端，然后再参考官方的分布式手写板工程，加入到目前的项目里。本应用的使用场景越来越偏向于家庭式分享互动，家长和小孩间可以一边观看教育或者动画视频，一边绘画互动，后面如果叠加语言功能，将会更加方便有趣。

动画演示