@buiducnhat/vision-camera-face-detector

VisionCamera Frame Processor Plugin to detect faces using MLKit Vision Face Detector forked from bglgwyng/vision-camera-face-detector - the orignal: rodgomesc/vision-camera-face-detector

Installation

1yarn add @buiducnhat/vision-camera-face-detector

Usage

1import * as React from 'react';
2import { runOnJS } from 'react-native-reanimated';
3
4import { StyleSheet } from 'react-native';
5import {
6  useCameraDevices,
7  useFrameProcessor,
8} from 'react-native-vision-camera';
9
10import { Camera } from 'react-native-vision-camera';
11import { scanFaces, Face } from '@buiducnhat/vision-camera-face-detector';
12
13export default function App() {
14  const [hasPermission, setHasPermission] = React.useState(false);
15  const [faces, setFaces] = React.useState<Face[]>();
16
17  const devices = useCameraDevices();
18  const device = devices.front;
19
20  React.useEffect(() => {
21    console.log(faces);
22  }, [faces]);
23
24  React.useEffect(() => {
25    (async () => {
26      const status = await Camera.requestCameraPermission();
27      setHasPermission(status === 'authorized');
28    })();
29  }, []);
30
31  const frameProcessor = useFrameProcessor((frame) => {
32    'worklet';
33    const scannedFaces = scanFaces(frame);
34    runOnJS(setFaces)(scannedFaces);
35  }, []);
36
37  return device != null && hasPermission ? (
38    <Camera
39      style={StyleSheet.absoluteFill}
40      device={device}
41      isActive={true}
42      frameProcessor={frameProcessor}
43      frameProcessorFps={5}
44    />
45  ) : null;
46}
47

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT