DEV Community

SameX
SameX

Posted on

Cross-Application Collaboration of Custom Data Types in HarmonyOS Next: Implementing Enterprise-Level Document Management

This article aims to deeply explore the technical details of the Huawei HarmonyOS Next system (up to API 12 as of now), and is summarized based on actual development practices. It mainly serves as a vehicle for technical sharing and communication. Mistakes and omissions are inevitable. Colleagues are welcome to put forward valuable opinions and questions so that we can make progress together. This article is original content, and any form of reprint must indicate the source and the original author.

Overview

Enterprise-level document management systems need to support data sharing and collaborative work across applications and devices. Through the Unified Data Management Framework (UDMF) and Ark Data Management (ArkData) of Huawei HarmonyOS, we can easily create custom standardized data types to achieve smooth interaction of data such as documents, images, and audio between different applications and devices. Taking enterprise document management as an example, this article will show how to create custom data types and implement cross-device document sharing and collaborative editing in multiple applications.

Practical Scenario

We will develop an enterprise document management system that supports the following functions:

  • Creation of custom standardized data types for document, image, and audio files.
  • Implementation of cross-application drag-and-drop and data sharing using UDMF.
  • Utilization of distributed objects to achieve document data synchronization and collaborative editing across multiple devices. ### 1. Creating Custom Data Types HarmonyOS supports developers to create custom standardized data types for handling data such as enterprise documents, images, and audio. First, we need to define these custom types in the utd.json5 file of the application. Step One: Define Custom Data Types for Documents, Images, and Audio
{
  "UniformDataTypeDeclarations": [
    {
      "TypeId": "com.company.document",
      "BelongingToTypes": ["general.file"],
      "FilenameExtensions": [".docx", ".pdf"],
      "MIMETypes": ["application/vnd.openxmlformats-officedocument.wordprocessingml.document", "application/pdf"],
      "Description": "Enterprise Document",
      "ReferenceURL": ""
    },
    {
      "TypeId": "com.company.image",
      "BelongingToTypes": ["general.image"],
      "FilenameExtensions": [".jpg", ".png"],
      "MIMETypes": ["image/jpeg", "image/png"],
      "Description": "Enterprise Image",
      "ReferenceURL": ""
    },
    {
      "TypeId": "com.company.audio",
      "BelongingToTypes": ["general.audio"],
      "FilenameExtensions": [".mp3", ".wav"],
      "MIMETypes": ["audio/mpeg", "audio/wav"],
      "Description": "Enterprise Audio File",
      "ReferenceURL": ""
    }
  ]
}
Enter fullscreen mode Exit fullscreen mode

In this file, we have created three custom data types: documents, images, and audio files, corresponding to file formats such as .docx, .pdf, .jpg, and .mp3 respectively.
Step Two: Using Custom Data Types
In the application, we will encapsulate the custom data types into data objects through the ArkData unified data structure, so as to enable drag-and-drop and sharing between applications.

import { uniformDataStruct, uniformTypeDescriptor, unifiedDataChannel } from '@kit.ArkData';
let documentDetails: Record<string, string> = {
  'author': 'John Doe',
  'created_at': '2024-10-01',
};
let document: uniformDataStruct.File = {
  uniformDataType: 'com.company.document',
  filename: 'enterprise_document.docx',
  filePath: '/documents/enterprise_document.docx',
  details: documentDetails,
};
// Create image data
let imageDetails: Record<string,强队{"resolution": "1920x1080"};
let image: uniformDataStruct.Image = {
  uniformDataType: 'com.company.image',
  url: '/images/enterprise_image.jpg',
  description: 'Enterprise Image',
  details: imageDetails,
};
// Create audio data
let audioDetails: Record<string, string> = {
  'duration': '120s',
};
let audio: uniformDataStruct.Audio = {
  uniformDataType: 'com.company.audio',
  url: '/audio/enterprise_audio.mp3',
  description: 'Enterprise Audio File',
  details: audioDetails,
};
Enter fullscreen mode Exit fullscreen mode

Through the above code, we have encapsulated the custom documents, images, and audio files into standardized data structure objects.

2. Using the UDMF Unified Data Structure to Handle Cross-Application Document Drag-and-Drop and Sharing

Next, we will implement the cross-application document drag-and-drop and sharing functions. The UDMF provides a unified data structure interface, allowing data to be dragged and shared between different applications.
Step Three: Implement the Cross-Application Drag-and-Drop Function
In Application A, users can drag enterprise documents to the target area:

let unifiedData = new unifiedDataChannel.UnifiedData();
let documentRecord = new unifiedDataChannel.UnifiedRecord(uniformTypeDescriptor.UniformDataType.FILE, document);
let imageRecord = new unifiedDataChannel.UnifiedRecord(uniformTypeDescriptor.UniformDataType.IMAGE, image);
let audioRecord = new unifiedDataChannel.UnifiedRecord(uniformTypeDescriptor.UniformDataType.AUDIO, audio);
unifiedData.addRecord(documentRecord);
unifiedData.addRecord(imageRecord);
unifiedData.addRecord(audioRecord);
// Initiate the drag-and-drop operation to drag the data to the target application
unifiedDataChannel.setDragData(unifiedData);
Enter fullscreen mode Exit fullscreen mode

In the target Application B, we receive the dragged data and parse the documents, images, and audio files:

unifiedDataChannel.getDropData().then((data) => {
  let records = data.getRecords();
  records.forEach((record) => {
  let recordType = record.getValue()['uniformDataType'];
  switch (recordType) {
      case 'com.company.document':
      console.log('Document received: ', record.getValue()['filename']);
      break;
      case 'com.company.image':
      console.log('Image received: ', record.getValue()['url']);
      break;
      case 'com.company.audio':
      console.log('Audio received: ', record.getValue()['url']);
      break;
      default:
      console.log('Unknown data type received.');
      }
  });
});
Enter fullscreen mode Exit fullscreen mode

This code实现了应用间的数据拖拽与接收,能够处理企业文档、图片和音频文件。

3. Implementing Distributed Object Management of Custom Data Types and Cross-Device Collaborative Work

To support cross-device data synchronization and collaboration, we use distributed data objects to manage custom data types. Through distributed data objects, the document modified by the user on Device A will be automatically synchronized to Device B, ensuring consistency across multiple terminals.
Step Four: Create and Synchronize Distributed Data Objects
On Device A, we will synchronize the custom document as a distributed object:

import { distributedDataObject } from '@kit.ArkData';
// Create a distributed data object
let sessionId = distributedDataObject.genSessionId();
let distributedDocument = distributedDataObject.create(this.context, document);
// Set the sessionId for synchronization
distributedDocument.setSessionId(sessionId);
// Listen to status changes
distributedDocument.on('status', (sessionId: string, networkId: string, status: string) => {
  if (status == 'restored') {
  console.log('Document restored on device: ', networkId);
  }
});
// Save the document to Device B
let targetDeviceId = 'device_B_network_id'; // The network ID of the target device
distributedDocument.save(targetDeviceId);
Enter fullscreen mode Exit fullscreen mode

Step Five: Receive the Document on Device B and Collaboratively Edit
On Device B, the modification of the document on Device A can be obtained in a timely manner by listening to the synchronization status:

let receivedDocument = distributedDataObject.create(this.context, null);
// Set the same sessionId to synchronize data
receivedDocument.setSessionId(sessionId);
// Listen to document synchronization
receivedDocument.on('change', (sessionId: string, fields: Array<string>) => {
  fields.forEach((field) => {
  console.log(`Document field ${field} changed on session ${sessionId}`);
  });
});
Enter fullscreen mode Exit fullscreen mode

This code ensures cross-device document synchronization and collaboration, allowing users to edit documents in real time on multiple devices, and all modifications will be synchronized among the devices.

Summary

Through this article, we have demonstrated how to create custom data types and implement data sharing and collaboration in cross-application and cross-device scenarios through the Ark Data Management and Unified Data Management Framework of HarmonyOS. The key steps include:

  1. Create custom standardized data types for handling documents, images, and audio files.
  2. Use UDMF to implement cross-application data drag-and-drop and sharing, ensuring seamless interaction between different applications.
  3. Utilize distributed data objects to achieve data synchronization and collaborative work among multiple devices. Through these technologies, we can easily build an enterprise-level document management system, achieving collaborative editing and data sharing among multiple terminals, thereby enhancing the user experience.

Top comments (0)