Skip to content

VisionCamera Frame Processor Plugin to detect faces using MLKit Vision Face Detector

License

Notifications You must be signed in to change notification settings

wilav-dev/vision-camera-face-detector

 
 

Repository files navigation

vision-camera-face-detector

VisionCamera Frame Processor Plugin to detect faces using MLKit Vision Face Detector

Installation

yarn add vision-camera-face-detector

Usage

import * as React from 'react';
import { runOnJS } from 'react-native-reanimated';

import { StyleSheet } from 'react-native';
import {
  useCameraDevices,
  useFrameProcessor,
} from 'react-native-vision-camera';

import { Camera } from 'react-native-vision-camera';
import { scanFaces, Face } from 'vision-camera-face-detector';

export default function App() {
  const [hasPermission, setHasPermission] = React.useState(false);
  const [faces, setFaces] = React.useState<Face[]>();

  const devices = useCameraDevices();
  const device = devices.front;

  React.useEffect(() => {
    console.log(faces);
  }, [faces]);

  React.useEffect(() => {
    (async () => {
      const status = await Camera.requestCameraPermission();
      setHasPermission(status === 'authorized');
    })();
  }, []);

  const frameProcessor = useFrameProcessor((frame) => {
    'worklet';
    const scannedFaces = scanFaces(frame);
    runOnJS(setFaces)(scannedFaces);
  }, []);

  return device != null && hasPermission ? (
    <Camera
      style={StyleSheet.absoluteFill}
      device={device}
      isActive={true}
      frameProcessor={frameProcessor}
      frameProcessorFps={5}
    />
  ) : null;
}

Contributing

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

License

MIT

About

VisionCamera Frame Processor Plugin to detect faces using MLKit Vision Face Detector

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • Java 50.0%
  • Swift 16.6%
  • Objective-C 13.1%
  • TypeScript 8.9%
  • JavaScript 5.8%
  • Ruby 5.2%
  • C 0.4%