Skip to content

Commit dc9c467

Browse files
TeruyaHaroldoTeruyaHaroldo
committed
npm publish
0 parents  commit dc9c467

32 files changed

+9267
-0
lines changed

‎.npmignore

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
demo/
2+
.idea/
3+
support/
4+
*.tar
5+
*.tgz
6+
.npmignore
7+
*.map
8+
*.ts
9+
tsconfig.json
10+
scripts
11+
.DS_Store
12+
*.aar
13+
node_modules
14+
*.esm.json
15+
!extractTGZ.js
16+
*.js.map
17+
*.log
18+
19+
# Editor directories and files
20+
.idea
21+
.vscode

‎README.md

Lines changed: 213 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,213 @@
1+
[<img src="https://raw.githubusercontent.com/Yoonit-Labs/nativescript-yoonit-camera/development/logo_cyberlabs.png" width="300">](https://cyberlabs.ai/)
2+
3+
# NativeScript Yoonit Camera
4+
5+
![NativeScript](https://img.shields.io/badge/NativeScript-7-lightgrey.svg?style=for-the-badge&logo=nativescript) ![Version](https://img.shields.io/npm/v/@yoonit/nativescript-camera?color=lightgrey&style=for-the-badge&logo=npm) ![Downloads](https://img.shields.io/npm/dm/@yoonit/nativescript-camera?color=lightgrey&logo=npm&style=for-the-badge)
6+
7+
![Android](https://img.shields.io/badge/Android-YES-lightgrey.svg?style=for-the-badge&logo=android) ![iOS](https://img.shields.io/badge/iOS-YES-lightgrey.svg?style=for-the-badge&logo=apple) ![MIT license](https://img.shields.io/npm/l/@yoonit/nativescript-camera?color=lightgrey&style=for-the-badge)
8+
9+
A NativeScript plugin to provide:
10+
- Modern Android Camera API (Camera X)
11+
- MLKit integration
12+
- Camera preview (Front & Back)
13+
- Face detection (With Min & Max size)
14+
- Landmark detection (Soon)
15+
- Face crop
16+
- Face capture
17+
- Frame capture
18+
- Face ROI
19+
- QR Code scanning
20+
21+
## Installation
22+
23+
```javascript
24+
npm i -s @yoonit/nativescript-camera
25+
```
26+
27+
## Usage
28+
29+
All the functionalities that the `@yoonit/nativescript-camera` provides is accessed through the `YoonitCamera` component, that includes the camera preview. Below we have the basic usage code, for more details, your can see the [**Methods**](#methods), [**Events**](#events) or the [**Demo Vue**](https://github.com/Yoonit-Labs/nativescript-yoonit-camera/tree/development/demo-vue).
30+
31+
#### VueJS Plugin
32+
`main.js`
33+
```javascript
34+
import Vue from 'nativescript-vue'
35+
import YoonitCamera from '@yoonit/nativescript-camera/vue'
36+
37+
Vue.use(YoonitCamera)
38+
```
39+
40+
After that, you can access the camera object in your entire project using `this.$yoo.camera`
41+
42+
#### Vue Component
43+
`App.vue`
44+
```vue
45+
<template>
46+
<Page @loaded="onLoaded">
47+
<YoonitCamera
48+
ref="yooCamera"
49+
lens="front"
50+
captureType="face"
51+
imageCapture=true
52+
imageCaptureAmount=10
53+
imageCaptureInterval=500
54+
faceDetectionBox=true
55+
@faceDetected="doFaceDetected"
56+
@imageCaptured="doImageCaptured"
57+
@endCapture="doEndCapture"
58+
@qrCodeContent="doQRCodeContent"
59+
@status="doStatus"
60+
@permissionDenied="doPermissionDenied"
61+
/>
62+
</Page>
63+
</template>
64+
65+
<script>
66+
export default {
67+
data: () => ({}),
68+
69+
methods: {
70+
async onLoaded() {
71+
72+
console.log('[YooCamera] Getting Camera view')
73+
this.$yoo.camera.registerElement(this.$refs.yooCamera)
74+
75+
console.log('[YooCamera] Getting permission')
76+
if (await this.$yoo.camera.requestPermission()) {
77+
78+
console.log('[YooCamera] Permission granted, start preview')
79+
this.$yoo.camera.preview()
80+
}
81+
},
82+
83+
doFaceDetected({ x, y, width, height }) {
84+
console.log('[YooCamera] doFaceDetected', `{x: ${x}, y: ${y}, width: ${width}, height: ${height}}`)
85+
if (!x || !y || !width || !height) {
86+
this.imagePath = null
87+
}
88+
},
89+
90+
doImageCaptured({
91+
type,
92+
count,
93+
total,
94+
image: {
95+
path,
96+
source
97+
}
98+
}) {
99+
if (total === 0) {
100+
console.log('[YooCamera] doImageCreated', `${type}: [${count}] ${path}`)
101+
this.imageCreated = `${count}`
102+
} else {
103+
console.log('[YooCamera] doImageCreated', `${type}: [${count}] of [${total}] - ${path}`)
104+
this.imageCreated = `${count} de ${total}`
105+
}
106+
107+
this.imagePath = source
108+
},
109+
110+
doEndCapture() {
111+
console.log('[YooCamera] doEndCapture')
112+
},
113+
114+
doQRCodeContent({ content }) {
115+
console.log('[YooCamera] doQRCodeContent', content)
116+
},
117+
118+
doStatus({ status }) {
119+
console.log('[YooCamera] doStatus', status)
120+
},
121+
122+
doPermissionDenied() {
123+
console.log('[YooCamera] doPermissionDenied')
124+
}
125+
}
126+
}
127+
</script>
128+
```
129+
130+
## API
131+
132+
### Props
133+
134+
| Props | Input/Format | Default value | Description |
135+
| - | - | - | - |
136+
| lens | `"front"` or `"back"` | `"front"` | The camera lens to use "front" or "back". |
137+
| captureType | `"none"`, `"front"`, `"frame"` or `"qrcode"` | `"none"` | The capture type of the camera. |
138+
| imageCapture | boolean | `false` | Enable/disabled save image capture. |
139+
| imageCaptureAmount | number | `0` | The image capture amount goal. |
140+
| imageCaptureInterval | number | `1000` | The image capture time interval in milliseconds. |
141+
| imageCaptureWidth | `"NNpx"` | `"200px"` | The image capture width in pixels. |
142+
| imageCaptureHeight | `"NNpx"` | `"200px"` | The image capture height in pixels. |
143+
| colorEncoding | `"RGB"` or `"YUV"` | `"RGB"` | Only for android. The image capture color encoding type: `"RGB"` or `"YUV"`. |
144+
| faceDetectionBox | boolean | `false` | Show/hide the face detection box. |
145+
| faceMinSize | `"NN%"` | `"0%"` | The face minimum size percentage to capture. |
146+
| faceMaxSize | `"NN%"` | `"100%"` | The face maximum size percentage to capture. |
147+
| faceROI | boolean | `false` | Enable/disable the region of interest capture. |
148+
| faceROITopOffset | `"NN%"` | `"0%"` | Distance in percentage of the top face bounding box with the top of the camera preview. |
149+
| faceROIRightOffset | `"NN%"` | `"0%"` | Distance in percentage of the right face bounding box with the right of the camera preview.
150+
| faceROIBottomOffset | `"NN%"` | `"0%"` | Distance in percentage of the bottom face bounding box with the bottom of the camera preview.
151+
| faceROILeftOffset | `"NN%"` | `"0%"` | Distance in percentage of the left face bounding box with the left of the camera preview.
152+
| faceROIMinSize | `"NN%"` | `"0%"` | The minimum face size related within the ROI. |
153+
154+
#### Methods
155+
156+
| Function | Parameters | Valid values | Return Type | Description
157+
| - | - | - | - | -
158+
| requestPermission | - | - | promise | Ask the user to give the permission to access camera. |
159+
| hasPermission | - | - | boolean | Return if application has camera permission. |
160+
| preview | - | - | void | Start camera preview if has permission. |
161+
| startCapture | `type: string` | <ul><li>`"none"`</li><li>`"face"`</li><li>`"qrcode"`</li><li>`"frame"`</li></ul> | void | Set capture type "none", "face", "qrcode" or "frame". Default value is `"none"`. |
162+
| stopCapture | - | - | void | Stop any type of capture. |
163+
| toggleLens | - | - | void | Toggle camera lens facing "front"/"back". |
164+
| setCameraLens | `lens: string` | `"front"` or `"back"` | void | Set camera to use "front" or "back" lens. Default value is `"front"`. |
165+
| getLens | - | - | string | Return "front" or "back". |
166+
| setImageCapture | `enable: boolean` | `true` or `false` | void | Enable/disabled save image capture. Default value is `false` |
167+
| setImageCaptureAmount | `amount: Int` | Any positive `Int` value | void | For value `0`, save infinity images. When the capture image amount is reached, the event `onEndCapture` is triggered. Default value is `0`. |
168+
| setImageCaptureInterval | `interval: number` | Any positive number that represent time in milliseconds | void | Set the image capture time interval in milliseconds. |
169+
| setImageCaptureWidth | `width: string` | Value format must be in `NNpx` | void | Set the image capture width in pixels. |
170+
| setImageCaptureHeight | `height: string` | Value format must be in `NNpx` | void | Set the image capture height in pixels. |
171+
| setImageCaptureColorEncoding | `colorEncoding: string` | `"YUV"` or `"RGB"` | void | Only for android. Set the image capture color encoding type: `"RGB"` or `"YUV"`. |
172+
| setFaceDetectionBox | `enable: boolean` | `true` or `false` | void | Set to show/hide the face detection box. |
173+
| setFacePaddingPercent | `percentage: string` | Value format must be in `NN%` | void | Set face image capture and detection box padding in percentage. |
174+
| setFaceCaptureMinSize | `percentage: string` | Value format must be in `NN%` | void | Set the face minimum size percentage to capture. |
175+
| setFaceCaptureMaxSize | `percentage: string` | Value format must be in `NN%` | void | Set the face maximum size percentage to capture. |
176+
| setFaceROIEnable | `enable: boolean` | `true` or `false` | void | Enable/disable face region of interest capture. |
177+
| setFaceROITopOffset | `percentage: string` | Value format must be in `NN%` | void | Distance in percentage of the top face bounding box with the top of the camera preview. |
178+
| setFaceROIRightOffset | `percentage: string` | Value format must be in `NN%` | void | Distance in percentage of the right face bounding box with the right of the camera preview. |
179+
| setFaceROIBottomOffset | `percentage: string` | Value format must be in `NN%` | void | Distance in percentage of the bottom face bounding box with the bottom of the camera preview. |
180+
| setFaceROILeftOffset | `percentage: string` | Value format must be in `NN%` | void | Distance in percentage of the left face bounding box with the left of the camera preview. |
181+
| setFaceROIMinSize | `percentage: string` | Value format must be in `NN%` | void | Set the minimum face size related within the ROI. |
182+
183+
#### Events
184+
185+
| Event | Parameters | Description
186+
| - | - | -
187+
| imageCaptured | `{ type: string, count: number, total: number, image: object = { path: string, source: blob } }` | Must have started capture type of face/frame. Emitted when the face image file saved: <ul><li>type: "face" or "frame"</li>count: current index</li><li>total: total to create</li><li>image.path: the face/frame image path</li><li>image.source: the blob file</li><ul>
188+
| faceDetected | `{ x: number, y: number, width: number, height: number }` | Must have started capture type of face. Emit the detected face bounding box. Emit all parameters null if no more face detecting.
189+
| endCapture | - | Must have started capture type of face/frame. Emitted when the number of image files created is equal of the number of images set (see the method `setImageCaptureAmount`).
190+
| qrCodeContent | `{ content: string }` | Must have started capture type of qrcode (see `startCapture`). Emitted when the camera read a QR Code.
191+
| status | `{ type: 'error'/'message', status: string }` | Emit message error from native. Used more often for debug purpose.
192+
| permissionDenied | - | Emit when try to `preview` but there is not camera permission.
193+
194+
### Message
195+
196+
Pre-define message constants used by the `status` event.
197+
198+
| Message | Description
199+
| - | -
200+
| INVALID_CAPTURE_FACE_MIN_SIZE | Face width percentage in relation of the screen width is less than the set (`setFaceCaptureMinSize`).
201+
| INVALID_CAPTURE_FACE_MAX_SIZE | Face width percentage in relation of the screen width is more than the set (`setFaceCaptureMaxSize`).
202+
| INVALID_CAPTURE_FACE_OUT_OF_ROI | Face bounding box is out of the set region of interest (`setFaceROIOffset`).
203+
| INVALID_CAPTURE_FACE_ROI_MIN_SIZE | Face width percentage in relation of the screen width is less than the set (`setFaceROIMinSize`).
204+
205+
## To contribute and make it better
206+
207+
Clone the repo, change what you want and send PR.
208+
209+
Contributions are always welcome!
210+
211+
---
212+
213+
Code with ❤ by the [**Cyberlabs AI**](https://cyberlabs.ai/) Front-End Team

‎Yoonit.Camera.android.d.ts

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import { CameraBase } from './Yoonit.Camera.common';
2+
export declare class YoonitCamera extends CameraBase {
3+
nativeView: ai.cyberlabs.yoonit.camera.CameraView;
4+
createNativeView(): Object;
5+
initNativeView(): void;
6+
disposeNativeView(): void;
7+
requestPermission(explanation?: string): Promise<boolean>;
8+
hasPermission(): boolean;
9+
setImageCaptureColorEncoding(colorEncoding: string): void;
10+
}

0 commit comments

Comments
 (0)