Skip to content

Commit bbf32a4

Browse files
luiguildluiguild
committed
npm publish
0 parents  commit bbf32a4

27 files changed

+2077
-0
lines changed

‎.npmignore

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
demo/
2+
.idea/
3+
support/
4+
*.tar
5+
*.tgz
6+
.npmignore
7+
*.map
8+
*.ts
9+
!*.d.ts
10+
tsconfig.json
11+
scripts
12+
.DS_Store
13+
*.aar
14+
node_modules

‎README.md

Lines changed: 168 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,168 @@
1+
<img src="https://raw.githubusercontent.com/Yoonit-Labs/nativescript-yoonit-camera/development/logo_cyberlabs.png" width="300">
2+
3+
# Nativescript Yoonit Camera
4+
5+
![Generic badge](https://img.shields.io/badge/version-v1.0.0-<COLOR>.svg) ![MIT license](https://img.shields.io/badge/License-MIT-blue.svg)
6+
7+
A NativeScript plugin to provide:
8+
- Modern Android Camera API (Camera X)
9+
- MLKit integration
10+
- Camera preview (Front & Back)
11+
- Face detection (With Min & Max size (Soon))
12+
- Landmark detection (Soon)
13+
- Face crop
14+
- Face capture
15+
- Frame capture (Soon)
16+
- Face ROI (Soon)
17+
- QR Code scanning
18+
19+
## Installation
20+
21+
```javascript
22+
npm i -s @yoonit/nativescript-camera
23+
```
24+
25+
## Usage
26+
27+
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).
28+
29+
#### Vue Component
30+
`App.vue`
31+
```vue
32+
<template>
33+
<Page @loaded="onLoaded">
34+
<YoonitCamera
35+
id="yooCamera"
36+
@faceDetected="doFaceDetected"
37+
@faceImage="doFaceImage"
38+
@endCapture="doEndCapture"
39+
@qrCodeContent="doQRCodeContent"
40+
@status="doStatus"
41+
@permissionDenied="doPermissionDenied"
42+
/>
43+
</Page>
44+
</template>
45+
46+
<script>
47+
export default {
48+
data: () => ({
49+
$yoo: null
50+
}),
51+
52+
methods: {
53+
async onLoaded(args) {
54+
this.$yoo = {
55+
camera: null
56+
}
57+
58+
console.log('[YooCamera] Getting Camera view')
59+
this.$yoo.camera = args.object.getViewById('yooCamera')
60+
61+
console.log('[YooCamera] Getting permission')
62+
const permissionGranted = await this.$yoo.camera.requestPermission()
63+
64+
if (permissionGranted) {
65+
console.log('[YooCamera] Permission granted, start preview')
66+
this.$yoo.camera.preview()
67+
}
68+
},
69+
70+
doFaceDetected({ faceDetected }) {
71+
console.log('[YooCamera] faceDetected', faceDetected)
72+
},
73+
74+
doFaceImage({
75+
count,
76+
total,
77+
image: {
78+
path,
79+
source
80+
}
81+
}) {
82+
if (total !== 0) {
83+
console.log('[YooCamera] doFaceImage', `[${count}] of [${total}] - ${path}`)
84+
} else {
85+
console.log('[YooCamera] doFaceImage', `[${count}] ${path}`)
86+
}
87+
88+
console.log('[YooCamera] doFaceImage', path, source)
89+
},
90+
91+
doEndCapture() {
92+
console.log('[YooCamera] doEndCapture')
93+
},
94+
95+
doQRCodeContent({ content }) {
96+
console.log('[YooCamera] doQRCodeContent', content)
97+
},
98+
99+
doStatus({ status }) {
100+
console.log('[YooCamera] doStatus', JSON.parse(status))
101+
},
102+
103+
doToggleLens() {
104+
const currentCameraLens = this.$yoo.camera.getLens()
105+
106+
console.log('[YooCamera] doToggleLens', currentCameraLens)
107+
108+
this.$yoo.camera.toggleLens()
109+
},
110+
111+
doStartCapture(captureType) {
112+
console.log('[YooCamera] doStartCapture', captureType)
113+
114+
this.$yoo.camera.startCapture(captureType)
115+
},
116+
117+
doFaceDetectionBox(status) {
118+
console.log('[YooCamera] doFaceDetectionBox', status)
119+
120+
this.$yoo.camera.setFaceDetectionBox(status)
121+
},
122+
123+
doPermissionDenied() {
124+
console.log('[YooCamera] doPermissionDenied')
125+
}
126+
}
127+
}
128+
</script>
129+
```
130+
131+
## API
132+
133+
#### Methods
134+
| Function | Parameters | Return Type | Valid values | Description |
135+
|-|-|-|-|-|
136+
| **`hasPermission`** | - | boolean | - | Return if application has camera permission.
137+
| **`preview`** | - | void | - | Start camera preview if has permission.
138+
| **`startCapture`** | `captureType: string` | void | `none` default capture type. `face` for face recognition. `barcode` to read barcode content. | Set capture type none, face or barcode.
139+
| **`stopCapture`** | - | void | - | Stop any type of capture.
140+
| **`toggleLens`** | - | void | - | Set camera lens facing front or back.
141+
| **`getLens`** | - | number | - | Return `number` that represents lens face state: 0 for front 1 for back camera.
142+
| **`setFaceNumberOfImages`** | `faceNumberOfImages: number` | void | Any positive `number` value | Default value is 0. For value 0 is saved infinity images. When saved images reached the "face number os images", the `onEndCapture` is triggered.
143+
| **`setFaceDetectionBox`** |`faceDetectionBox: boolean` | void | `true` or `false` | Set to show face detection box when face detected.
144+
| **`setFaceTimeBetweenImages`** | `faceTimeBetweenImages: number` | void | Any positive `number` that represent time in milli seconds | Set saving face images time interval in milli seconds.
145+
| **`setFacePaddingPercent`** | `facePaddingPercent: number` | void | Any positive `number` value | Set face image and bounding box padding in percent.
146+
| **`setFaceImageSize`** | `faceImageSize: number` | void | Any positive `number` value | Set face image size to be saved.
147+
148+
149+
#### Events
150+
| Event | Parameters | Description |
151+
|-|-|-|
152+
| faceImage | `{ count: number, total: number, image: object = { path: string, source: blob } }` | Must have started capture type of face (see `startCapture`). Emitted when the face image file is created: <ul><li>count: current index</li><li>total: total to create</li><li>image.path: the face image path</li><li>image.source: the blob file</li><ul>
153+
| faceDetected | `{ faceDetected: boolean }` | Emitted `true` while the camera detects a face. Emitted `false` once when a face is no more detected
154+
| endCapture | - | Emitted when the number of face image files created is equal of the number of images set (see the method `setFaceNumberOfImages`).
155+
| qrCodeContent | `{ content: string }` | Must have started capture type of barcode (see `startCapture`). Emitted when the camera scan a QR Code.
156+
| status |`{ type: 'error'/'message', status: string }` | Emitted message error from native. Used more often for debug purpose.
157+
| permissionDenied | - | Emitted when try to `preview` but there is not camera permission.
158+
159+
160+
## To contribute and make it better
161+
162+
Clone the repo, change what you want and send PR.
163+
164+
Contributions are always welcome!
165+
166+
---
167+
168+
Code with ❤ by the [**Cyberlabs AI**](https://cyberlabs.ai/) Front-End Team

‎Yoonit.Camera.android.d.ts

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
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+
startCapture(captureType: string): void;
8+
setFaceNumberOfImages(faceNumberOfImages: number): void;
9+
setFaceDetectionBox(faceDetectionBox: boolean): void;
10+
setFaceTimeBetweenImages(faceTimeBetweenImages: number): void;
11+
setFacePaddingPercent(facePaddingPercent: number): void;
12+
setFaceImageSize(faceImageSize: number): void;
13+
requestPermission(explanation?: string): Promise<boolean>;
14+
hasPermission(): boolean;
15+
}

‎Yoonit.Camera.android.js

Lines changed: 156 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎Yoonit.Camera.android.js.map

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)