Support
Quality
Security
License
Reuse
kandi has reviewed react-native-camera and discovered the below as its top functions. This is intended to give you an instant insight into react-native-camera implemented functionality, and help decide if they suit your requirements.
A Camera component for React Native. Also supports barcode scanning!
Example import
import { RNCamera, FaceDetector } from 'react-native-camera';
Contributing
<uses-permission android:name="android.permission.CAMERA" />
Undefined is not an object (evaluating '_$$_REQUIRE(_dependencyMap[5], "expo-camera").Camera')
npx install-expo-modules
{
...
devDependencies:{
"expo-camera": "~12.0.3"
}
...
}
{
...
dependencies:{
"expo-camera": "~12.0.3"
}
...
}
-----------------------
npx install-expo-modules
{
...
devDependencies:{
"expo-camera": "~12.0.3"
}
...
}
{
...
dependencies:{
"expo-camera": "~12.0.3"
}
...
}
-----------------------
npx install-expo-modules
{
...
devDependencies:{
"expo-camera": "~12.0.3"
}
...
}
{
...
dependencies:{
"expo-camera": "~12.0.3"
}
...
}
react native typescript screen test returning Test suite failed to run AsyncStorage is null
npm uninstall @react-native-community/async-storage
npm install @react-native-async-storage/async-storage
Invalid hook call. Hooks can only be called inside of the body of a function component. in react native
import React, {useState} from 'react';
import {StyleSheet, View, Text} from 'react-native';
import AppBtn from '../../components/AppButton';
import CustomText from '../../components/CustomText';
import AppScreen from '../../components/AppScreen';
import TextField from '../../components/TextField';
import Colors from '../../config/Colors';
import {useValidation} from 'react-native-form-validator';
function Register({navigation}) {
const [name, setName] = useState('Enter Name');
const [email, setEmail] = useState('Enter Mail');
const [newPassword, setNewPassword] = useState('Enter password');
const [confirmPassword, setConfirmPassword] = useState('Confirm password');
const {validate, isFieldInError, getErrorsInField, getErrorMessages} =
useValidation({
state: {name, email, number, newPassword, confirmPassword},
});
const fieldError = ({field}) => {
{
isFieldInError(field) &&
getErrorsInField(field).map(errorMessage => (
<Text style={styles.text}>{errorMessage}</Text>
));
}
};
const onPressButton = () => {
validate({
name: {minlength: 3, maxlength: 30, required: true},
email: {email: true},
newPassword: {minlength: 6, required: true},
confirmPassword: {equalPassword: newPassword},
});
};
return (
<AppScreen style={{alignItems: 'center'}}>
<CustomText
text="Sign Up"
style="bold head"
otherStyle={{marginTop: 100}}
/>
<View style={styles.hairline} />
<TextField
data="user name"
other="name"
onChangeText={setName}
value={name}
/>
{fieldError('name')}
<TextField data="mail" onChangeText={setEmail} value={email} />
{fieldError('email')}
<TextField
data="password"
onChangeText={setNewPassword}
value={newPassword}
/>
{fieldError('newPassword')}
<TextField
data="confirm password"
onChangeText={setConfirmPassword}
value={confirmPassword}
/>
{fieldError('confirmPassword')}
<AppBtn text="Register" onPress={onPressButton} />
<AppBtn
text="Return back"
style={{
backgroundColor: Colors.primary,
width: '30%',
marginTop: 100,
}}
onPress={() => navigation.navigate('PreAuth')}
/>
<Text>{getErrorMessages()}</Text>
</AppScreen>
);
}
const styles = StyleSheet.create({
container: {},
hairline: {
backgroundColor: Colors.secondary,
marginTop: 10,
height: 2,
width: '50%',
marginBottom: 70,
},
text: {
margin: 10,
},
});
export default Register;
React Native: Java heap space
org.gradle.jvmargs=-Xmx2g -XX\:MaxHeapSize\=4g
Proptypes function react native Typescript
interface propTypes {
isVisible : boolean,
scanCallback: (_data: string, _type: string) => void,
OnCloseModal: () => void
}
Alternative for MediaScanner scanFile / CameraRoll on Android 29/Q
import RNFS from 'react-native-fs'
const { PNModule } = ReactNative.NativeModules
try {
if (Platform.OS === 'android' && Platform.Version >= 29) {
// Google ask that the requestLegacyExternalStorage is no longer used when targeting android 11, and use
// the scoped storage or the new global permission, see https://gitlab.inria.fr/floristic/pn-mobile-test/-/issues/417
// Solution here, custom module which use the MediaStore API and copy the file to the DCIM folders.
const segments = path.split('/')
const fileName = segments[segments.length - 1]
const fileUriPath = await PNModule.moveToMediaStore(path.replace('file://', ''), fileName)
if (!fileUriPath) {
return null
}
const scanResult = await RNFS.scanFile(fileUriPath)
if (fileUriPath.startsWith('file:///')) {
return fileUriPath
}
return `file://${fileUriPath}`
}
return await CameraRoll.save(path)
} catch (error) {
console.error(error)
}
@ReactMethod
public void moveToMediaStore(String filePath, String fileName, Promise promise) {
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.Q) {
promise.resolve(null);
return;
}
ContentValues values = new ContentValues();
values.put(MediaStore.Images.Media.DISPLAY_NAME, fileName);
values.put(MediaStore.Images.Media.MIME_TYPE, "image/jpeg");
values.put(MediaStore.MediaColumns.RELATIVE_PATH, Environment.DIRECTORY_DCIM + "/APPNAME");
values.put(MediaStore.MediaColumns.IS_PENDING, 1);
ContentResolver resolver = getReactApplicationContext().getContentResolver();
Uri imageUri = resolver.insert(MediaStore.Images.Media.EXTERNAL_CONTENT_URI, values);
try {
OutputStream fos = resolver.openOutputStream(imageUri);
copy(new File(filePath), fos);
values.clear();
values.put(MediaStore.Video.Media.IS_PENDING, 0);
resolver.update(imageUri, values, null, null);
promise.resolve(getNameFromContentUri(getReactApplicationContext(), imageUri));
} catch (Exception e) {
e.printStackTrace();
promise.reject(e);
}
}
@RequiresApi(api = Build.VERSION_CODES.Q)
public static void copy(File src, OutputStream out) throws IOException {
try (InputStream in = new FileInputStream(src)) {
FileUtils.copy(in, out);
}
}
// From https://stackoverflow.com/a/64359655/1377145
public static String getNameFromContentUri(Context context, Uri contentUri){
ContentResolver contentResolver = context.getContentResolver();
Cursor cursor = contentResolver.query(contentUri, null, null, null, null);
cursor.moveToFirst();
String document_id = cursor.getString(0);
document_id = document_id.substring(document_id.lastIndexOf(":") + 1);
cursor.close();
cursor = contentResolver.query(
android.provider.MediaStore.Images.Media.EXTERNAL_CONTENT_URI,
null, MediaStore.Images.Media._ID + " = ? ", new String[]{document_id}, null);
cursor.moveToFirst();
String path = cursor.getString(cursor.getColumnIndex(MediaStore.Images.Media.DATA));
cursor.close();
return path;
}
-----------------------
import RNFS from 'react-native-fs'
const { PNModule } = ReactNative.NativeModules
try {
if (Platform.OS === 'android' && Platform.Version >= 29) {
// Google ask that the requestLegacyExternalStorage is no longer used when targeting android 11, and use
// the scoped storage or the new global permission, see https://gitlab.inria.fr/floristic/pn-mobile-test/-/issues/417
// Solution here, custom module which use the MediaStore API and copy the file to the DCIM folders.
const segments = path.split('/')
const fileName = segments[segments.length - 1]
const fileUriPath = await PNModule.moveToMediaStore(path.replace('file://', ''), fileName)
if (!fileUriPath) {
return null
}
const scanResult = await RNFS.scanFile(fileUriPath)
if (fileUriPath.startsWith('file:///')) {
return fileUriPath
}
return `file://${fileUriPath}`
}
return await CameraRoll.save(path)
} catch (error) {
console.error(error)
}
@ReactMethod
public void moveToMediaStore(String filePath, String fileName, Promise promise) {
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.Q) {
promise.resolve(null);
return;
}
ContentValues values = new ContentValues();
values.put(MediaStore.Images.Media.DISPLAY_NAME, fileName);
values.put(MediaStore.Images.Media.MIME_TYPE, "image/jpeg");
values.put(MediaStore.MediaColumns.RELATIVE_PATH, Environment.DIRECTORY_DCIM + "/APPNAME");
values.put(MediaStore.MediaColumns.IS_PENDING, 1);
ContentResolver resolver = getReactApplicationContext().getContentResolver();
Uri imageUri = resolver.insert(MediaStore.Images.Media.EXTERNAL_CONTENT_URI, values);
try {
OutputStream fos = resolver.openOutputStream(imageUri);
copy(new File(filePath), fos);
values.clear();
values.put(MediaStore.Video.Media.IS_PENDING, 0);
resolver.update(imageUri, values, null, null);
promise.resolve(getNameFromContentUri(getReactApplicationContext(), imageUri));
} catch (Exception e) {
e.printStackTrace();
promise.reject(e);
}
}
@RequiresApi(api = Build.VERSION_CODES.Q)
public static void copy(File src, OutputStream out) throws IOException {
try (InputStream in = new FileInputStream(src)) {
FileUtils.copy(in, out);
}
}
// From https://stackoverflow.com/a/64359655/1377145
public static String getNameFromContentUri(Context context, Uri contentUri){
ContentResolver contentResolver = context.getContentResolver();
Cursor cursor = contentResolver.query(contentUri, null, null, null, null);
cursor.moveToFirst();
String document_id = cursor.getString(0);
document_id = document_id.substring(document_id.lastIndexOf(":") + 1);
cursor.close();
cursor = contentResolver.query(
android.provider.MediaStore.Images.Media.EXTERNAL_CONTENT_URI,
null, MediaStore.Images.Media._ID + " = ? ", new String[]{document_id}, null);
cursor.moveToFirst();
String path = cursor.getString(cursor.getColumnIndex(MediaStore.Images.Media.DATA));
cursor.close();
return path;
}
Which component should I use class or functional?
this.state = {
token: this.props.route.params.token,
is_camera: 0,
is_loading: 0,
barcodes: [],
camera: {
type: RNCamera.Constants.Type.back,
flashMode: RNCamera.Constants.FlashMode.auto,
},
};
}
react-native-camera: Android app crashing without error
03-31 21:51:16.152 13039 13039 E unknown:ViewManager: Error while updating prop playSoundOnCapture
03-31 21:51:16.152 13039 13039 E unknown:ViewManager: java.lang.reflect.InvocationTargetException
... a bunch of traceback lines
03-31 21:51:16.152 13039 13039 E unknown:ViewManager: Caused by: java.lang.NoSuchMethodError: No virtual method setPlaySoundOnCapture(Z)V in class Lorg/reactnative/camera/RNCameraView; or its super classes (declaration of 'org.reactnative.camera.RNCameraView' appears in /data/app/~~2TIdBhLTuyzCkV7CYFT2Mg==/com.chowtime-uS9KR34-elnZ0EmL_ovT3w==/base.apk!classes4.dex)
Text Recognition with RNCamera
onTextRecognized={({textBlocks})=>{console.log(textBlocks)}}
Error: Element type is invalid with Check the render method in React Native
import {Ionicons} from 'react-native-vector-icons/Ionicons';
import Ionicons from 'react-native-vector-icons/Ionicons';
-----------------------
import {Ionicons} from 'react-native-vector-icons/Ionicons';
import Ionicons from 'react-native-vector-icons/Ionicons';
QUESTION
Could not find com.google.android:flexbox:1.0.0 react-native-intercom
Asked 2022-Feb-25 at 18:17I have a react-native project. After the bitnary (jcenter)
shutted down I started to replace it. Currently I'm using mavenCentral()
.
Also I'm using the react-native-intercom (wrapper for intercom)
.
When I'm trying to build gradlew assembleRelease
. Its throws me an error.
Could not determine the dependencies of task ':app:compileReleaseJavaWithJavac'.
> Could not resolve all task dependencies for configuration ':app:releaseCompileClasspath'.
> Could not find com.google.android:flexbox:1.0.0.
Required by:
project :app > io.intercom.android:intercom-sdk-base:5.5.1
I saw the solution, but it didn't help. this one
My files: (if you need more information let me know <3)
build.gradle(app):
apply plugin: "com.android.application"
import com.android.build.OutputFile
import com.sun.org.apache.xalan.internal.xsltc.compiler.Copy
instead
project.ext.react = [
entryFile: "index.js",
enableHermes: false, // clean and rebuild if changing
bundleInBeta: true,
bundleInStaging: true,
devDisabledInBeta: true,
devDisabledInStaging: true,
extraPackagerArgs: ["--max-workers=1"]
]
apply from: "../../node_modules/react-native/react.gradle"
def enableSeparateBuildPerCPUArchitecture = false
def enableProguardInReleaseBuilds = false
def jscFlavor = 'org.webkit:android-jsc:+'
def enableHermes = project.ext.react.get("enableHermes", false);
android {
compileSdkVersion rootProject.ext.compileSdkVersion
compileOptions {
sourceCompatibility JavaVersion.VERSION_1_8
targetCompatibility JavaVersion.VERSION_1_8
}
buildToolsVersion '29.0.2'
defaultConfig {
applicationId "se.welcomeapp.android"
minSdkVersion rootProject.ext.minSdkVersion
targetSdkVersion rootProject.ext.targetSdkVersion
versionCode 5955
versionName "5.9.55"
multiDexEnabled true
vectorDrawables.useSupportLibrary = true
missingDimensionStrategy 'react-native-camera', 'general'
}
splits {
abi {
reset()
enable enableSeparateBuildPerCPUArchitecture
universalApk false // If true, also generate a universal APK
include "armeabi-v7a", "x86", "arm64-v8a", "x86_64"
}
}
signingConfigs {
release {
storeFile file("welcome_keystore.jks")
storePassword "DjU@y!@6C^qYqYaGyQCo"
keyAlias "live"
keyPassword "mX7!&@RZiD2^5ZaWkKAV"
}
}
buildTypes {
debug {
applicationIdSuffix ".debug"
manifestPlaceholders = [isDebug:true]
}
beta {
manifestPlaceholders = [isDebug:false]
applicationIdSuffix ".beta"
matchingFallbacks = [ 'release']
signingConfig signingConfigs.release
}
staging {
manifestPlaceholders = [isDebug:false]
applicationIdSuffix ".staging"
matchingFallbacks = [ 'release']
signingConfig signingConfigs.release
}
release {
manifestPlaceholders = [isDebug:false]
minifyEnabled enableProguardInReleaseBuilds
proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
signingConfig signingConfigs.release
}
}
applicationVariants.all { variant ->
variant.outputs.each { output ->
def versionCodes = ["armeabi-v7a":1, "x86":2, "arm64-v8a": 3, "x86_64": 4]
def abi = output.getFilter(OutputFile.ABI)
if (abi != null) { // null for the universal-debug, universal-release variants
output.versionCodeOverride =
versionCodes.get(abi) * 1048576 + defaultConfig.versionCode
}
}
}
dexOptions {
preDexLibraries false
javaMaxHeapSize "3g"
}
packagingOptions {
pickFirst '**/libjsc.so'
pickFirst '**/libc++_shared.so'
pickFirst '**/armeabi-v7a/libc++_shared.so'
pickFirst '**/x86/libc++_shared.so'
pickFirst '**/arm64-v8a/libc++_shared.so'
pickFirst '**/x86_64/libc++_shared.so'
pickFirst '**/x86/libjsc.so'
pickFirst '**/armeabi-v7a/libjsc.so'
}
}
buildscript {
repositories {
maven { url 'https://maven.fabric.io/public' }
}
dependencies {
classpath 'io.fabric.tools:gradle:1.28.1'
}
}
apply plugin: 'io.fabric'
repositories {
maven { url 'https://maven.fabric.io/public' }
}
dependencies {
implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.0.0"
implementation "com.facebook.react:react-native:+"
implementation project(':react-native-amplitude-analytics')
implementation project(':react-native-color-matrix-image-filters')
implementation project(':react-native-pdf')
implementation project(':rn-fetch-blob')
implementation project(':react-native-document-picker')
implementation project(':react-native-sound')
implementation project(':react-native-audio')
implementation project(':react-native-branch')
implementation "org.webkit:android-jsc:r241213"
implementation project(':@react-native-community_async-storage')
implementation project(':react-native-svg')
implementation project(':react-native-webview')
implementation project(':@react-native-community_netinfo')
implementation project(':react-native-keychain')
implementation project(':react-native-share')
implementation project(':react-native-intercom')
implementation(project(':react-native-firebase')) {
transitive = false
}
implementation(project(':react-native-maps')){
exclude group: 'com.google.android.gms', module: 'play-services-base'
exclude group: 'com.google.android.gms', module: 'play-services-maps'
}
implementation 'com.google.android.gms:play-services-maps:17.0.0'
implementation(project(':react-native-geolocation-service')) {
exclude group: 'com.google.android.gms', module: 'play-services-location'
}
implementation 'com.google.android.gms:play-services-location:17.0.0'
implementation project(':react-native-image-crop-picker')
implementation project(':react-native-fs')
implementation project(':react-native-open-settings')
implementation project(':react-native-linear-gradient')
implementation project(':bugsnag-react-native')
implementation project(':react-native-device-info')
implementation project(':react-native-push-notification')
implementation project(':react-native-geocoder')
implementation project(':react-native-vector-icons')
implementation project(':react-native-i18n')
implementation project(':react-native-fbsdk')
implementation project(':react-native-camera')
provided fileTree(dir: 'libs', include: ['*.jar'])
implementation 'androidx.appcompat:appcompat:1.2.0'
implementation 'com.google.android.material:material:1.2.1'
implementation "com.android.support:appcompat-v7:28.0.0"
implementation "com.android.support:design:28.0.0"
implementation("com.facebook.react:react-native:0.60.4") {
// enforce version to fix https://github.com/facebook/react-native/issues/19259
// if someone send a version of react-native to jcenter, it will use the one
// from jcenter first before node_modules
force = true
}
if (enableHermes) {
def hermesPath = "../../node_modules/hermesvm/android/";
debugImplementation files(hermesPath + "hermes-debug.aar")
releaseImplementation files(hermesPath + "hermes-release.aar")
} else {
implementation jscFlavor
}
implementation 'io.github.inflationx:calligraphy3:3.1.1'
implementation 'io.github.inflationx:viewpump:2.0.3'
implementation('com.crashlytics.sdk.android:crashlytics:2.6.8@aar') {
transitive = true;
}
// Firebase dependencies
implementation "com.google.android.gms:play-services-base:17.0.0"
implementation "com.google.firebase:firebase-core:17.0.1"
implementation "com.google.firebase:firebase-messaging:20.2.4"
implementation "com.google.firebase:firebase-analytics:17.0.1"
// Intercom with Firebase dependencies
implementation 'io.intercom.android:intercom-sdk-base:5.5.1'
implementation 'io.intercom.android:intercom-sdk-fcm:5.+'
// If your app supports Android versions before Ice Cream Sandwich (API level 14)
// TODO: upgrade these to 1.3.0 and test if it solves the crash on samsung for animated gifs
implementation 'com.facebook.fresco:animated-base-support:1.0.1' // For animated GIF support
implementation 'com.facebook.fresco:animated-webp:1.0.1'
implementation 'com.facebook.fresco:animated-gif:1.0.1'
implementation 'com.facebook.fresco:webpsupport:1.0.1'
implementation 'com.android.support:multidex:1.0.3'
}
apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)
task wrapper(type: Wrapper) {
gradleVersion = '5.4.1'
}
apply plugin: 'com.google.gms.google-services'
build.gradle (android):
// Top-level build file where you can add configuration options common to all sub-projects/modules.
buildscript {
ext {
buildToolsVersion = "29.0.2"
minSdkVersion = 16
compileSdkVersion = 29
targetSdkVersion = 29
}
repositories {
google()
mavenCentral()
}
dependencies {
classpath 'com.android.tools.build:gradle:3.5.3'
classpath 'com.google.gms:google-services:4.2.0'
// NOTE: Do not place your application dependencies here; they belong
// in the individual module build.gradle files
}
}
allprojects {
repositories {
google()
mavenCentral()
maven { url "$rootDir/../node_modules/react-native/android" }
// maven { url 'https://maven.google.com' }
maven {
url "https://jitpack.io"
credentials { username authToken }
}
maven { url "$rootDir/../node_modules/jsc-android/dist" }
}
}
subprojects {
afterEvaluate {project ->
if (project.hasProperty("android")) {
android {
compileSdkVersion 29
buildToolsVersion "29.0.2"
}
}
}
project.configurations.all {
resolutionStrategy {
eachDependency { details ->
if (requested.group == 'com.android.support') {
if (requested.name.startsWith("support-v4")) {
details.useVersion '29.0.0'
}
}
}
}
}
}
ANSWER
Answered 2022-Jan-23 at 12:38I solved it. If you are using the react-native-intercom wrapper. You need to update it, after update everything works fine
Community Discussions, Code Snippets contain sources that include Stack Exchange Network
No vulnerabilities reported
Save this library and start creating your kit
Explore Related Topics
Save this library and start creating your kit