I'm using react-native 0.14.1

react-native run-android[3:10:56 PM] <START> find dependenciesUnable to resolve module image!ic_action_android_back_white3 from /Users/lion/Desktop/Developer/AwesomeProject/NewTrackActivity.jsUnable to resolve module image!ic_action_android_back_white3 from /Users/lion/Desktop/Developer/AwesomeProject/NewTrackActivity.js

If I force open my app in Genymotion it can't find my image.

Requiring unknown module image!ic_action_android_back_white3

I'm tried to move image to both ./android/app/src/main/res/drawable-xxx and ./assets/drawable-xxx but neither work.

For ios and android development, I am using React-Native.Still in learning phase.

Want to implement a functionality, on click of Header Icon a small hover should pop up from bottom of the screen with multiple options as clickable buttons.

What is that component that I should implement in react native.

Thanks for your help in advance.

Sorry if this question will be a bit too general, but I only hope that someone more experienced than me in react-native and Android can help me with this problem that I now encounter very often.

In fact, I haven't been able to correctly install packages containing native code in my react-native project for a while. The last native package that I successfully installed, not without many problems, it was @react-native-community/google-signin (I think, however, that this is not relevant for this problem)

All the other packages I installed afterwards gave me errors after the installation and I was forced to give up all of these. Initially I thought it was a problem of the individual packages (in fact, as soon as I removed them the app would start working again). Of course, I now have the necessary experience to say that it is a problem shared by all packages containing native code.

Initially I also thought it could be a yarn workspace error, and for this reason, for pre-education, I added all the packages that contain native code in the nohoist list:

"workspaces": {"nohoist": ["react-native","react-native/**","@react-native-mapbox-gl","@react-native-mapbox-gl/**","react-native-gesture-handler","react-native-gesture-handler/**","react-native-reanimated","react-native-reanimated/**","@react-navigation","@react-navigation/**","react-native-safe-area-context","react-native-safe-area-context/**","react-native-vector-icons","react-native-vector-icons/**","react-native-pose","react-native-pose/**","@react-native-community","@react-native-community/**","react-native-elements","react-native-elements/**","react-native-snackbar","react-native-snackbar/**"    ]  }

Today I tried to install two more packages that I needed: react-native-secure-storage and react-native-snackbar; however I was unable to install them. Like the others, after the installation through yarn or npm, the app is no longer able to start. For example for package react-native-snackbar, iget the following error when starting the app:

Task :app:mergeDexDebug FAILED

Deprecated 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.0.1/userguide/command_line_interface.html#sec:command_line_warnings206 actionable tasks: 191 executed, 15 up-to-dateNote: mydir\packages\mobile\node_modules\@react-native-community\google-signin\android\src\main\java\co\apptailor\googlesignin\RNGoogleSigninModule.java uses unchecked or unsafe operations.Note: Recompile with -Xlint:unchecked for details.Note: mydir\packages\mobile\node_modules\react-native-gesture-handler\android\src\main\java\com\swmansion\gesturehandler\react\RNGestureHandlerButtonViewManager.java uses or overrides a deprecated API.Note: Recompile with -Xlint:deprecation for details.Note: Some input files use unchecked or unsafe operations.Note: Recompile with -Xlint:unchecked for details.Note: Some input files use or override a deprecated API.Note: Recompile with -Xlint:deprecation for details.Note: Some input files use unchecked or unsafe operations.Note: Recompile with -Xlint:unchecked for details.Note: mydir\packages\mobile\node_modules\react-native-reanimated\android\src\main\java\com\swmansion\reanimated\NodesManager.java uses or overrides a deprecated API.Note: Recompile with -Xlint:deprecation for details.Note: mydir\packages\mobile\node_modules\react-native-reanimated\android\src\main\java\com\swmansion\reanimated\NodesManager.java uses unchecked or unsafe operations.Note: Recompile with -Xlint:unchecked for details.Note: Some input files use or override a deprecated API.Note: Recompile with -Xlint:deprecation for details.Note: Some input files use unchecked or unsafe operations.Note: Recompile with -Xlint:unchecked for details.D8: Cannot fit requested classes in a single dex file (# fields: 68231 > 65536)com.android.builder.dexing.DexArchiveMergerException: Error while merging dex archives:The number of method references in a .dex file cannot exceed 64K.Learn how to resolve this issue at https://developer.android.com/tools/building/multidex.html        at com.android.builder.dexing.D8DexArchiveMerger.getExceptionToRethrow(D8DexArchiveMerger.java:131)        at com.android.builder.dexing.D8DexArchiveMerger.mergeDexArchives(D8DexArchiveMerger.java:118)        at com.android.build.gradle.internal.transforms.DexMergerTransformCallable.call(DexMergerTransformCallable.java:102)        at com.android.build.gradle.internal.tasks.DexMergingTaskRunnable.run(DexMergingTask.kt:444)        at com.android.build.gradle.internal.tasks.Workers$ActionFacade.run(Workers.kt:335)        at org.gradle.workers.internal.AdapterWorkAction.execute(AdapterWorkAction.java:50)        at org.gradle.workers.internal.DefaultWorkerServer.execute(DefaultWorkerServer.java:50)        at org.gradle.workers.internal.NoIsolationWorkerFactory$1$1$1.create(NoIsolationWorkerFactory.java:65)        at org.gradle.workers.internal.NoIsolationWorkerFactory$1$1$1.create(NoIsolationWorkerFactory.java:61)        at org.gradle.internal.classloader.ClassLoaderUtils.executeInClassloader(ClassLoaderUtils.java:98)        at org.gradle.workers.internal.NoIsolationWorkerFactory$1$1.execute(NoIsolationWorkerFactory.java:61)        at org.gradle.workers.internal.AbstractWorker$1.call(AbstractWorker.java:44)        at org.gradle.workers.internal.AbstractWorker$1.call(AbstractWorker.java:41)        at org.gradle.internal.operations.DefaultBuildOperationExecutor$CallableBuildOperationWorker.execute(DefaultBuildOperationExecutor.java:416)            at org.gradle.internal.operations.DefaultBuildOperationExecutor$CallableBuildOperationWorker.execute(DefaultBuildOperationExecutor.java:406)            at org.gradle.internal.operations.DefaultBuildOperationExecutor$1.execute(DefaultBuildOperationExecutor.java:165)        at org.gradle.internal.operations.DefaultBuildOperationExecutor.execute(DefaultBuildOperationExecutor.java:250)        at org.gradle.internal.operations.DefaultBuildOperationExecutor.execute(DefaultBuildOperationExecutor.java:158)        at org.gradle.internal.operations.DefaultBuildOperationExecutor.call(DefaultBuildOperationExecutor.java:102)        at org.gradle.internal.operations.DelegatingBuildOperationExecutor.call(DelegatingBuildOperationExecutor.java:36)        at org.gradle.workers.internal.AbstractWorker.executeWrappedInBuildOperation(AbstractWorker.java:41)        at org.gradle.workers.internal.NoIsolationWorkerFactory$1.execute(NoIsolationWorkerFactory.java:53)        at org.gradle.workers.internal.DefaultWorkerExecutor$3.call(DefaultWorkerExecutor.java:217)        at org.gradle.workers.internal.DefaultWorkerExecutor$3.call(DefaultWorkerExecutor.java:212)        at java.util.concurrent.FutureTask.run(FutureTask.java:266)        at org.gradle.internal.work.DefaultConditionalExecutionQueue$ExecutionRunner.runExecution(DefaultConditionalExecutionQueue.java:215)        at org.gradle.internal.work.DefaultConditionalExecutionQueue$ExecutionRunner.runBatch(DefaultConditionalExecutionQueue.java:164)        at org.gradle.internal.work.DefaultConditionalExecutionQueue$ExecutionRunner.run(DefaultConditionalExecutionQueue.java:131)        at java.util.concurrent.Executors$RunnableAdapter.call(Executors.java:511)        at java.util.concurrent.FutureTask.run(FutureTask.java:266)        at org.gradle.internal.concurrent.ExecutorPolicy$CatchAndRecordFailures.onExecute(ExecutorPolicy.java:64)        at org.gradle.internal.concurrent.ManagedExecutorImpl$1.run(ManagedExecutorImpl.java:48)        at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1149)        at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:624)        at org.gradle.internal.concurrent.ThreadFactoryImpl$ManagedThreadRunnable.run(ThreadFactoryImpl.java:56)        at java.lang.Thread.run(Thread.java:748)Caused by: com.android.tools.r8.CompilationFailedException: Compilation failed to complete        at com.android.tools.r8.utils.t.a(:55)        at com.android.tools.r8.D8.run(:11)        at com.android.builder.dexing.D8DexArchiveMerger.mergeDexArchives(D8DexArchiveMerger.java:116)        ... 34 moreCaused by: com.android.tools.r8.utils.AbortException: Error: null, Cannot fit requested classes in a single dex file (# fields: 68231 > 65536)        at com.android.tools.r8.utils.Reporter.a(:21)        at com.android.tools.r8.utils.Reporter.a(:7)        at com.android.tools.r8.dex.VirtualFile.a(:33)        at com.android.tools.r8.dex.VirtualFile$h.a(:5)        at com.android.tools.r8.dex.ApplicationWriter.a(:13)        at com.android.tools.r8.dex.ApplicationWriter.write(:35)        at com.android.tools.r8.D8.d(:44)        at com.android.tools.r8.D8.b(:1)        at com.android.tools.r8.utils.t.a(:23)        ... 36 moreFAILURE: Build failed with an exception.* What went wrong:Execution failed for task ':app:mergeDexDebug'.> A failure occurred while executing com.android.build.gradle.internal.tasks.Workers$ActionFacade> com.android.builder.dexing.DexArchiveMergerException: Error while merging dex archives:     The number of method references in a .dex file cannot exceed 64K.     Learn how to resolve this issue at https://developer.android.com/tools/building/multidex.html* 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 40serror 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.bat app:installDebug -PreactNativeDevServerPort=8081Note: mydir\packages\mobile\node_modules\@react-native-community\google-signin\android\src\main\java\co\apptailor\googlesignin\RNGoogleSigninModule.java uses unchecked or unsafe operations.Note: Recompile with -Xlint:unchecked for details.Note: mydir\packages\mobile\node_modules\react-native-gesture-handler\android\src\main\java\com\swmansion\gesturehandler\react\RNGestureHandlerButtonViewManager.java uses or overrides a deprecated API.Note: Recompile with -Xlint:deprecation for details.Note: Some input files use unchecked or unsafe operations.Note: Recompile with -Xlint:unchecked for details.Note: Some input files use or override a deprecated API.Note: Recompile with -Xlint:deprecation for details.Note: Some input files use unchecked or unsafe operations.Note: Recompile with -Xlint:unchecked for details.Note: mydir\packages\mobile\node_modules\react-native-reanimated\android\src\main\java\com\swmansion\reanimated\NodesManager.java uses or overrides a deprecated API.Note: Recompile with -Xlint:deprecation for details.Note: mydir\packages\mobile\node_modules\react-native-reanimated\android\src\main\java\com\swmansion\reanimated\NodesManager.java uses unchecked or unsafe operations.Note: Recompile with -Xlint:unchecked for details.Note: Some input files use or override a deprecated API.Note: Recompile with -Xlint:deprecation for details.Note: Some input files use unchecked or unsafe operations.Note: Recompile with -Xlint:unchecked for details.D8: Cannot fit requested classes in a single dex file (# fields: 68231 > 65536)com.android.builder.dexing.DexArchiveMergerException: Error while merging dex archives:The number of method references in a .dex file cannot exceed 64K.Learn how to resolve this issue at https://developer.android.com/tools/building/multidex.html        at com.android.builder.dexing.D8DexArchiveMerger.getExceptionToRethrow(D8DexArchiveMerger.java:131)        at com.android.builder.dexing.D8DexArchiveMerger.mergeDexArchives(D8DexArchiveMerger.java:118)        at com.android.build.gradle.internal.transforms.DexMergerTransformCallable.call(DexMergerTransformCallable.java:102)        at com.android.build.gradle.internal.tasks.DexMergingTaskRunnable.run(DexMergingTask.kt:444)        at com.android.build.gradle.internal.tasks.Workers$ActionFacade.run(Workers.kt:335)        at org.gradle.workers.internal.AdapterWorkAction.execute(AdapterWorkAction.java:50)        at org.gradle.workers.internal.DefaultWorkerServer.execute(DefaultWorkerServer.java:50)        at org.gradle.workers.internal.NoIsolationWorkerFactory$1$1$1.create(NoIsolationWorkerFactory.java:65)        at org.gradle.workers.internal.NoIsolationWorkerFactory$1$1$1.create(NoIsolationWorkerFactory.java:61)        at org.gradle.internal.classloader.ClassLoaderUtils.executeInClassloader(ClassLoaderUtils.java:98)        at org.gradle.workers.internal.NoIsolationWorkerFactory$1$1.execute(NoIsolationWorkerFactory.java:61)        at org.gradle.workers.internal.AbstractWorker$1.call(AbstractWorker.java:44)        at org.gradle.workers.internal.AbstractWorker$1.call(AbstractWorker.java:41)        at org.gradle.internal.operations.DefaultBuildOperationExecutor$CallableBuildOperationWorker.execute(DefaultBuildOperationExecutor.java:416)            at org.gradle.internal.operations.DefaultBuildOperationExecutor$CallableBuildOperationWorker.execute(DefaultBuildOperationExecutor.java:406)            at org.gradle.internal.operations.DefaultBuildOperationExecutor$1.execute(DefaultBuildOperationExecutor.java:165)        at org.gradle.internal.operations.DefaultBuildOperationExecutor.execute(DefaultBuildOperationExecutor.java:250)        at org.gradle.internal.operations.DefaultBuildOperationExecutor.execute(DefaultBuildOperationExecutor.java:158)        at org.gradle.internal.operations.DefaultBuildOperationExecutor.call(DefaultBuildOperationExecutor.java:102)        at org.gradle.internal.operations.DelegatingBuildOperationExecutor.call(DelegatingBuildOperationExecutor.java:36)        at org.gradle.workers.internal.AbstractWorker.executeWrappedInBuildOperation(AbstractWorker.java:41)        at org.gradle.workers.internal.NoIsolationWorkerFactory$1.execute(NoIsolationWorkerFactory.java:53)        at org.gradle.workers.internal.DefaultWorkerExecutor$3.call(DefaultWorkerExecutor.java:217)        at org.gradle.workers.internal.DefaultWorkerExecutor$3.call(DefaultWorkerExecutor.java:212)        at java.util.concurrent.FutureTask.run(FutureTask.java:266)        at org.gradle.internal.work.DefaultConditionalExecutionQueue$ExecutionRunner.runExecution(DefaultConditionalExecutionQueue.java:215)        at org.gradle.internal.work.DefaultConditionalExecutionQueue$ExecutionRunner.runBatch(DefaultConditionalExecutionQueue.java:164)        at org.gradle.internal.work.DefaultConditionalExecutionQueue$ExecutionRunner.run(DefaultConditionalExecutionQueue.java:131)        at java.util.concurrent.Executors$RunnableAdapter.call(Executors.java:511)        at java.util.concurrent.FutureTask.run(FutureTask.java:266)        at org.gradle.internal.concurrent.ExecutorPolicy$CatchAndRecordFailures.onExecute(ExecutorPolicy.java:64)        at org.gradle.internal.concurrent.ManagedExecutorImpl$1.run(ManagedExecutorImpl.java:48)        at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1149)        at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:624)        at org.gradle.internal.concurrent.ThreadFactoryImpl$ManagedThreadRunnable.run(ThreadFactoryImpl.java:56)        at java.lang.Thread.run(Thread.java:748)Caused by: com.android.tools.r8.CompilationFailedException: Compilation failed to complete        at com.android.tools.r8.utils.t.a(:55)        at com.android.tools.r8.D8.run(:11)        at com.android.builder.dexing.D8DexArchiveMerger.mergeDexArchives(D8DexArchiveMerger.java:116)        ... 34 moreCaused by: com.android.tools.r8.utils.AbortException: Error: null, Cannot fit requested classes in a single dex file (# fields: 68231 > 65536)        at com.android.tools.r8.utils.Reporter.a(:21)        at com.android.tools.r8.utils.Reporter.a(:7)        at com.android.tools.r8.dex.VirtualFile.a(:33)        at com.android.tools.r8.dex.VirtualFile$h.a(:5)        at com.android.tools.r8.dex.ApplicationWriter.a(:13)        at com.android.tools.r8.dex.ApplicationWriter.write(:35)        at com.android.tools.r8.D8.d(:44)        at com.android.tools.r8.D8.b(:1)        at com.android.tools.r8.utils.t.a(:23)        ... 36 moreFAILURE: Build failed with an exception.* What went wrong:Execution failed for task ':app:mergeDexDebug'.> A failure occurred while executing com.android.build.gradle.internal.tasks.Workers$ActionFacade> com.android.builder.dexing.DexArchiveMergerException: Error while merging dex archives:      The number of method references in a .dex file cannot exceed 64K.     Learn how to resolve this issue at https://developer.android.com/tools/building/multidex.html* 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 40s    at makeError (mydir\packages\mobile\node_modules\execa\index.js:174:9)    at mydir\packages\mobile\node_modules\execa\index.js:278:16    at processTicksAndRejections (internal/process/task_queues.js:97:5)    at async runOnAllDevices (mydir\packages\mobile\node_modules\@react-native-community\cli-platform-android\build\commands\runAndroid\runOnAllDevices.js:94:5)    at async Command.handleAction (mydir\packages\mobile\node_modules\@react-native-community\cli\build\index.js:186:9)error Command failed with exit code 1.info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

I don't have enough development experience with android to understand what the problem is, but I think there is a good chance that it is connected to the migration to AndroidX.

In my project the version of react-native that I am using is 0.62.2.

I am getting this error TypeError: Cannot read property 'navigate' of undefined. All code is defined in the main App.js file. Any solutions for this.

<Stack.Screen                    name="Home"                    component={BottomNav}                    options={{                        headerShown: true,                        headerTitle: 'Home',                        headerTitleStyle: { color: 'blue', fontWeight: 'bold' },                        headerRight: () => (<TouchableOpacity                                activeOpacity={0.5}                                onPress={() => this.props.navigation.navigate('PropertySearchScreen')}><Image                                    source={require('./../assets/icons/search.png')}                                    style={{ width: 25, height: 25, marginRight: 20 }}                                /></TouchableOpacity>                        ),                    }}                />

I am working on a React Native 0.62 project and use Yarn as a package manager. I just opened Android Studio and noticed this:

I seem to have duplicate libraries, which is weird because I only use Yarn (and not in conjunction with NPM), and RN 0.62 should automatically manage and link these packages.

Does anyone know what this is caused by, and how it can be fixed?

How can I implement something like BouncingScrollPhysics that is one of ScrollPhysics type in flutter's listView in react native.

I know there is bounce property for react native, but it only works for iOS, I need for android too.

Here is What I want to implement in react native.

Is it possible?

I am interested in making an android app that will basically do two things:

1. monitor certain regions of the mobile screen to identify activity occurring in any other app that the user is running
2. based on finding certain patterns in those regions, I want to be able to simulate clicks on specific points on the screen.

The app will execute as an overlay running over other apps.You could think of it as a combination of "screen translator" plus "click assistant" app.

I am curious to know if any app of this kind can be made using React Native or not. If yes, could you point me to relevant packages that I could use.

I am a bit familiar with react and react native, thus would prefer to use it instead of native android coding.

My Text is not showing on Android is it because of position: absolute? but I added elevation still not working, but on iOs it works fine. Any ideas how to resolve this issues.

<View style={[Input.inputView, { position: 'relative', justifyContent: 'center' }]} ><TextInput        style={Input.inputText}        autoCapitalize="none"        placeholder="Password"        placeholderTextColor="#b5b5b5"        secureTextEntry={!isPasswordShown}        value={password}        onChangeText={(password) => { setPassword(password) }}    /><TouchableOpacity disabled={password == '' ? true : false} style={{ position: 'absolute', right: '5%', top: 17, elevation: 3 }} onPress={() => togglePasswordVisiblity()}><Text style={{ fontSize: 12, color: '#3c3c3c' }}>{password == '' ? '' : isPasswordShown ? 'HIDE' : 'SHOW'}</Text></TouchableOpacity></View>

I'm having a bad time working with Android Studios, WSL2 and React Native.

Every day I get something to work, other stuff breaks. Yesterday, everything was working fine, now I can't connect to my server from my app.

I don't know where to ask this exactly but I'm feeling desperate. I've been trying to solve this for about EIGHT DAYS. I can't. I need help.

I'm not a fluent developer. In order to clarify as much as possible, I did this step-by-step list.

Much of it is based on this tutorial, the only thing that made WSL2 + Android Studios work together.

What am I doing, in order:

• Starting Hyper in WSL (Ubuntu 20)
• Navigating to my React Native project folder
• Opening Windows Terminal as admin
• Run in Terminal:

adb kill-serveradb -a nodaemon server start

• Then, in Hyper:

unset ADB_SERVER_SOCKETsocat -d -d TCP-LISTEN:5037,reuseaddr,fork TCP:$(cat /etc/resolv.conf | tail -n1 | cut -d " " -f 2):5037

• I let both Terminal and Hyper running and don't close their windows/tabs.
• In another Terminal window, I run:

iex "netsh interface portproxy delete v4tov4 listenport=8081 listenaddress=127.0.0.1" | out-null;$WSL_CLIENT = bash.exe -c "ip addr show eth0 | grep -oP '(?<=inet\s)\d+(\.\d+){3}'";$WSL_CLIENT -match '\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}';$WSL_CLIENT = $matches[0];iex "netsh interface portproxy add v4tov4 listenport=8081 listenaddress=127.0.0.1 connectport=8081 connectaddress=$WSL_CLIENT"

• Still in Terminal, I get my WSL ip using ipconfig. Let's say it's 172.22.32.1.
• I open VS Code and change my Axios API connection to this IP. Eg:

import axios from 'axios';const api = axios.create({  baseURL: 'http://172.22.32.1:3333',});export default api;

• I open a Android Studios AVD, named emulator-5554.
• I run yarn start on Hyper. It shows "Welcome to React Native" etc.
• In another tab, I run yarn android --variant=debug --deviceId emulator-5554 and wait it's completion.
• At this point the app is running on my device. If I make changes on VS Code, it changes. Everything apparently running smoothly.
• I start docker desktop (windows with WSL2 integration) and do docker ps to check if anything is started. Nothing is.
• I run docker start mongo redis gostack-postgres (there's a reason to be using all this but I believe it's unrelated).
• Then, docker ps:

CONTAINER ID        IMAGE               COMMAND                  CREATED             STATUS              PORTS  NAMES1a19b8e8914a        mongo               "docker-entrypoint.s…"   4 days ago          Up 5 seconds        0.0.0.0:27017->27017/tcp  mongo172505459df6        postgres            "docker-entrypoint.s…"   4 days ago          Up 4 seconds        0.0.0.0:5432->5432/tcp  gostack-postgresacac9fa31419        redis:alpine        "docker-entrypoint.s…"   5 days ago          Up 5 seconds        0.0.0.0:6379->6379/tcp  redis

• I navigate to the server folder and start it running yarn dev:server.
• I test it using my front-end website on chrome, running on localhost:3000. The server works fine, as I can login and change information.
• Again, I test the server using localhost:3333 in browser and receiving a connected message. Everything ok, so I kill the front-end website.
• I try to login through my app, as I did in the website. It waits a few seconds... and gives me the [Error: Network Error] log in React Native Metro.
• Ok, something is wrong with the connection. Let's try localhost instead of the IP. I change it in my API settings.

const api = axios.create({  baseURL: 'http://localhost:3333',});

• In order to make sure everything is ok, I re-run yarn android --variant=debug --deviceId emulator-5554
• This time, as soon as I press the login button, the app returns [Error: Network Error] (the other time it took a few to return me).
• I believe this is not the IP I should be using. I try, then 0.0.0.0 and re-run yarn android.... After finished, I reload Metro with r.
• [Error: Network Error] and less 2 years in my life due to stress.

I'm new to react native, I am having this issue when running the command npm react-native run-android it always launch an emulator, even my android device is connected and displayed in adb devices list.

My Environment :
OS : Windows 10
NPM : 6.14.4
Node : v10.21.0

I am trying to build the app in react native which plays sound in every 8 sec now when I install the app in debug mode locally sound plays in every 8 sec even mobile is locked or app in the background,

now when I make an android apk and install on my device and start the app in the background then after roundabout 40-sec app stops working until I awake my app.

Please help me to solve this problem I am attaching my code git repo in which I have just one screen which is playing sound in every 8 sec

RepoLink is here

https://github.com/haseebb/sound-test-app.git

Describe the bug

In my case Map is not displaying in release APK(Marker is showing properly). However debug build is ok.

I also have tested creating different token.

Example

import React, {Component} from 'react';import Mapbox, {MapView, Camera} from '@react-native-mapbox-gl/maps';import {Dimensions, Alert, View, Image, Platform} from 'react-native';const appConfig = require('../../../app.json');Mapbox.setAccessToken(appConfig.mapboxAccessToken);const {height, width} = Dimensions.get('window');class Map extends Component {  constructor(props) {    super(props);    this.state = {      basicSetup: {        showUserLocation: true,        centerCoordinate: [],        zoomLevel: 12,        maxZoomLevel: 19,        compassEnabled: true,        logoEnabled: false,        attributionEnabled: false,      },      disable: {        zoomEnabled: false,        scrollEnabled: false,        pitchEnabled: false,        rotateEnabled: false,      },    };  }  render() {    return (<View style={[styles.map, style]}><MapView          styleURL={appConfig['someconfigname']}          style={{flex: 1}}          ref={(ref) => {            this.control = ref;          }}><Camera ref={(c) => (this.camera = c)} zoomLevel={14} />          {children}</MapView>        {hideLogo ? null : (<View style={[styles.logo, logoStyle]}><Image              resizeMode={'contain'}              source={require('../../../resources/images/map_logo.png')}              style={{flex: 1}}            /></View>        )}</View>    );  }}export default Map;const styles = {  map: {    width,    height,  },  logo: {    position: 'absolute',    bottom: Platform.OS == 'ios' ? 20 : 40,    left: 20,    shadowColor: '#37474f',    shadowOpacity: 0.24,    shadowOffset: {height: 2, width: 0},    elevation: 3,    shadowRadius: 3,  },  circle: {    position: 'absolute',    borderWidth: 1,    borderColor: '#111',    backgroundColor: '#03111111',    justifyContent: 'center',    alignItems: 'center',  },  circleCenter: {    height: 4,    width: 4,    borderRadius: 4,    backgroundColor: '#a1a5d1',  },  radiusText: {    fontSize: 13.47,    color: '#a1a5d1',  },};

Expected behavior

It should display map even though it is in release mode

Screenshots

======= Debug mode =======

======= Release Mode =======

Platform: [Android]

Device: [One Plus 7T]

Emulator/ Simulator: [no]

OS: [Android 9]

react-native-mapbox-gl Version [8.1.0-rc.1]

React Native Version [0.62.2]

Im trying to launch my work application on my windows laptop, other projects are working while this specific one continues to fail, this is the command:

react-native run-android --variant=appDebug --appIdSuffix app

and the error:

Task '$' not found in root project 'My-App'

Im using latest android studio version, gradle 6.3.if im trying to "build" the project via android studio, im getting this error

Error:Internal error: (java.lang.ClassNotFoundException)com.google.wireless.android.sdk.stats.IntellijIndexingStats$Indexjava.lang.ClassNotFoundException:com.google.wireless.android.sdk.stats.IntellijIndexingStats$Index atjava.net.URLClassLoader.findClass(URLClassLoader.java:382) atjava.lang.ClassLoader.loadClass(ClassLoader.java:419) atjava.lang.ClassLoader.loadClass(ClassLoader.java:352) atcom.intellij.util.indexing.counters.IndexCounters.(IndexCounters.java:34)atcom.intellij.util.indexing.impl.MapReduceIndex.(MapReduceIndex.java:92)atcom.intellij.util.indexing.impl.MapReduceIndex.(MapReduceIndex.java:108)atorg.jetbrains.jps.backwardRefs.index.CompilerReferenceIndex$CompilerMapReduceIndex.(CompilerReferenceIndex.java:274)atorg.jetbrains.jps.backwardRefs.index.CompilerReferenceIndex.(CompilerReferenceIndex.java:110)atorg.jetbrains.jps.backwardRefs.JavaCompilerBackwardReferenceIndex.(JavaCompilerBackwardReferenceIndex.java:13)atorg.jetbrains.jps.backwardRefs.JavaBackwardReferenceIndexWriter.initialize(JavaBackwardReferenceIndexWriter.java:80)atorg.jetbrains.jps.incremental.java.JavaBuilder.buildStarted(JavaBuilder.java:152)atorg.jetbrains.jps.incremental.IncProjectBuilder.runBuild(IncProjectBuilder.java:361)atorg.jetbrains.jps.incremental.IncProjectBuilder.build(IncProjectBuilder.java:178)atorg.jetbrains.jps.cmdline.BuildRunner.runBuild(BuildRunner.java:140)atorg.jetbrains.jps.cmdline.BuildSession.runBuild(BuildSession.java:297)at org.jetbrains.jps.cmdline.BuildSession.run(BuildSession.java:130)atorg.jetbrains.jps.cmdline.BuildMain$MyMessageHandler.lambda$channelRead0$0(BuildMain.java:232)atjava.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1149)atjava.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:624)at java.lang.Thread.run(Thread.java:748)

I was trying to add Drawer in my application but faced an issue. Where Should I put my DrawerNavigator in side the SwitchNavigator

 drawer.js        import {createDrawerNavigator} from 'react-navigation-drawer';        import AboutScreen from '../screens/AboutScreen'        import FarmerHomeScreen from '../screens/FarmerHomeScreen'        const DrawerNavigation = createDrawerNavigator(            {                Home: FarmerHomeScreen,              About: AboutScreen,            },            {              initialRouteName: "Home",              contentOptions: {                activeTintColor: "red"              }            }          );          export default DrawerNavigation

MainRoute.js

    import {createAppContainer, createSwitchNavigator} from 'react-navigation';    import installationFlow from './installationFlow';    import loginFlow from './loginFlow';    import mainFlow from './mainFlow';    import ResolveLanguageScreen from '../screens/ResolveLanguageScreen';    import ResolveAuthScreen from '../screens/ResolveAuthScreen';    import DrawerNavigation from './drawer'    const switchNavigator = createSwitchNavigator({      Drawer :DrawerNavigation,        ResolveLanguage: ResolveLanguageScreen,        ResolveAuth: ResolveAuthScreen,        installationFlow: installationFlow,        loginFlow: loginFlow,        mainFlow: mainFlow,      });      const Application = createAppContainer(switchNavigator);      export default Application;

Where Should I place Drawer: DrawerNavigation, it works only when I place it at the top in SwitchNavigator

I am getting this error and I am having a lot of trouble fixing this.

What I am trying to do here is have 3 different screens and have a tabbar that navigates to each screen.

Here is my index:

import React, { Component } from 'react';import { AppRegistry, Navigator, StyleSheet, View, Text } from 'react-native';import Nav from './app/components/Nav';import Screen from './app/Screen';import Tabs from 'react-native-tabs'import SwitchView from './SwitchView';class Proj extends Component {constructor(props){    super(props);}render(){    var x = "FeedView";    return(<View style={styles.container}><Tabs selected={x} style={{backgroundColor:'white'}}                  selectedStyle={{color:'red'}} onSelect={el=> {x = el.props.name}}><Text name="FeedView">First</Text><Text name="WikiView" selectedIconStyle={{borderTopWidth:2,borderTopColor:'red'}}>Second</Text><Text name="BoardView">Third</Text></Tabs><SwitchView id={x}/></View>    );}}const styles = StyleSheet.create({container: {flex: 1,justifyContent: 'center',alignItems: 'center',backgroundColor: '#F5FCFF',},welcome: {fontSize: 20,textAlign: 'center',margin: 10,},instructions: {textAlign: 'center',color: '#333333',marginBottom: 5,},})AppRegistry.registerComponent('Proj', () => Proj);

here is my SwitchView:

import Feed from './app/pages/Feed/Feed';import Board from './app/pages/Board';import Wiki from './app/pages/Wiki';class SwitchView extends Component {render(){    var { id } = this.props;    switch (id) {        case "FeedView":            return <Feed/>        case "WikiView":            return <Wiki/>        case "BoardView":            return <Board/>    }}}

i want get the distance from touchstart to touchmove, ontouchmove works fine on ios, but not fired on every movement on android, how to make it work on android?

<FlatList        style={{ flex: 1 }}        ref={(ref) => {          this.flatListRef = ref;        }}        onTouchStart={(event) => {          const { nativeEvent } = event;          const { pageY } = nativeEvent;          startY = pageY;        }}        onTouchMove={(event) => {          // event.preventDefault();          const { didReachBottom, didReachTop } = this.state;          const { nativeEvent } = event;          const { pageY } = nativeEvent;          const offsetXY = pageY - startY;          console.log('flatlist onTouchMove');          if (type && type !== 'category') {            return;          }          const allowTouch = (offsetXY > 0 && didReachTop) || (offsetXY < 0 && didReachBottom);          if (!allowTouch) {            return;          }          const offsetHeight = Math.min(MAX_LOADING_HEIGHT, Math.abs(offsetXY));          if (offsetXY > 0) {            this.setState({              headerY: offsetHeight,              footerY: 0            });          }          if (offsetXY < 0) {            this.setState({              headerY: 0,              footerY: offsetHeight            });          }        }}        onTouchEnd={(event) => {          const { headerY, footerY } = this.state;          if (headerY >= MAX_LOADING_HEIGHT / 2) {            this.preClass();            return;          }          if (footerY >= MAX_LOADING_HEIGHT / 2) {            this.nextClass();            return;          }          this.setState({            footerY: 0,            headerY: 0          });          // reset startY          startY = 0;        }}        onScroll={(evt) => {          console.log('scroll');          const { contentOffset, contentSize, layoutMeasurement } = evt.nativeEvent;          let contentHeight = contentSize.height;          const offsetY = contentOffset.y;          const layoutHeight = layoutMeasurement.height;          if (contentHeight <= layoutHeight) {            contentHeight = layoutHeight;          }          const bottomGap = contentHeight - offsetY - layoutHeight;          this.setState({            didReachTop: offsetY === 0,            didReachBottom: bottomGap === 0          });        }}        // scrollEnabled={this.state.isMove}        onScrollEndDrag={(evt) => {          const { contentOffset, contentSize, layoutMeasurement } = evt.nativeEvent;          let contentHeight = contentSize.height;          const offsetY = contentOffset.y;          const layoutHeight = layoutMeasurement.height;          if (contentHeight <= layoutHeight) {            contentHeight = layoutHeight;          }          const bottomGap = contentHeight - offsetY - layoutHeight;          const reachBottom = bottomGap === 0;          console.log('onScrollEndDrag bottomGap', bottomGap, offsetY === 0 || bottomGap > 0);          this.setState({            didReachTop: offsetY === 0,            didReachBottom: bottomGap === 0          });        }}        ListEmptyComponent={() => (<View            style={[styles.listEmpty]}><Text style={{ color: '#000' }}>{isProductEmpty ? T('g_no_list_data') : ''}</Text></View>        )}        bounces={false}        keyExtractor={(item: any) => `${item.id}`}        data={products}        initialNumToRender={4}        numColumns={2}        columnWrapperStyle={{          flexDirection: showView === 'list' ? 'row' : 'column'        }}        contentContainerStyle={styles.contentContainerStyle}        getItemLayout={(_, index) => ({ length: this.state.cardHeight, offset: this.state.cardHeight * index, index })}        onViewableItemsChanged={this.handleViewableItemsChanged}        viewabilityConfig={this.viewabilityConfig}        renderItem={({ item, index }: any) => (<Product            showView={showView}            T={T}            isEnd={index === products.length - 1}            no={item.no}            key={`${item.id}`}            type={getType(item, type)}          />        )}      />

i want get the distance from touchstart to touchmove, ontouchmove works fine on ios, but not fired on every movement on android, how to make it work on android?

We're developing program on React Native, and I have a question. How to make a text input mask for ZIP code and mobile phone number via React Native?

Here's a sample:

I'm trying to update my FLIPPER_VERSION from 0.33.1 to latest on react native (android) but it gives me a build failed output, how do i upgrade my FLIPPER_VERSION ?

gradle.properties

FLIPPER_VERSION=0.33.1 #FLIPPER_VERSION=0.46.0

I'm new in react-native, when trying to run-android with npm react-native run-android I got this error:

FAILURE: Build failed with an exception.* What went wrong: Execution failed for task ':app:processDebugResources'.> Could not read path 'D:\*PROJECTPATH*\android\app\build\generated\not_namespaced_r_class_sources\debug\r\androidx\arch'.BUILD FAILED in 28serror Failed to install the app. Make sure you have the Android development environment set up: https://facebook.github.io/react-native/docs/getting-started.html#android-development-environment. Run CLI with --verbose flag for more details. Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081FAILURE: Build failed with an exception.BUILD FAILED in 28s    at checkExecSyncError (child_process.js:629:11)    at execFileSync (child_process.js:647:13)    at runOnAllDevices (D:\*PROJECTPATH*\node_modules\@react-native-community\cli-platform-android\build\commands\runAndroid\runOnAllDevices.js:94:39)

But when trying to run it from Android Studio it runs fine. Can anyone tell me why? Thanks.

My Environment :
OS : Windows 10
NPM : 6.14.4
Node : v10.21.0

Do we not need a UI Engine (especially for cross-platform solutions like flutter, react native, electron, etc.) that shows you how your code will look and run without running the whole android or ios on emulator.

Now I know about hot reload but how about hot reload on steroids?

Game engines have it. In most game engines you see the changes in the view panel. You don't require an entire os up and running. You only see what you need to. If we want to see it on a different screen ratio we can change it then and there.Check Unity game engine out for a sec.

We build the app when we finally decide to run it on device.

Do we not need a similar kind of thing? A UI engine of some kind?

(Looking forward to a lot of tools and websites I dont know about in the comments. ;) )