鸿蒙-跨设备互通，设备互通提供跨设备的相机、扫描、图库访问能力，平板或2in1设备可以调用手机的相机、扫描、图库等功能。

跨设备互通

跨设备互通提供跨设备的相机、扫描、图库访问能力，平板或2in1设备可以调用手机的相机、扫描、图库等功能。

约束与限制

需同时满足以下条件，才能使用该功能：

• 设备限制

  • 本端设备：HarmonyOS版本为HarmonyOS NEXT及以上的平板或2in1设备。
  • 远端设备：HarmonyOS版本为HarmonyOS NEXT及以上、具有相机能力的手机或平板设备。

• 使用限制

  • 双端设备需要登录同一华为账号。

  • 跨设备互通API支持根据特定调用策略调用设备。调用策略：2in1设备可以调用平板和手机，平板可以调用手机，同类型设备不可调用。

  • 双端设备需要打开WLAN和蓝牙开关。

    条件允许时，建议双端设备接入同一个局域网，可提升唤醒相机的速度。

接口说明

在开发具体功能前，请先查阅参考文档。

接口名	描述
createCollaborationServiceMenuItems	设备列表选择器，用于获取组网内具有对应相机能力的设备列表。
CollaborationServiceStateDialog	弹窗组件，用于提示对端相机拍摄状态。

开发步骤

1. 在Menu中调用createCollaborationServiceMenuItems添加设备列表选择器，在菜单项内显示设备列表。

   说明

   在调用createCollaborationServiceMenuItems前，需了解：

   • 该方法需要在Menu组件内调用。
   • 该方法是自定义构建函数，您在使用前需要先了解@Builder。

2. 传入Array类型的CollaborationServiceFilter枚举值即可使用对应能力，目前支持ALL、TAKE_PHOTO、SCAN_DOCUMENT、IMAGE_PICKER。（即目前只支持相机拍照、图库、扫描，所以为了后续又加入更多的功能这块我们选择ALL）

   @Builder  
   MyTestMenu() {  
     Menu() {                    
         createCollaborationServiceMenuItems([CollaborationServiceFilter.ALL])
        }
    }

3. 在build方法中添加弹窗组件CollaborationServiceStateDialog，用于提示远端相机拍摄状态和回传数据，需要实现其中的onState方法。CollaborationServiceStateDialog是全局的提示框，不会对原有布局产生影响，下图为唤起的弹窗。

   

4. 为弹窗组件绑定和实现onState方法，用于接收和处理照片数据。

   回调函数的传入参数stateCode是完成状态，buffer是回传的图片数据，可通过状态和图片数据结合自身的业务逻辑实现onState方法。

   doInsertPicture方法为自定义方法，可以自定义主要用来接受回传的图片数据buffer，然后里面可以写自己的一些业务逻辑

   CollaborationServiceStateDialog({
     onState: (stateCode: number, bufferType: string, buffer: ArrayBuffer):void => this.doInsertPicture(stateCode, bufferType, buffer)
   })

   详细步骤

   示例代码如下：

   import {
   createCollaborationServiceMenuItems,
   CollaborationServiceStateDialog,
   CollaborationServiceFilter
   } from '@kit.ServiceCollaborationKit';
   import { image } from '@kit.ImageKit';
   import { hilog } from '@kit.PerformanceAnalysisKit';

   @Entry
   @Component
   struct Index {

   @Builder
   MyTestMenu() {
   Menu() {
   createCollaborationServiceMenuItems([CollaborationServiceFilter.ALL])
   }
   }

   build() {
   Column({ space: 20 }) {
   CollaborationServiceStateDialog({
   onState: (stateCode: number, bufferType: string, buffer: ArrayBuffer): void => this.doInsertPicture(stateCode, bufferType, buffer)
   })
   Button('使用远端设备进行拍照')
   .type(ButtonType.Normal)
   .borderRadius(10)
   .bindMenu(this.MyTestMenu)

    }
    .padding(20)
    .width('100%')
    .alignItems(HorizontalAlign.Center)

   }

   doInsertPicture(stateCode: number, bufferType: string, buffer: ArrayBuffer): void {
   //自己的业务逻辑
   }
   }