Gathering detailed insights and metrics for react-native-camera-hooks
Gathering detailed insights and metrics for react-native-camera-hooks
Gathering detailed insights and metrics for react-native-camera-hooks
Gathering detailed insights and metrics for react-native-camera-hooks
React Hooks and API wrapper for the react-native-camera module. GitHub Actions CI/CD + Automatic Release
npm install react-native-camera-hooks
Typescript
Module System
Node Version
NPM Version
JavaScript (37.48%)
Java (22.54%)
TypeScript (15.38%)
C++ (10.46%)
Objective-C++ (6.37%)
Objective-C (3.45%)
Ruby (2.35%)
Starlark (0.86%)
Shell (0.69%)
CMake (0.41%)
Total Downloads
0
Last Day
0
Last Week
0
Last Month
0
Last Year
0
MIT License
107 Stars
82 Commits
15 Forks
3 Watchers
17 Branches
7 Contributors
Updated on Jul 08, 2024
Latest Version
0.5.3
Package Id
react-native-camera-hooks@0.5.3
Unpacked Size
73.20 kB
Size
18.39 kB
File Count
26
NPM Version
6.14.10
Node Version
12.22.7
Published on
Nov 21, 2021
Cumulative downloads
Total Downloads
Last Day
0%
NaN
Compared to previous day
Last Week
0%
NaN
Compared to previous week
Last Month
0%
NaN
Compared to previous month
Last Year
0%
NaN
Compared to previous year
70
Hooks for React Native Camera
React Native Camera Hooks provides you with functionality to use the React Native Camera API with Functional Components.
1import { View, TouchableOpacity, TouchableWithoutFeedback } from 'react-native'; 2import { RNCamera } from 'react-native-camera'; 3import { useCamera } from 'react-native-camera-hooks'; 4 5const FunctionalComponentExample = ({ initialProps }) => { 6 const [ 7 { cameraRef, type, ratio, autoFocus, autoFocusPoint, isRecording }, 8 { 9 toggleFacing, 10 touchToFocus, 11 textRecognized, 12 facesDetected, 13 recordVideo, 14 setIsRecording, 15 }, 16 ] = useCamera(initialProps); 17 18 return ( 19 <View style={{ flex: 1 }}> 20 <RNCamera 21 ref={cameraRef} 22 autoFocusPointOfInterest={autoFocusPoint.normalized} 23 type={type} 24 ratio={ratio} 25 style={{ flex: 1 }} 26 autoFocus={autoFocus} 27 onTextRecognized={textRecognized} 28 onFacesDetected={facesDetected} 29 /> 30 31 <TouchableWithoutFeedback 32 style={{ 33 flex: 1, 34 }} 35 onPress={touchToFocus} 36 /> 37 38 <TouchableOpacity 39 testID="button" 40 onPress={toggleFacing} 41 style={{ width: '100%', height: 45 }}> 42 {type} 43 </TouchableOpacity> 44 45 {!isRecording && ( 46 <TouchableOpacity 47 onPress={async () => { 48 try { 49 setIsRecording(true); 50 const data = await recordVideo(); 51 console.warn(data); 52 } catch (error) { 53 console.warn(error); 54 } finally { 55 setIsRecording(false); 56 } 57 }} 58 style={{ width: '100%', height: 45 }} 59 /> 60 )} 61 </View> 62 ); 63};
Constants are defined in constants and initalState.
Function | Description |
---|---|
useCamera(initialState) | Includes all camera hooks described below. See also the example above |
useZoom(state) | Zoom feature. Includes zoom , setZoom , zoomIn (increment by 0.01) and zoomOut (decrement by 0.1) |
useToggleFacing(state, modes) | Toggles between two values (front and back side of the camera). Includes type , toggleFacing . |
useAutoFocus(state, modes) | Toggles between two values (focus on or off). Includes autoFocus and toggleAutoFocus . |
useWhiteBalance(state) | Toggles between white balance values. Includes whiteBalance , toggleWB and setWhiteBalance . |
useFlash(state) | Toggles between flash modes. Includes flash , toggleFlash and setFlash . |
useAutoFocusTouch(state) | Touch to focus feature. Includes autoFocusPoint , touchToFocus (callback to be used in onPress for example) and setAutoFocusPoint . |
useTextRecognition(state) | Text recognition feature. Includes textBlocks , setTextblocks and textRecognized (callback). |
useFaceDetection(state) | Face detection feature. Includes faces , setFaces and facesDetected (callback). |
useBarcodeDetection(state) | Barcode detection feature. Includes barcodes , setBarcodes and barcodeRecognized (callback). |
takePicture({ cameraRef }, options) | Function to take a picture. Returns a Promise with the result. defaultPictureTakeOptions can also be imported from the same file. |
recordVideo({ cameraRef }, options) | Function to record a video. Returns a Promise with the result. defaultVideoRecordOptions can also be imported from the same file. |
stopRecording({ cameraRef }) | Function to stop recording. Returns a Promise. |
pausePreview({ cameraRef }) | Function to pause the camera preview. Returns a Promise with the result as a boolean. |
resumePreview({ cameraRef }) | Function to resume the camera preview. Returns a Promise with the result as a boolean. |
To install react-native-camera-hooks, do either
1npm install --save react-native-camera-hooks
or
1yarn add react-native-camera-hooks
Note that this requires a react-native version > 0.59 which supports React Hooks. Also, react-native-camera has to be installed.
No vulnerabilities found.
Reason
no dangerous workflow patterns detected
Reason
license file detected
Details
Reason
binaries present in source code
Details
Reason
Found 4/17 approved changesets -- score normalized to 2
Reason
0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0
Reason
detected GitHub workflow tokens with excessive permissions
Details
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
dependency not pinned by hash detected -- score normalized to 0
Details
Reason
security policy file not detected
Details
Reason
project is not fuzzed
Details
Reason
Project has not signed or included provenance with any releases.
Details
Reason
branch protection not enabled on development/release branches
Details
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
Reason
81 existing vulnerabilities detected
Details
Score
Last Scanned on 2025-07-07
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More