react-native-microscope
Getting started
$ yarn add react-native-microscope
$ yarn add react-native-view-shot
RN >= 0.60
iOS:
- add pod 'RNMicroscope', :path => '../node_modules/react-native-microscope' in Podfile.
- cd ios && pod install
- Click on project General tab
- Under Embedded Binaries click + and add JH_Libary.framework
Mostly automatic installation
$ react-native link react-native-microscope
Manual installation
iOS
- In XCode, in the project navigator, right click
Libraries
➜Add Files to [your project's name]
- Go to
node_modules
➜react-native-microscope
and addRNMicroscope.xcodeproj
- In XCode, in the project navigator, select your project. Add
libRNMicroscope.a
to your project'sBuild Phases
➜Link Binary With Libraries
- Run your project (
Cmd+R
)<
Android
- Open up
android/app/src/main/java/[...]/MainActivity.java
- Add
import com.reactlibrary.RNMicroscopePackage;
to the imports at the top of the file - Add
new RNMicroscopePackage()
to the list returned by thegetPackages()
method
- Append the following lines to
android/settings.gradle
:include ':react-native-microscope' project(':react-native-microscope').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-microscope/android')
- Insert the following lines inside the dependencies block in
android/app/build.gradle
:compile project(':react-native-microscope')
Usage
; return <> <StatusBar barStyle="dark-content" /> <View style= flex: 1 > <RNMicroscopeView style= flex: 1 width: "100%" height: "100%" onStartCapture= console onCaptureSuccess= onCaptureError= console /> </View> </>;
; return <> <StatusBar barStyle="dark-content" /> <View style= flex: 1 > <RNMicroscopeView ref="microscope" styleMicroscope=stylesmicroscope buttonCaptureComponent= <TouchableOpacity onPress= thisrefsmicroscope> <Text>Button custom</Text> </TouchableOpacity> onStartCapture= console onCaptureSuccess= onCaptureError= console /> </View> </>;
Props
onStartCapture
(Function) - return callback when start captureonCaptureSuccess
(Function) - return base64 or urionCaptureError
(Function) - return error capturestyle
(Object) - style containerstyleMicroscope
(Object) - style camera viewbuttonCaptureComponent
(Component) - custom button capture (using this.refs.microscope._onCapture())optionFormat
(Object) - option format image, default is{ format: "png", quality: 0.9 }