1# Image Receiver (C/C++) 2 3You can use the **ImageReceiver** APIs to obtain the surface ID of a component, read the latest image or the next image, and release **ImageReceiver** instances. 4 5## How to Develop 6 7### Adding Dependencies 8 9Open the **src/main/cpp/CMakeLists.txt** file of the native project, add **libimage_ndk.z.so**, **libimage_receiver_ndk.z.so**, **libnative_image.so**, and **libhilog_ndk.z.so** (on which the native log APIs depend) to the **target_link_libraries** dependency. 10 11```txt 12target_link_libraries(entry PUBLIC libace_napi.z.so libhilog_ndk.z.so libimage_ndk.z.so libimage_receiver_ndk.z.so libnative_image.so) 13``` 14 15### Adding API Mappings 16 17Open the **src/main/cpp/hello.cpp** file and add the following API mappings to the **Init** function: 18 19```c++ 20EXTERN_C_START 21static napi_value Init(napi_env env, napi_value exports) 22{ 23 napi_property_descriptor desc[] = { 24 { "createFromReceiver", nullptr, createFromReceiver, nullptr, nullptr, nullptr, napi_default, nullptr }, 25 }; 26 27 napi_define_properties(env, exports, sizeof(desc) / sizeof(desc[0]), desc); 28 return exports; 29} 30EXTERN_C_END 31``` 32 33### Requesting Permissions 34 35To enable debugging, add the permissions to the **src\main\module.json5** file of the DevEco Studio project. For details about the fields in the configuration file, see [module.json5 Configuration File](../quick-start/module-configuration-file.md). 36 37 ``` 38 "requestPermissions":[ 39 { 40 "name" : "ohos.permission.CAMERA" 41 } 42 ] 43 ``` 44 45### Calling APIs on the JS Side 46 471. Open **src\main\cpp\types\*libentry*\index.d.ts** (where **libentry** varies according to the project name), and import the following files: 48 49 ```js 50 import image from '@ohos.multimedia.image' 51 52 export const createFromReceiver: (a: image.ImageReceiver) => image.Image; 53 ``` 54 552. Open **src\main\ets\pages\index.ets**, import ***libentry*.so** (where **libentry** varies according to the project name), call the native APIs, and pass in the JS resource object. The following is an example: 56 57 ```js 58 import testNapi from 'libentry.so' 59 import image from '@ohos.multimedia.image' 60 import abilityAccessCtrl from '@ohos.abilityAccessCtrl' 61 import camera from '@ohos.multimedia.camera' 62 63 @Entry 64 @Component 65 struct Index { 66 private receiver: image.ImageReceiver | undefined = undefined; 67 func (){ 68 let context = getContext() 69 abilityAccessCtrl.createAtManager().requestPermissionsFromUser(context,['ohos.permission.CAMERA']).then(async () => { 70 let cameraManager = await camera.getCameraManager(context); 71 // Obtain the supported camera devices. 72 let cameraDevices: Array<camera.CameraDevice> = cameraManager.getSupportedCameras(); 73 if (cameraDevices.length <= 0) { 74 return; 75 } 76 // Obtain the profiles of the cameras. 77 let profiles: camera.CameraOutputCapability = cameraManager.getSupportedOutputCapability(cameraDevices[0]) 78 let previewProfiles: Array<camera.Profile> = profiles.previewProfiles; 79 if (previewProfiles.length <= 0) { 80 return; 81 } 82 let profileObj = previewProfiles[0]; 83 this.receiver = image.createImageReceiver(profileObj.size.width, profileObj.size.height, image.ImageFormat.JPEG, 8); 84 let receiverSurfaceId: string = await this.receiver.getReceivingSurfaceId(); 85 // Create an output object for the preview stream. 86 let previewOutput: camera.PreviewOutput = cameraManager.createPreviewOutput(profileObj,receiverSurfaceId); 87 let cameraInput : camera.CameraInput = cameraManager.createCameraInput(cameraDevices[0]); 88 // Open a camera. 89 await cameraInput.open(); 90 // Create a session. 91 let captureSession : camera.CaptureSession = cameraManager.createCaptureSession(); 92 // Configure the session. 93 captureSession.beginConfig(); 94 // Add a CameraInput instance to the session. 95 captureSession.addInput(cameraInput); 96 // Add the preview stream to the session. 97 captureSession.addOutput(previewOutput); 98 // Commit the configuration. 99 await captureSession.commitConfig(); 100 // Start the session. 101 await captureSession.start(); 102 103 this.receiver.on('imageArrival', () => { 104 let img : image.Image = testNapi.createFromReceiver(this.receiver); 105 img.release(); 106 }) 107 108 }); 109 } 110 111 build() { 112 Row() { 113 Column() { 114 Button("start") 115 .width(100) 116 .height(100) 117 .onClick(() => { 118 console.log("button click in"); 119 if (this.receiver == undefined) { 120 this.func(); 121 } 122 }) 123 } 124 .width('100%') 125 } 126 .height('100%') 127 } 128 } 129 ``` 130 131 132### Calling the Native APIs 133 134For details about the APIs, see [Image API Reference](../reference/apis-image-kit/image.md). 135 136Obtain the JS resource object from the **hello.cpp** file and convert it to a native resource object. Then you can call native APIs. 137 138**Adding Reference Files** 139 140 ```c++ 141 142 #include <multimedia/image_framework/image_mdk.h> 143 #include <multimedia/image_framework/image_receiver_mdk.h> 144 #include <malloc.h> 145 #include <hilog/log.h> 146 147 static napi_value createFromReceiver(napi_env env, napi_callback_info info) 148 { 149 size_t argc = 1; 150 napi_value args[2] = {nullptr}; 151 napi_get_cb_info(env, info, &argc, args , nullptr, nullptr); 152 napi_valuetype valuetype0; 153 napi_typeof(env, args[0], &valuetype0); 154 napi_ref reference; 155 napi_create_reference(env, args[0], 1 ,&reference); 156 napi_value imgReceiver_js; 157 napi_get_reference_value(env, reference, &imgReceiver_js); 158 159 ImageReceiverNative * imgReceiver_c = OH_Image_Receiver_InitImageReceiverNative(env, imgReceiver_js); 160 161 int32_t capacity; 162 OH_Image_Receiver_GetCapacity(imgReceiver_c, &capacity); 163 OH_LOG_Print(LOG_APP, LOG_INFO, 0xFF00, "[receiver]", "capacity: %{public}d", capacity); 164 int32_t format; 165 OH_Image_Receiver_GetFormat(imgReceiver_c, &format); 166 OH_LOG_Print(LOG_APP, LOG_INFO, 0xFF00, "[receiver]", "format: %{public}d", format); 167 char * surfaceId = static_cast<char *>(malloc(sizeof(char))); 168 OH_Image_Receiver_GetReceivingSurfaceId(imgReceiver_c, surfaceId, sizeof(char)); 169 OH_LOG_Print(LOG_APP, LOG_INFO, 0xFF00, "[receiver]", "surfaceId: %{public}c", surfaceId[0]); 170 OhosImageSize size; 171 OH_Image_Receiver_GetSize(imgReceiver_c, &size); 172 OH_LOG_Print(LOG_APP, LOG_INFO, 0xFF00, "[receiver]", "OH_Image_Receiver_GetSize width: %{public}d, height:%{public}d", size.width, size.height); 173 174 int32_t ret; 175 napi_value nextImage; 176 // Alternatively, call OH_Image_Receiver_ReadNextImage(imgReceiver_c, &nextImage). 177 ret = OH_Image_Receiver_ReadLatestImage(imgReceiver_c, &nextImage); 178 179 ImageNative * nextImage_native = OH_Image_InitImageNative(env, nextImage); 180 181 OhosImageSize imageSize; 182 OH_Image_Size(nextImage_native, &imageSize); 183 OH_LOG_Print(LOG_APP, LOG_INFO, 0xFF00, "[receiver]", "OH_Image_Size width: %{public}d, height:%{public}d", imageSize.width, imageSize.height); 184 185 OhosImageComponent imgComponent; 186 ret = OH_Image_GetComponent(nextImage_native, 4, &imgComponent); // 4=jpeg 187 188 uint8_t *img_buffer = imgComponent.byteBuffer; 189 190 ret = OH_Image_Release(nextImage_native); 191 ret = OH_Image_Receiver_Release(imgReceiver_c); 192 return nextImage; 193 } 194 ``` 195