feat(core): allow aspectRatio configuration

Author: triniwiz

packages/mlkit-barcode-scanning/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nativescript/mlkit-barcode-scanning",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "NativeScript MLKit Barcode Scanner module",
   "main": "index",
   "typings": "index.d.ts",

packages/mlkit-core/common.ts

@@ -58,6 +58,7 @@ export class MLKitViewBase extends ContainerView {
   processEveryNthFrame: number;
   readonly latestImage?: ImageSource;
   retrieveLatestImage: boolean;
+  aspectRatio: 'aspect' | 'aspectFill' | 'fill';
 }
 
 export const cameraPositionProperty = new Property<MLKitViewBase, CameraPosition>({
@@ -67,6 +68,13 @@ export const cameraPositionProperty = new Property<MLKitViewBase, CameraPosition
 
 cameraPositionProperty.register(MLKitViewBase);
 
+export const aspectRatioProperty = new Property<MLKitViewBase, 'aspect' | 'aspectFill' | 'fill'>({
+  name: 'aspectRatio',
+  defaultValue: 'aspect',
+});
+
+aspectRatioProperty.register(MLKitViewBase);
+
 export const detectionTypeProperty = new Property<MLKitViewBase, DetectionType>({
   name: 'detectionType',
   defaultValue: DetectionType.None,

packages/mlkit-core/index.ios.ts

@@ -1,5 +1,5 @@
 import { ImageSource, Utils } from '@nativescript/core';
-import { BarcodeFormats, barcodeFormatsProperty, CameraPosition, cameraPositionProperty, DetectionType, detectionTypeProperty, faceDetectionMinFaceSizeProperty, faceDetectionPerformanceModeProperty, faceDetectionTrackingEnabledProperty, imageLabelerConfidenceThresholdProperty, MLKitViewBase, objectDetectionClassifyProperty, objectDetectionMultipleProperty, pauseProperty, processEveryNthFrameProperty, torchOnProperty } from './common';
+import { BarcodeFormats, barcodeFormatsProperty, CameraPosition, cameraPositionProperty, DetectionType, detectionTypeProperty, faceDetectionMinFaceSizeProperty, faceDetectionPerformanceModeProperty, faceDetectionTrackingEnabledProperty, imageLabelerConfidenceThresholdProperty, MLKitViewBase, objectDetectionClassifyProperty, objectDetectionMultipleProperty, pauseProperty, processEveryNthFrameProperty, torchOnProperty, aspectRatioProperty } from './common';
 import '@nativescript/core';
 import lazy from '@nativescript/core/utils/lazy';
 import { DetectionEvent, StillImageDetectionOptions } from '.';
@@ -17,6 +17,18 @@ export { BarcodeFormats, barcodeFormatsProperty, CameraPosition, cameraPositionP
 
 declare const TNSMLKitHelper, TNSMLKitHelperCameraPosition;
 
+function getGravity(value) {
+  switch (value) {
+    case 'fill':
+      return AVLayerVideoGravityResize;
+    case 'aspectFill':
+      return AVLayerVideoGravityResizeAspectFill;
+    case 'aspect':
+      return AVLayerVideoGravityResizeAspect;
+  }
+  return null;
+}
+
 export class MLKitView extends MLKitViewBase {
   #device: AVCaptureDevice;
   #preview: AVCaptureVideoPreviewLayer;
@@ -68,7 +80,7 @@ export class MLKitView extends MLKitViewBase {
   createNativeView() {
     const nativeView = UIView.new();
     this.#preview = AVCaptureVideoPreviewLayer.layerWithSession(this.#mlkitHelper.session);
-    this.#preview.videoGravity = AVLayerVideoGravityResizeAspect;
+    this.#preview.videoGravity = getGravity(this.aspectRatio) ?? AVLayerVideoGravityResizeAspect;
     nativeView.layer.insertSublayerAtIndex(this.#preview, 0);
     return nativeView;
   }
@@ -145,6 +157,18 @@ export class MLKitView extends MLKitViewBase {
     return this.#selfieSegmentor;
   }
 
+  [aspectRatioProperty.setNative](ratio) {
+    if (this.#preview) {
+      switch (ratio) {
+        case 'fill':
+        case 'aspectFill':
+        case 'aspect':
+          this.#preview.videoGravity = getGravity(ratio);
+          break;
+      }
+    }
+  }
+
   [cameraPositionProperty.setNative](value: CameraPosition) {
     switch (value) {
       case CameraPosition.FRONT:

packages/mlkit-core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nativescript/mlkit-core",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "NativeScript MLKit Core",
   "main": "index",
   "typings": "index.d.ts",

packages/mlkit-face-detection/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nativescript/mlkit-face-detection",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "NativeScript MLKit Face Detection module",
   "main": "index",
   "typings": "index.d.ts",

packages/mlkit-image-labeling/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nativescript/mlkit-image-labeling",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "NativeScript MLKit Image Labeling module",
   "main": "index",
   "typings": "index.d.ts",

packages/mlkit-object-detection/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nativescript/mlkit-object-detection",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "NativeScript MLKit Object Detection module",
   "main": "index",
   "typings": "index.d.ts",

packages/mlkit-pose-detection/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nativescript/mlkit-pose-detection",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "NativeScript MLKit Pose Detection module",
   "main": "index",
   "typings": "index.d.ts",

packages/mlkit-selfie-segmentation/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nativescript/mlkit-selfie-segmentation",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "NativeScript MLKit Self Segmentation module",
   "main": "index",
   "typings": "index.d.ts",

packages/mlkit-text-recognition/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nativescript/mlkit-text-recognition",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "NativeScript MLKit Text Recognition module",
   "main": "index",
   "typings": "index.d.ts",