I've created the project using the following command.

react-native init Awesome_Project

I've started the packager using the following command.

react-native start

I've connected my Android mobile using USB drive.

I've opened another command prompt and run the following adb command to make sure that only one device is connected.

adb devices

I've started the application using the following command.

react-native run-android

I've been confronted with the following error.

open: Permission deniedopen: Permission deniedStarting: Intent { com.awesome_project/.MainActivity }Error type 3Error: Activity class {com.awesome_project/ com.awesome_project.MainActivity} does not exist.

Thanks in advance.

I'm trying to render a SectionList, but it is returning three errors:

Uncaught TypeError: Cannot read property 'length' of undefinedThe above error occurred in the <VirtualizedSectionList> component:Uncaught TypeError: Cannot read property 'length' of undefined

Code data of SectionList:

const {data, esporte, quantidadeTimes} = route.params;function embaralhar(array) {for (let i = array.length - 1; i > 0; i--) {  const j = Math.floor(Math.random() * (i + 1));  [array[i], array[j]] = [array[j], array[i]];}}function separarTimes(arr, tamanho) {  var novoArray = [];  var i = 0;  var numeroTime = 1;  while (i < arr.length) {    novoArray.push({title: "Time "+ numeroTime, nomes: arr.slice(i, i + tamanho), });    numeroTime += 1;    i += tamanho;  }  return novoArray;}const dataEmbaralhada = embaralhar(data);const timesSeparados = separarTimes(dataEmbaralhada, Math.trunc(data.length/quantidadeTimes))

Example timesSeparados:

[  {    title: "Time 1",    nomes: [      {        nome: "Nome1",        nivelId: 4,        isGoleiro: false,        id: 0      },      {        nome: "Nome2",        nivelId: 0,        isGoleiro: false,        id: 1      },      {        nome: "Nome3",        nivelId: 2,        isGoleiro: true,        id: 2      },    ]  },  {    title: "Time 2",    nomes: [      {        nome: "Nome1",        nivelId: 4,        isGoleiro: false,        id: 0      },      {        nome: "Nome2",        nivelId: 0,        isGoleiro: false,        id: 1      },      {        nome: "Nome3",        nivelId: 2,        isGoleiro: true,        id: 2      },    ]  }]

Code SectionList:

<ListaNomes  renderItem={renderItem}  renderSectionHeader={({section: {title}}) => (<Text style={{fontWeight: 'bold'}}>{title}</Text>  )}  sections={timesSeparados}  keyExtractor={(item, index) => item + index}/>

Code render item:

const renderItem = ({item}) => {    return (<NomeItemContainer><Nome>              {item.nomes.nome}</Nome><Infos><Nivel>                  {item.nomes.nivelId}</Nivel>              {                item.nomes.goleiro === true                ? <MaterialIcons name="pan-tool" size={20} color="white" style={{paddingRight: 5}}/>                : <Nome></Nome>              }</Infos></NomeItemContainer>    );}

our security team has conducted some tests on our android apk which was built with expo (a react native technology), and have the following questions, with regards to following chunk of code.

{“file” : “classes2.dex”,“offset”: 6762466,“contains”: “https://expo.io/@c**********”}

1 . What is the impact if someone gets these hard coded credentials? What can they do in expo.io?

2 . Could we remove these hard coded credentials?

Sorry I’m not a fully fledged mobile dev. so don’t quite know what this file is meant for.

Many thanks in advance.

Is it possible to integrate recaptcha(v2 as well as v3) in React Native application?

I googled but could not find any appropriate documentation related to this.

Please help me out.

i'm working on a react-native project V 0.59.5i'm trying to uprgrade it to V 0.63.3i was trying to solve problems poping in android studio, i updated the android studio to 4.1.1 and then there was a message suggesting to upgrade gradle to version 4.1.1, i was using 3.5.3.

i upgraded the grale version and after that i have an error that i cannot solve and i couldn't find useful anser for it. i tried removing cache folder in .gradle folder and restarted android studio but didn't help. changing the gradle version didn't help either.this is the error:

Could not find com.android.tools.build:gradle:4.1.1.Searched in the following locations:  - https://jcenter.bintray.com/com/android/tools/build/gradle/4.1.1/gradle-4.1.1.pomIf the artifact you are trying to retrieve can be found in the repository but without metadata in 'Maven POM' format, you need to adjust the 'metadataSources { ... }' of the repository declaration.Required by:    project :react-native-fsAdd google Maven repository and sync projectOpen File

i manually changed the gradle to what it was before.

in my gradle-wrapper.properties i have :

distributionUrl=https\://services.gradle.org/distributions/gradle-6.2-all.zip

and in build.grale file i have :

classpath('com.android.tools.build:gradle:3.5.3')

I am trying to use a font "Verveine Corp Regular' inside my react-native app.

The font works in the iOS build, but not in the Android build.

The font is in .tff format and is placed in the root of my work (linked in the package.json and I have run react-native link) and inside "android/gradle/src/main/assets/fonts" but it's still not picking the font up. I have also cleaned and rebuilt the app multiple times.

When inspecting an element which uses the font in the android debugger, it says it's using the font. But the font is still the default font.

Could anyone offer some help or guidance on this issue?

Thanks!

I'm running react-native run-android in my react native app, and I'm getting the following error:

FAILURE: Build failed with an exception.* Where:Build file '/Users/prikshetsharma/Desktop/Humboi/node_modules/react-native-reanimated/android/build.gradle' line: 89* What went wrong:A problem occurred configuring project ':react-native-reanimated'.> SDK location not found. Define location with an ANDROID_SDK_ROOT environment variable or by setting the sdk.dir path in your project's local properties file at '/Users/prikshetsharma/Desktop/Humboi/android/local.properties'.* Try:Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.* Get more help at https://help.gradle.orgBUILD FAILED in 2serror Failed to install the app. Make sure you have the Android development environment set up: https://reactnative.dev/docs/environment-setup.Error: Command failed: ./gradlew app:installDebug -PreactNativeDevServerPort=8081

How to fix this error?

I need to develop an app/web app for mirror android screen to the laptop through USB/wifi.

I am going to develop an app using react native for Android. I have few ideas about how I can achieve this like:-
1. Adb.
2. Root Access etc.

Please tell me the steps how I can achieve this.

I'm actually working on single page navigation, tab navigation and Drawer navigation by using react native navigation.

After the drawer implementation is done, single page navigation is working fine but the whole application is getting crashed after clicking on a login button.

Take a look at the code that I have written :

app.js:

import { Navigation } from 'react-native-navigation';import AuthScreen from './src/screens/Auth/Auth';import SharePlaceScreen from './src/screens/SharePlace/SharePlace';import FindPlaceScreen from './src/screens/FindPlace/FindPlace';import SideDrawer from "./src/screens/SideDrawer/SideDrawer";// register screensNavigation.registerComponent('example.AuthScreen', () => AuthScreen);Navigation.registerComponent('example.SharePlaceScreen', () => SharePlaceScreen);Navigation.registerComponent('example.FindPlaceScreen', () => FindPlaceScreen);Navigation.registerComponent('example.SideDrawer', () => SideDrawer);// start a appNavigation.startSingleScreenApp({    screen: {        screen:'example.AuthScreen',        title:"Login"    }})

startMainTab.js

import { Navigation } from 'react-native-navigation';import {Dimensions} from 'react-native';import Icon from 'react-native-vector-icons/MaterialIcons';const wDim = Dimensions.get('window');const fixedWidth = Math.round(wDim.width * wDim.scale * 0.8);const startTab = () =>{    Promise.all([        Icon.getImageSource("map",30),        Icon.getImageSource("share",30),        Icon.getImageSource("menu",30),    ]).then(sources =>{        Navigation.startTabBasedApp({            tabs: [                {                    screen:"example.AuthScreen",                    label : "Find Place",                    title : "Find Place",                    icon  : sources[0],                    navigatorButtons:{                        leftButton:[                            {                                icon:sources[2],                                title:"Menu",                                id:"sideDrawerToggle"                            }                        ]                    }                },                {                    screen:"example.AuthScreen",                    label : "Share Place",                    title : "Share Place",                    icon  : sources[1],                    navigatorButtons:{                        leftButton:[                            {                                icon:sources[2],                                title:"Menu",                                id:"sideDrawerToggle"                            }                        ]                    }                }            ],            drawer: {                left: {                    screen:"example.SideDrawer"                }            }        });    })}export default startTab;

SideDrawer.js

import React, { Component } from 'react';import {View,Text,Dimensions,StyleSheet} from 'react-native';class SideDrawer extends Component{    render(){        return(<View ><Text                style={[styles.container,{width:Dimensions.get("window").width*0.8}]}>                    On SideDrawer</Text></View>        )    }}const styles = StyleSheet.create({    container:{        paddingTop:22,        backgroundColor:"white",        flex:1    }})export default SideDrawer;

sharePlace.js

import React,{ Component } from 'react';import {View,Text} from 'react-native';class SharePlaceScreen extends Component{    constructor(props){        super(props);        props.navigator.setOnNavigatorEvent(this.onNavigatorEvent.bind(this));    }    onNavigatorEvent = event => {        console.log(events)        if(event.type === "NavBarButtonPress"){            if(event.id === "sideDrawerToggle"){                this.props.navigator.toggleDrawer({                    side: 'left'                })            }        }    }    render(){        return(<View><Text>On Share place screen</Text></View>        );    }}export default SharePlaceScreen;

I anticipate that I may need to jump from an Android Activity and back to the RN framework.

What are the best options available?

• Wix/React Native Navigation - Does this provide that option?(ie. the tabs, etc will allow to switch between activities?)
• AirBnB/Native-Navigation - I understand this was supposed to help withthat (as per Video: React Native in the Brownfield)... but it'sdiscontinued!

What is the best/correct way to architect a mixed/hybrid Android application currently?

Thanks for all the help! (Also I have searched, however because there are so many overlapping search terms, it often comes up with just simple RN navigation solutions)

I am getting this error constantly when I update the react-native expo app from SDK 36.0.0 to 40.0.0. I have searched many things on the internet but not found any solution which can help me.enter image description hereI am pasting my package.json file here

{"main": "node_modules/expo/AppEntry.js","scripts": {"start": "expo start","android": "expo start --android","ios": "expo start --ios","eject": "expo eject"  },"dependencies": {"@highcharts/highcharts-react-native": "^3.1.2","@react-navigation/bottom-tabs": "^5.2.1","axios": "^0.19.0","expo": "^40.0.0","react-navigation": "^4.4.3","@react-native-community/masked-view": "0.1.10","@react-native-community/viewpager": "^4.2.0","@react-navigation/native": "^5.7.6","@react-navigation/stack": "^5.9.3","react-native-screens": "~2.9.0","expo-activity-feed": "^0.9.1","expo-constants": "~9.3.3","expo-contacts": "~8.6.0","expo-image-picker": "~9.2.0","expo-linking": "~2.0.0","expo-mixpanel-analytics": "0.0.7","expo-permissions": "~10.0.0","expo-updates": "~0.4.1","expo-web-browser": "~8.6.0","firebase": "7.9.0","moment": "^2.29.1","native-base": "^2.13.8","react": "~16.9.0","react-native": "https://github.com/expo/react-native/archive/sdk-40.0.0.tar.gz","react-native-animatable": "^1.3.2","react-native-chart-kit": "^6.6.1","react-native-confetti-cannon": "^1.5.0","react-native-credit-card-input": "^0.4.1","react-native-draggable-flatlist": "^1.1.7","react-native-elements": "^1.2.6","react-native-gesture-handler": "~1.8.0","react-native-gmailtype-textinput": "^1.0.6","react-native-keyboard-spacer": "^0.4.1","react-native-material-dropdown": "^0.11.1","react-native-material-menu": "^1.0.0","react-native-mixpanel": "^1.1.14","react-native-range-slider": "^0.1.2","react-native-reanimated": "~1.13.0","react-native-redash": "^13.2.0","react-native-safe-area-context": "3.1.9","react-native-safe-area-view": "^1.1.1","react-native-svg": "12.1.0","react-native-swipe-gestures": "^1.0.5","react-native-tab-view": "^2.13.0","react-native-unimodules": "~0.12.0","react-native-vector-icons": "^6.6.0","react-native-webview": "11.0.0","react-navigation-transitions": "^1.0.12","rn-sliding-up-panel": "^2.4.0","victory-native": "^32.0.2"  },"devDependencies": {"babel-preset-expo": "8.3.0"  },"private": true}

Cannot read property 'style' of undefined react-native expo SDK 40.0.0I am getting the same error in expo 40 as well

Here is what I am getting error in the android side after running the latest npm i react-native-freshchat-sdk

My Config: -

{   "name": "FreshChat",   "version": "0.0.1",   "private": true,  "scripts": {"android": "react-native run-android","ios": "react-native run-ios","start": "react-native start","test": "jest","lint": "eslint ."   },   "dependencies": {"react": "16.13.1","react-native": "0.63.4","react-native-freshchat-sdk": "^3.1.1"   },"devDependencies": {"@babel/core": "^7.8.4","@babel/runtime": "^7.8.4","@react-native-community/eslint-config": "^1.1.0","babel-jest": "^25.1.0","eslint": "^6.5.1","jest": "^25.1.0","metro-react-native-babel-preset": "^0.59.0","react-test-renderer": "16.13.1"   },   "jest": {"preset": "react-native"   } }

I've been dealing with an issue for the last couple of hours and I can't seem to figure out how to fix it.Everytime I launch my react native app, it crashes with no error message.I tried running adb logcat AndroidRuntime:E *:S and here's the result that I got:

--------- beginning of main--------- beginning of system--------- beginning of crash01-11 01:34:05.413 23728 23728 E AndroidRuntime: FATAL EXCEPTION: main01-11 01:34:05.413 23728 23728 E AndroidRuntime: Process: com.wefix, PID: 2372801-11 01:34:05.413 23728 23728 E AndroidRuntime: java.lang.IllegalStateException: Unable to attach a rootView to ReactInstance when UIManager is not properly initialized.01-11 01:34:05.413 23728 23728 E AndroidRuntime:    at com.facebook.react.ReactInstanceManager.attachRootViewToInstance(ReactInstanceManager.java:1140)01-11 01:34:05.413 23728 23728 E AndroidRuntime:    at com.facebook.react.ReactInstanceManager.attachRootView(ReactInstanceManager.java:816)01-11 01:34:05.413 23728 23728 E AndroidRuntime:    at com.facebook.react.ReactRootView.attachToReactInstanceManager(ReactRootView.java:582)01-11 01:34:05.413 23728 23728 E AndroidRuntime:    at com.facebook.react.ReactRootView.startReactApplication(ReactRootView.java:396)01-11 01:34:05.413 23728 23728 E AndroidRuntime:    at com.facebook.react.ReactRootView.startReactApplication(ReactRootView.java:359)01-11 01:34:05.413 23728 23728 E AndroidRuntime:    at com.facebook.react.ReactInstanceManager$2.createRootView(ReactInstanceManager.java:313)01-11 01:34:05.413 23728 23728 E AndroidRuntime:    at com.facebook.react.devsupport.DevSupportManagerBase.createRootView(DevSupportManagerBase.java:356)01-11 01:34:05.413 23728 23728 E AndroidRuntime:    at com.facebook.react.devsupport.LogBoxModule$1.run(LogBoxModule.java:40)01-11 01:34:05.413 23728 23728 E AndroidRuntime:    at android.os.Handler.handleCallback(Handler.java:907)01-11 01:34:05.413 23728 23728 E AndroidRuntime:    at android.os.Handler.dispatchMessage(Handler.java:105)01-11 01:34:05.413 23728 23728 E AndroidRuntime:    at android.os.Looper.loop(Looper.java:216)01-11 01:34:05.413 23728 23728 E AndroidRuntime:    at android.app.ActivityThread.main(ActivityThread.java:7625)01-11 01:34:05.413 23728 23728 E AndroidRuntime:    at java.lang.reflect.Method.invoke(Native Method)01-11 01:34:05.413 23728 23728 E AndroidRuntime:    at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:524)01-11 01:34:05.413 23728 23728 E AndroidRuntime:    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:987)

Thanks in advance for your help.

I'm new to react native, and I'm trying to put a horizontal scrollview on my screen.

I've tried to put <ScrollView horizontal={true}> but it's not working at all, I want the blue box scrollable.

here' the image of my screen :

and this for my component code :

import React from 'react';import {View, StyleSheet, Text, Image, ScrollView} from 'react-native';export default function Body() {  return (<View><View style={styles.jadwal}><ScrollView horizontal={true}><View style={styles.box}><Text style={styles.title}>Math</Text><View style={styles.wrap}><View style={styles.alert}><Text style={styles.pr}>3 Homework</Text><Image                  style={styles.img}                  source={require('../assets/math.png')}                /></View></View></View><View style={styles.box}><Text style={styles.title}>Biology</Text><View style={styles.wrap}><View style={styles.alert}><Text style={styles.pr}>10 Homework</Text><Image                  style={styles.img}                  source={require('../assets/math.png')}                /></View></View></View></ScrollView></View></View>  );}const styles = StyleSheet.create({  jadwal: {    marginLeft: 10,    flexDirection: 'row',    justifyContent: 'flex-start',    position: 'absolute',  },  box: {    height: 100,    width: 230,    borderRadius: 10,    backgroundColor: '#327fe3',    marginLeft: 10,  },  alert: {    height: 20,    marginLeft: 15,    width: 80,    borderRadius: 10,    backgroundColor: '#7CD5FF',  },  title: {    marginTop: 20,    marginLeft: 20,    fontFamily: 'MontserratSemiBold',    fontSize: 15,    color: '#fff',  },  pr: {    marginLeft: 14,    fontSize: 8,    color: '#fff',    marginTop: 4,    justifyContent: 'flex-start',    fontFamily: 'MontserratLight',  },  wrap: {    marginTop: 5,  },  img: {    height: 50,    width: 50,    marginLeft: 140,    marginTop: -35,  },});

is there anything wrong ?, did I put the <ScrollView> on wrong position ?

Thanks for reading this, and sorry for my bad english.

I'm using React native for developing an android application. With this fetch request I'm getting the error TypeError: network request failed:

fetch('https://pixabay.com/api/?key=MY_KEY&q='+ this.props.jsondata.city.name +'&lang=en&image_type=photo&orientation=horizontal&category=travel&safesearch=true')        .then(response => {            console.dir(response);            if (!response.ok) {                throw Error(data.statusText);            }            return response.json();        })        .then(json => {            console.log(json.hits[0].largeImageURL)            this.setState(() => {                return {backImage: json.hits[0].largeImageURL};            });        })        .catch(err => {            console.log('Unable to search image! '+ err);        });

I've already searched online but this problem appears only with localhost addresses or http, that is not my case. The request is inside the componentDidMount() function. I've made a similar request (with the same structure) in an another place of the application but there is no error there. I'm using a real android device to testing the app with the react-native app compiled in android native code.

I built an android app using React Native, it got built successfully but when I run the app in my Android Virtual Device it shows up a full red screen with the following error:

I have not done native app development ever before neither do I have any knowledge of Java so I have no idea what this error means and how to fix this.

I want the button to be dynamically created and used when the onPress event occurs. Ask for help from great and kind friends.

I want{ in screen one Button , -> Button click -> create one Button -> so we have two button }

it is my code

import React, { Component } from 'react'import { Button } from 'react-native'const Test = () => {     return( <Button title='test' onPress={<Button title='test1'/>}/>     ) } export default Test 

or

import React, { Component } from 'react'import { Button } from 'react-native'const Test = () => {     return( <Button title='test' onPress={ButtonRender}/>     ) }const ButtonRender =():any=>{    return <Button title='test1'/>}export default Test 

I have a problem. It is not created Button. I need help

My goal here is to insert an image in Quill editor in react-native-webview component as shown below. For which I need access to the quill variable in the script tag:

<WebView    originWhitelist={['*']}    ref={(r) => setWebref(r)}    javaScriptEnabled={true}    source={{      html: `<head><link href="https://cdn.quilljs.com/1.3.6/quill.snow.css" rel="stylesheet"><script src="https://cdn.quilljs.com/1.3.6/quill.js"></script></head><body><div id="editor" >${content}</div></body><script>               var toolbarOptions = [[ 'bold', 'italic',],];              var quill = new Quill('#editor', {              modules: {                toolbar: toolbarOptions              })</script>`,    }}  />

When I try to run following snippet outside webview in react-native, nothing is happening

  const url = `https://...`;  const code = `const range = window.quill.getSelection();               window.quill.insertEmbed(range.index, 'image', ${url});              `;  webref.injectJavaScript(code);

But, when I try to run following snippet outside webview in react-native, I am getting the expected result.

 const snippet = `document.body.style.backgroundColor = 'blue';                  true;                  `; webref.injectJavaScript(snippet);

( Note: I am a complete beginner in react native and have gone through a lot of reference searching for a solution and nothing helped.)I am using axios with https url for post request and this is my code.

  try {  const response = await axios.post('https://aaa.bb.com/...................',    {      headers: {        //     //Header Defination'Accept': 'application/json','Content-Type': 'application/x-www-form-urlencoded',   // tried application/json'X-Requested-From': 'MOBILE','Authorization': 'Basic '+ loginCredential,      },    },  );  console.log('Success : '+ response);} catch (error) {  // handle error  console.log(error);}

I don't need the body part. I have used the same url with data on android native version and it worked fine. But on react-native I am getting "Error: Network Error" as message without any description.Tried using android:usesCleartextTraffic="true" in manifest.

Any help would be grateful. Thank you

Running npx react-native run-android is working on the android emulator, and also on a Samsung device I have. But when connecting a MI MAX 2 device, I get the following:

> Task :app:installDebugInstalling APK 'app-debug.apk' on 'MI MAX 2 - 7.1.1' for app:debug> Task :app:installDebug FAILEDDeprecated Gradle features were used in this build, making it incompatible with Gradle 7.0.Use '--warning-mode all' to show the individual deprecation warnings.See https://docs.gradle.org/6.5/userguide/command_line_interface.html#sec:command_line_warnings847 actionable tasks: 2 executed, 845 up-to-dateUnable to install /Users/[....]/android/app/build/outputs/apk/debug/app-debug.apkcom.android.ddmlib.InstallException: Unknown failure: Error: java.lang.SecurityException: You need the android.permission.INSTALL_GRANT_RUNTIME_PERMISSIONS permission to use the PackageManager.INSTALL_GRANT_RUNTIME_PERMISSIONS flag        at com.android.ddmlib.internal.DeviceImpl.installRemotePackage(DeviceImpl.java:1224)        at com.android.ddmlib.internal.DeviceImpl.installPackage(DeviceImpl.java:1050)        at com.android.ddmlib.internal.DeviceImpl.installPackage(DeviceImpl.java:1026)        at com.android.ddmlib.internal.DeviceImpl.installPackage(DeviceImpl.java:1015)        at ... etc, etc, etcFAILURE: Build failed with an exception.* What went wrong:Execution failed for task ':app:installDebug'.> java.util.concurrent.ExecutionException: com.android.builder.testing.api.DeviceException: com.android.ddmlib.InstallException: Unknown failure: Error: java.lang.SecurityException: You need the android.permission.INSTALL_GRANT_RUNTIME_PERMISSIONS permission to use the PackageManager.INSTALL_GRANT_RUNTIME_PERMISSIONS flag* Try:Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.* Get more help at https://help.gradle.orgBUILD FAILED in 30serror Failed to install the app. Make sure you have the Android development environment set up: https://reactnative.dev/docs/environment-setup. Run CLI with --verbose flag for more details.Error: Command failed: ./gradlew app:installDebug -PreactNativeDevServerPort=4105Unable to install /Users/[....]/android/app/build/outputs/apk/debug/app-debug.apk

Note: I tried adding the following to my AndroidManifest.xml but it didn't appear to make a difference:

<uses-permission android:name="android.permission.INSTALL_GRANT_RUNTIME_PERMISSIONS"/>

Any ideas?