I am trying to add a side menu to my react-native application using react-native-navigation. The goal is to have a hamburger menu that when activated shows the side menu. I searched the official component documentation https://wix.github.io/react-native-navigation/docs/sideMenu/, but the information was not enough. Can someone help me by showing a practical step-by-step how to set up this side menu and when clicking on the options, rederize the desired screen?

my index.js

import { Navigation } from "react-native-navigation";import Login from './src/screen/Login';import Main from './src/screen/Main';import UserAccount from './src/screen/UserAccount';Navigation.registerComponent('Login', () => Login);Navigation.registerComponent('Main', () => Main);Navigation.registerComponent('UserAccount', () => UserAccount);Navigation.setDefaultOptions({    topBar: {        leftButtons: {            id: 'sideMenu',            icon: require('./resource/img/menuIcon.png')        },        title: {            alignment: 'left'        }    }});Navigation.events().registerAppLaunchedListener(async () => {   //code for the side menu});

I've been trying to use this login screens at a project -> https://github.com/itzpradip/react-navigation-v5-mix.I've got all files and installed all dependencies (with yarn), but I'm getting this error:

    info Running jetifier to migrate libraries to AndroidX. You can disable it using "--no-jetifier" flag.Jetifier found 1372 file(s) to forward-jetify. Using 4 workers...info Starting JS server...info Installing the app...> Task :@mauron85_react-native-background-geolocation-common:compileDebugJavaWithJavac> Task :mauron85_react-native-background-geolocation:compileDebugJavaWithJavac> Task :react-native-camera:compileGeneralDebugJavaWithJavac> Task :react-native-community_async-storage:compileDebugJavaWithJavac> Task :react-native-geolocation-service:compileDebugJavaWithJavac> Task :react-native-gesture-handler:compileDebugJavaWithJavac> Task :react-native-maps:compileDebugJavaWithJavac> Task :react-native-reanimated:compileDebugJavaWithJavac> Task :react-native-screens:compileDebugJavaWithJavac> Task :app:compileDebugJavaWithJavac 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.0.1/userguide/command_line_interface.html#sec:command_line_warnings210 actionable tasks: 210 executedNote: 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: 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: C:\Users\danilojldeo\Desktop\MeuGithub\controle-de-pragas\node_modules\react-native-camera\android\src\main\java\com\google\android\cameraview\Camera2.java uses unchecked or unsafe operations.Note: Recompile with -Xlint:unchecked for details.Note: C:\Users\danilojldeo\Desktop\MeuGithub\controle-de-pragas\node_modules\@react-native-community\async-storage\android\src\main\java\com\reactnativecommunity\asyncstorage\AsyncStorageModule.java uses or overrides a deprecated API.Note: Recompile with -Xlint:deprecation for details.Note: C:\Users\danilojldeo\Desktop\MeuGithub\controle-de-pragas\node_modules\react-native-geolocation-service\android\src\main\java\com\agontuk\RNFusedLocation\LocationUtils.java uses or overrides a deprecated API.Note: Recompile with -Xlint:deprecation for details.Note: C:\Users\danilojldeo\Desktop\MeuGithub\controle-de-pragas\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: C:\Users\danilojldeo\Desktop\MeuGithub\controle-de-pragas\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: C:\Users\danilojldeo\Desktop\MeuGithub\controle-de-pragas\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.C:\Users\danilojldeo\Desktop\MeuGithub\controle-de-pragas\android\app\src\main\java\com\tracker\MainApplication.java:82: error: reached end of file while parsing} ^1 errorFAILURE: Build failed with an exception.* What went wrong:Execution failed for task ':app:compileDebugJavaWithJavac'.> Compilation failed; see the compiler error output for details.* 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 1m 19serror 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: 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: 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: C:\Users\danilojldeo\Desktop\MeuGithub\controle-de-pragas\node_modules\react-native-camera\android\src\main\java\com\google\android\cameraview\Camera2.java uses unchecked or unsafe operations.Note: Recompile with -Xlint:unchecked for details.Note: C:\Users\danilojldeo\Desktop\MeuGithub\controle-de-pragas\node_modules\@react-native-community\async-storage\android\src\main\java\com\reactnativecommunity\asyncstorage\AsyncStorageModule.java uses or overrides a deprecated API.Note: Recompile with -Xlint:deprecation for details.Note: C:\Users\danilojldeo\Desktop\MeuGithub\controle-de-pragas\node_modules\react-native-geolocation-service\android\src\main\java\com\agontuk\RNFusedLocation\LocationUtils.java uses or overrides a deprecated API.Note: Recompile with -Xlint:deprecation for details.Note: C:\Users\danilojldeo\Desktop\MeuGithub\controle-de-pragas\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: C:\Users\danilojldeo\Desktop\MeuGithub\controle-de-pragas\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: C:\Users\danilojldeo\Desktop\MeuGithub\controle-de-pragas\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.C:\Users\danilojldeo\Desktop\MeuGithub\controle-de-pragas\android\app\src\main\java\com\tracker\MainApplication.java:82: error: reached end of file while parsing} ^1 errorFAILURE: Build failed with an exception.* What went wrong:Execution failed for task ':app:compileDebugJavaWithJavac'.> Compilation failed; see the compiler error output for details.* 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 1m 19s    at makeError (C:\Users\danilojldeo\Desktop\MeuGithub\controle-de-pragas\node_modules\execa\index.js:174:9)    at C:\Users\danilojldeo\Desktop\MeuGithub\controle-de-pragas\node_modules\execa\index.js:278:16    at processTicksAndRejections (internal/process/task_queues.js:97:5)    at async runOnAllDevices (C:\Users\danilojldeo\Desktop\MeuGithub\controle-de-pragas\node_modules\@react-native-community\cli-platform-android\build\commands\runAndroid\runOnAllDevices.js:94:5)    at async Command.handleAction (C:\Users\danilojldeo\Desktop\MeuGithub\controle-de-pragas\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 imagine that it's becouse of the react-native-reanimated, or the react-native-gesture-handler, becouse they are the only ones that I had to do some manual changes to install them. (I'm not using Expo, I'm using an Android Simulator).

Here the steps I didReact-Native-Reanimated -> https://docs.swmansion.com/react-native-reanimated/docs/installation/React-Native-Gesture-Handler -> https://docs.swmansion.com/react-native-gesture-handler/docs/getting-started.html

And here is the MainApplication.Java code:

package com.tracker;import android.app.Application;import android.content.Context;import com.facebook.react.PackageList;import com.facebook.react.ReactApplication;import com.ocetnik.timer.BackgroundTimerPackage;import com.facebook.react.ReactInstanceManager;import com.facebook.react.ReactNativeHost;import com.facebook.react.ReactPackage;import com.facebook.soloader.SoLoader;import java.lang.reflect.InvocationTargetException;import java.util.List;import com.facebook.react.config.ReactFeatureFlags;import com.facebook.react.bridge.JSIModulePackage;import com.swmansion.reanimated.ReanimatedJSIModulePackage;public class MainApplication extends Application implements ReactApplication {  static {    ReactFeatureFlags.useTurboModules = true;  }  private final ReactNativeHost mReactNativeHost =      new ReactNativeHost(this) {        @Override        public boolean getUseDeveloperSupport() {          return BuildConfig.DEBUG;        }        @Override        protected List<ReactPackage> getPackages() {          @SuppressWarnings("UnnecessaryLocalVariable")          List<ReactPackage> packages = new PackageList(this).getPackages();          // Packages that cannot be autolinked yet can be added manually here, for example:          // packages.add(new MyReactNativePackage());          return packages;        }        @Override        protected String getJSMainModuleName() {          return "index";        }        @Override        protected JSIModulePackage getJSIModulePackage() {          return new ReanimatedJSIModulePackage();        };  @Override  public ReactNativeHost getReactNativeHost() {    return mReactNativeHost;  }  @Override  public void onCreate() {    super.onCreate();    SoLoader.init(this, /* native exopackage */ false);    initializeFlipper(this, getReactNativeHost().getReactInstanceManager());  }  /**   * Loads Flipper in React Native templates. Call this in the onCreate method with something like   * initializeFlipper(this, getReactNativeHost().getReactInstanceManager());   *   * @param context   * @param reactInstanceManager   */  private static void initializeFlipper(      Context context, ReactInstanceManager reactInstanceManager) {    if (BuildConfig.DEBUG) {      try {        /*         We use reflection here to pick up the class that initializes Flipper,        since Flipper library is not available in release mode        */        Class<?> aClass = Class.forName("com.tracker.ReactNativeFlipper");        aClass            .getMethod("initializeFlipper", Context.class, ReactInstanceManager.class)            .invoke(null, context, reactInstanceManager);      } catch (ClassNotFoundException e) {        e.printStackTrace();      } catch (NoSuchMethodException e) {        e.printStackTrace();      } catch (IllegalAccessException e) {        e.printStackTrace();      } catch (InvocationTargetException e) {        e.printStackTrace();      }    }  }}

Here is all the packages I had to install, but you can see them at the package.json in GitHub link that it's in the start of this question.

yarn add @react-native-community/async-storage @react-native-community/masked-view @react-navigation/drawer @react-navigation/material-bottom-tabs @react-navigation/native @react-navigation/stack react-native-animatable react-native-gesture-handler react-native-linear-gradient react-native-paper react-native-reanimated react-native-safe-area-context react-native-screens

Can somebody please help me?

I am on windows 7 64 bit, aiming to set it up for app development.

Installed yarn, react-native-app (yarn global add create-react-native-app), expo (create Npm install --unsafe-perm -g expo-cli), created a project (create-react-native-app myreactproj), added local.properties file in C:\Users\TOTAL\myreactproj\android with a line sdk.dir=C:\Users\TOTAL\AppData\Local\Android\Sdk, and the address does point to the sdk folder containing platform-tools folder with ADB executable and all. Still, as I follow with yarn android --no-jetifier, I am getting an error message telling me to add the sdk.dir line to local.properties or to add environmental variable ANDROID_SDK_ROOT, which I also have done, setting this to C:\Users\TOTAL\AppData\Local\Android\Sdk both for 'user' and 'environmental'.

What shall I do? I attach the screenshots

I want to use ComponentName in my react native module.

PackageManager pm = reactContext.getPackageManager();ComponentName cn = new ComponentName(reactContext,com.my.app.MyClass.class);pm.setComponentEnabledSetting(cn,PackageManager.COMPONENT_ENABLED_STATE_ENABLED,PackageManager.DONT_KILL_APP);

I want to use code like this.HoweverCan't get com.my.app.MyClass.class What should I do?

Is there a method that like getResources() for class?

I'm trying to setup a new react-native project but I ran into this error when I tried react-native run-android:

What went wrong:Execution failed for task ':app:validateSigningDebug'.> Keystore file 'C:\Users\Ahers\Downloads\reactnative-beautiful-ui-master (1)\reactnative-beautiful-ui-master\android\app\debug.keystore' not found for signing config 'debug'. error 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: C:\Users\Ahers\Downloads\reactnative-beautiful-ui-master (1)\reactnative-beautiful-ui-master\node_modules\react-native-gesture-handler\android\src\main\java\com\swmansion\gesturehandler\react\RNGestureHandlerButtonViewManager.java uses or overrides a deprecated API.

Here's my build.grade code:

// Top-level build file where you can add configuration options common to all sub-projects/modules.buildscript {    ext {        buildToolsVersion = "28.0.3"        minSdkVersion = 16        compileSdkVersion = 28        targetSdkVersion = 28        supportLibVersion = "28.0.0"    }    repositories {        google()        jcenter()    }    dependencies {        classpath("com.android.tools.build:gradle:3.4.1")        // NOTE: Do not place your application dependencies here; they belong        // in the individual module build.gradle files    }}allprojects {    repositories {        mavenLocal()        maven {            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm            url("$rootDir/../node_modules/react-native/android")        }        maven {            // Android JSC is installed from npm            url("$rootDir/../node_modules/jsc-android/dist")        }        google()        jcenter()    }}

I tried running this command in order to fix it but it didn't work:

keytool -genkey -v -keystore debug.keystore  -storepass android -alias androiddebugkey -keypass android -keyalg RSA -keysize 2048 -validity 10000

I'm honestly not sure what to do so I would appreciate any suggestions.

I am not able to interact with my app, keyboard is not appearing on tap of field. Also I am not able to set the view background color. When I have inspected the window then it look likes in the uploaded image.

Sign In Screen:

 render() {return (<><CustomStatusBar /><SafeAreaView style={{flex: 1}}><View style={{flex: 1, flexDirection: 'column', backgroundColor: '#f00'}}> <TextInput style={{width: '80%', height: 54}}/></View></SafeAreaView></>);}

Stack Navigator:

const Stack = createStackNavigator();return (<Provider store={store}><NavigationContainer><Stack.Navigator initialRouteName='SignIn'><Stack.Screen name="SignIn" component={SignIn}/></Stack.Navigator></NavigationContainer></Provider>  );

I want to implement notifications via Firebase Cloud Messaging.

I'm using react-native (not expo) (android) and I want to know how I can get the token in the console. I've done the instructions as said in the Firebase website and was researching how I can get it.

I do not want to use third-party libraries. Is it possible?

I am trying to run my project on the android simulator. When I run react-native run-android I am getting the following:

FAILURE: Build failed with an exception.* What went wrong: Task 'installDebug' not found in root project 'android'.* Try: Run gradlew tasks to get a list of available tasks. Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.BUILD FAILED

If I run ./gradlew tasks I get:

Build Setup tasks-----------------init - Initializes a new Gradle build. [incubating]wrapper - Generates Gradle wrapper files. [incubating]Help tasks----------buildEnvironment - Displays all buildscript dependencies declared in root project 'android'.components - Displays the components produced by root project 'android'. [incubating]dependencies - Displays all dependencies declared in root project 'android'.dependencyInsight - Displays the insight into a specific dependency in root project 'android'.help - Displays a help message.model - Displays the configuration model of root project 'android'. [incubating]projects - Displays the sub-projects of root project 'android'.properties - Displays the properties of root project 'android'.tasks - Displays the tasks runnable from root project 'android'.

Any idea why I don't have a installDebug task in my project? How do I get it back?

React Native v 0.62.2.npm run android gives me below error:

TypeError: Cannot read property 'clean' of undefined

ExceptionsManager.js:76 Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication)

package.json

{"name": "client","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 . --ext .js,.jsx,.ts,.tsx","postinstall": "rn-nodeify --install process,buffer,crypto,stream,assert,events,vm --hack","graphql:codegen": "apollo client:codegen --target typescript"  },"dependencies": {"@react-native-community/art": "^1.2.0","@react-native-community/async-storage": "^1.10.3","@react-native-community/cameraroll": "^1.7.1","@react-native-community/clipboard": "^1.2.2","@react-native-community/geolocation": "^2.0.2","@react-native-community/masked-view": "^0.1.10","@react-native-community/push-notification-ios": "^1.2.0","@skele/components": "^1.0.0-alpha.40","apollo-cache-inmemory": "^1.6.6","apollo-client": "^2.6.10","apollo-link-context": "^1.0.20","apollo-link-error": "^1.1.13","apollo-link-http": "^1.5.17","apollo-link-ws": "^1.0.20","apollo-upload-client": "^13.0.0","assert": "^1.5.0","base-64": "^0.1.0","buffer": "^4.9.2","ethereumjs-abi": "^0.6.8","ethereumjs-util": "^6.2.0","ethereumjs-wallet": "^0.6.3","events": "^1.1.1","firebase": "^7.15.1","graphql": "^14.6.0","graphql-tag": "^2.10.3","i18n-js": "^3.5.1","invert-color": "^2.0.0","lodash.memoize": "^4.1.2","moment": "^2.26.0","process": "^0.11.10","react": "^16.13.1","react-apollo": "^3.1.5","react-dom": "^16.11.1","react-native": "^0.62.2","react-native-actionsheet": "^2.4.2","react-native-app-intro-slider": "^4.0.2","react-native-button": "^3.0.1","react-native-camera": "^3.28.0","react-native-crypto": "^2.2.0","react-native-dark-mode": "^0.2.2","react-native-device-info": "^5.5.7","react-native-dialog-input": "^1.0.7","react-native-elements": "^2.0.0","react-native-fast-image": "^8.1.5","react-native-firebase": "^5.6.0","react-native-geocoding": "^0.4.0","react-native-gesture-handler": "^1.6.1","react-native-google-places-autocomplete": "^1.7.1","react-native-image-crop-picker": "^0.25.3","react-native-image-filter-kit": "^0.7.1","react-native-image-picker": "^2.3.1","react-native-image-progress": "^1.1.1","react-native-image-view": "^2.1.9","react-native-indicators": "^0.17.0","react-native-ionicons": "^4.6.5","react-native-keyboard-aware-scroll-view": "^0.9.1","react-native-keyboard-aware-view": "^0.0.14","react-native-localize": "^1.4.0","react-native-maps": "^0.27.1","react-native-modal": "^11.5.6","react-native-modalbox": "^2.0.0","react-native-progress": "^4.1.2","react-native-push-notification": "^3.5.2","react-native-randombytes": "^3.5.3","react-native-reanimated": "~1.9.0","react-native-safe-area-context": "^3.0.2","react-native-safe-area-view": "^1.1.1","react-native-screens": "^2.8.0","react-native-search-box": "^0.0.19","react-native-splash-screen": "^3.2.0","react-native-swiper": "^1.6.0","react-native-vector-icons": "^6.6.0","react-native-video": "^4.4.5","react-native-view-more-text": "^2.1.0","react-native-web": "~0.12.2","react-navigation": "^4.1.0","react-navigation-drawer": "^2.4.11","react-navigation-hooks": "^1.1.0","react-navigation-stack": "^2.1.0","react-navigation-tabs": "^2.7.0","react-redux": "^7.2.0","readable-stream": "^1.0.33","redux": "^4.0.5","redux-logger": "^3.0.6","redux-thunk": "^2.3.0","remote-redux-devtools": "^0.5.16","rn-nodeify": "^10.2.0","stream-browserify": "^1.0.0","subscriptions-transport-ws": "^0.9.16","uuidv4": "^6.0.7","vm-browserify": "0.0.4"  },"devDependencies": {"@babel/core": "^7.6.2","@babel/runtime": "^7.6.2","@react-native-community/eslint-config": "^0.0.5","@types/apollo-upload-client": "^8.1.3","@types/jest": "^24.0.24","@types/react-native": "^0.60.25","@types/react-native-push-notification": "^3.0.9","@types/react-test-renderer": "16.9.1","@typescript-eslint/eslint-plugin": "^2.12.0","@typescript-eslint/parser": "^2.12.0","apollo": "^2.27.4","babel-jest": "^25.1.0","babel-plugin-transform-remove-console": "^6.9.4","eslint": "^6.5.1","jest": "^25.1.0","jetifier": "^1.6.6","metro": "^0.59.0","metro-react-native-babel-preset": "^0.56.0","react-test-renderer": "16.9.0","typescript": "^3.8.3"  },"jest": {"preset": "react-native","moduleFileExtensions": ["ts","tsx","js","jsx","json","node"    ]  },"react-native": {"_stream_transform": "readable-stream/transform","_stream_readable": "readable-stream/readable","_stream_writable": "readable-stream/writable","_stream_duplex": "readable-stream/duplex","_stream_passthrough": "readable-stream/passthrough","stream": "stream-browserify","crypto": "react-native-crypto","vm": "vm-browserify"  },"browser": {"_stream_transform": "readable-stream/transform","_stream_readable": "readable-stream/readable","_stream_writable": "readable-stream/writable","_stream_duplex": "readable-stream/duplex","_stream_passthrough": "readable-stream/passthrough","stream": "stream-browserify","crypto": "react-native-crypto","vm": "vm-browserify"  },"resolutions": {"@react-native-community/cli-debugger-ui": "4.7.0"  }}

android/bundle.gradle

// Top-level build file where you can add configuration options common to all sub-projects/modules.buildscript {    ext {        buildToolsVersion = "28.0.3"        minSdkVersion = 16        compileSdkVersion = 28        targetSdkVersion = 28        supportLibVersion = "28.0.0"        supportVersion = "28.0.0"        googlePlayServicesVersion = "15.0.1"        facebookSdkVersion = "4.37.0"    }    repositories {        google()        jcenter()        mavenCentral()    }    dependencies {        classpath("com.android.tools.build:gradle:3.5.2")        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 {        mavenLocal()        maven {            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm            url("$rootDir/../node_modules/react-native/android")        }        maven {            // Android JSC is installed from npm            url("$rootDir/../node_modules/jsc-android/dist")        }        maven { url 'https://maven.google.com' }        maven { url "https://www.jitpack.io" }        google()        jcenter()    }}

android/app/bundle.gradle

apply plugin: "com.android.application"import com.android.build.OutputFileproject.ext.react = [    entryFile: "index.js",    enableHermes: false,  // clean and rebuild if changing]apply from: "../../node_modules/react-native/react.gradle"def enableSeparateBuildPerCPUArchitecture = false/** * Run Proguard to shrink the Java bytecode in release builds. */def enableProguardInReleaseBuilds = falsedef jscFlavor = 'org.webkit:android-jsc:+'def enableHermes = project.ext.react.get("enableHermes", false);android {    compileSdkVersion rootProject.ext.compileSdkVersion    buildToolsVersion rootProject.ext.buildToolsVersion    compileOptions {        sourceCompatibility JavaVersion.VERSION_1_8        targetCompatibility JavaVersion.VERSION_1_8    }    dexOptions {        javaMaxHeapSize "3g"    }    defaultConfig {        applicationId "com.client"        minSdkVersion rootProject.ext.minSdkVersion        targetSdkVersion rootProject.ext.targetSdkVersion        versionCode 1        versionName "1.12"        missingDimensionStrategy 'react-native-camera', 'general'        multiDexEnabled true    }    splits {        abi {            reset()            enable enableSeparateBuildPerCPUArchitecture            universalApk false  // If true, also generate a universal APK            include "armeabi-v7a", "x86", "arm64-v8a", "x86_64"        }    }    signingConfigs {        debug {            storeFile file('debug.keystore')            storePassword 'android'            keyAlias 'androiddebugkey'            keyPassword 'android'        }        release {            if (project.hasProperty('MYAPP_UPLOAD_STORE_FILE')) {                storeFile file(MYAPP_UPLOAD_STORE_FILE)                storePassword MYAPP_UPLOAD_STORE_PASSWORD                keyAlias MYAPP_UPLOAD_KEY_ALIAS                keyPassword MYAPP_UPLOAD_KEY_PASSWORD            }        }    }    buildTypes {        debug {            signingConfig signingConfigs.debug        }        release {            // Caution! In production, you need to generate your own keystore file.            // see https://facebook.github.io/react-native/docs/signed-apk-android.            signingConfig signingConfigs.release            minifyEnabled enableProguardInReleaseBuilds            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"        }    }    packagingOptions {        pickFirst "lib/armeabi-v7a/libc++_shared.so"        pickFirst "lib/arm64-v8a/libc++_shared.so"        pickFirst "lib/x86/libc++_shared.so"        pickFirst "lib/x86_64/libc++_shared.so"    }    // applicationVariants are e.g. debug, release    applicationVariants.all { variant ->        variant.outputs.each { output ->            // For each separate APK per architecture, set a unique version code as described here:            // https://developer.android.com/studio/build/configure-apk-splits.html            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            }        }    }}dependencies {    implementation fileTree(dir: "libs", include: ["*.jar"])    implementation "com.facebook.react:react-native:+"  // From node_modules    implementation 'androidx.appcompat:appcompat:1.2.0-rc01'    implementation 'androidx.swiperefreshlayout:swiperefreshlayout:1.1.0-alpha02'    implementation 'com.android.support:multidex:1.0.3'    implementation 'androidx.multidex:multidex:2.0.1'    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-auth:17.0.0"    implementation "com.google.firebase:firebase-firestore:19.0.0"    implementation "com.google.firebase:firebase-messaging:19.0.0"    implementation "com.google.firebase:firebase-storage:17.0.0"    debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {      exclude group:'com.facebook.fbjni'    }    debugImplementation("com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}") {        exclude group:'com.facebook.flipper'    }    debugImplementation("com.facebook.flipper:flipper-fresco-plugin:${FLIPPER_VERSION}") {        exclude group:'com.facebook.flipper'    }    if (enableHermes) {        def hermesPath = "../../node_modules/hermes-engine/android/";        debugImplementation files(hermesPath +"hermes-debug.aar")        releaseImplementation files(hermesPath +"hermes-release.aar")    } else {        implementation jscFlavor    }}// Run this once to be able to run the application with BUCK// puts all compile dependencies into folder libs for BUCK to usetask copyDownloadableDepsToLibs(type: Copy) {    from configurations.compile    into 'libs'}apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)apply plugin: 'com.google.gms.google-services'

Has anyone experience this error with expo, when running react-native run-android?

error: bundling failed: Error: Unable to resolve module `./Linking/Linking` from `node_modules/expo/build/ExpoLazy.js`: None of these files exist:  * node_modules/expo/build/Linking/Linking(.native|.android.js|.native.js|.js|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx)  * node_modules/expo/build/Linking/Linking/index(.native|.android.js|.native.js|.js|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx)

"expo": "^37.0.9",

After i added product flavors in my react native project, the app always crashes when i made a release, right after i started it.

I tried to open android studio to see Logcat, but since the app crashes in the moment it's started i couldn't see anything.

Here is part of my app/build.gladle:

project.ext.envConfigFiles = [    dev: ".env.local",    production: ".env.production",    staging: ".env.staging"]apply from: project(':react-native-config').projectDir.getPath() +"/dotenv.gradle"android {    flavorDimensions "default"    defaultConfig {        applicationId "com.company"        applicationIdSuffix ""        minSdkVersion rootProject.ext.minSdkVersion        targetSdkVersion rootProject.ext.targetSdkVersion        ndk {            abiFilters "armeabi-v7a", "x86"        }        resValue "string", "build_config_package", "com.company"    }    buildTypes {        release {            minifyEnabled enableProguardInReleaseBuilds            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"        }    }    productFlavors {        dev {            minSdkVersion rootProject.ext.minSdkVersion            targetSdkVersion rootProject.ext.targetSdkVersion            applicationIdSuffix ".dev"            versionNameSuffix "-dev"        }        staging {            minSdkVersion rootProject.ext.minSdkVersion            targetSdkVersion rootProject.ext.targetSdkVersion            applicationIdSuffix ".staging"            versionNameSuffix "-staging"        }        production {        }    }}

I'm also using fastLane for deploy my app, like this:

lane :staging do |options|gradle(task: 'clean')gradle(  task: "assemble",  flavor: "Staging",  build_type: "Release",  print_command: false,  properties: {"android.injected.signing.store.file" => "file.keystore","android.injected.signing.store.password" => options[:storepass],"android.injected.signing.key.alias" => options[:keyalias],"android.injected.signing.key.password" => options[:keypass],  })upload_to_play_store(track: 'alpha')end

I'm trying using React Native to create a drawer navigator at an Android project, but i'm gettin a "undefined is not a function", like in this print

here is the code:

import 'react-native-gesture-handler';import React, { useEffect } from 'react';import { View, ActivityIndicator } from 'react-native';import { createDrawerNavigator } from '@react-navigation/drawer';import AsyncStorage from '@react-native-community/async-storage';import {  NavigationContainer,  DefaultTheme as NavigationDefaultTheme,  DarkTheme as NavigationDarkTheme,} from '../../../node_modules/@react-navigation/native';import {  Provider as PaperProvider,  DefaultTheme as PaperDefaultTheme,  DarkTheme as PaperDarkTheme,} from '../../../node_modules/react-native-paper';import { DrawerContent } from './screens/DrawerContent';import MainTabScreen from './screens/MainTabScreen';import SupportScreen from './screens/SupportScreen';import SettingsScreen from './screens/SettingsScreen';import BookmarkScreen from './screens/BookmarkScreen';import { AuthContext } from './components/context';import RootStackScreen from './screens/RootStackScreen';const Drawer = createDrawerNavigator();const App = () => {  // const [isLoading, setIsLoading] = React.useState(true);  // const [userToken, setUserToken] = React.useState(null);  const [isDarkTheme, setIsDarkTheme] = React.useState(false);  const initialLoginState = {    isLoading: true,    userName: null,    userToken: null,  };  const CustomDefaultTheme = {    ...NavigationDefaultTheme,    ...PaperDefaultTheme,    colors: {      ...NavigationDefaultTheme.colors,      ...PaperDefaultTheme.colors,      background: '#ffffff',      text: '#333333',    },  };  const CustomDarkTheme = {    ...NavigationDarkTheme,    ...PaperDarkTheme,    colors: {      ...NavigationDarkTheme.colors,      ...PaperDarkTheme.colors,      background: '#333333',      text: '#ffffff',    },  };  const theme = isDarkTheme ? CustomDarkTheme : CustomDefaultTheme;  const loginReducer = (prevState, action) => {    // eslint-disable-next-line default-case    switch (action.type) {      case 'RETRIEVE_TOKEN':        return {          ...prevState,          userToken: action.token,          isLoading: false,        };      case 'LOGIN':        return {          ...prevState,          userName: action.id,          userToken: action.token,          isLoading: false,        };      case 'LOGOUT':        return {          ...prevState,          userName: null,          userToken: null,          isLoading: false,        };      case 'REGISTER':        return {          ...prevState,          userName: action.id,          userToken: action.token,          isLoading: false,        };    }  };  const [loginState, dispatch] = React.useReducer(    loginReducer,    initialLoginState  );  const authContext = React.useMemo(    () => ({      signIn: async (foundUser) => {        // setUserToken('fgkj');        // setIsLoading(false);        const userToken = String(foundUser[0].userToken);        const userName = foundUser[0].username;        try {          await AsyncStorage.setItem('userToken', userToken);        } catch (e) {          console.log(e);        }        // console.log('user token: ', userToken);        dispatch({ type: 'LOGIN', id: userName, token: userToken });      },      signOut: async () => {        // setUserToken(null);        // setIsLoading(false);        try {          await AsyncStorage.removeItem('userToken');        } catch (e) {          console.log(e);        }        dispatch({ type: 'LOGOUT' });      },      signUp: () => {        // setUserToken('fgkj');        // setIsLoading(false);      },      toggleTheme: () => {        // eslint-disable-next-line no-shadow        setIsDarkTheme((isDarkTheme) => !isDarkTheme);      },    }),    []  );  useEffect(() => {    setTimeout(async () => {      // setIsLoading(false);      let userToken;      userToken = null;      try {        userToken = await AsyncStorage.getItem('userToken');      } catch (e) {        console.log(e);      }      // console.log('user token: ', userToken);      dispatch({ type: 'RETRIEVE_TOKEN', token: userToken });    }, 1000);  }, []);  if (loginState.isLoading) {    return (<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}><ActivityIndicator size="large" /></View>    );  }  return (<PaperProvider theme={theme}><AuthContext.Provider value={authContext}><NavigationContainer theme={theme}>          {loginState.userToken !== null ? (<Drawer.Navigator              drawerContent={(props) => <DrawerContent {...props} />}><Drawer.Screen name="HomeDrawer" component={MainTabScreen} /><Drawer.Screen name="SupportScreen" component={SupportScreen} /><Drawer.Screen name="SettingsScreen" component={SettingsScreen} /><Drawer.Screen name="BookmarkScreen" component={BookmarkScreen} /></Drawer.Navigator>          ) : (<RootStackScreen />          )}</NavigationContainer></AuthContext.Provider></PaperProvider>  );};export default App;

If I change the "createDrawerNavigator" to "createStackNavigator", like

import { createDrawerNavigator } from '@react-navigation/drawer';

TO

import { createStackNavigator} from '@react-navigation/stack';

&&

const Drawer = createDrawerNavigator();

TO

const Drawer = createStackNavigator();

It works perfectly, but I don't want a stack, I want a drawer.

I've installed the react-navigation like this:

yarn add @react-navigation/nativeyarn add react-native-reanimated react-native-gesture-handler react-native-screens react-native-safe-area-context @react-native-community/masked-view

And I had to make a few changes in MainActivity.java, that now is looking like this:

import com.facebook.react.ReactActivity;import com.facebook.react.ReactActivityDelegate;import com.facebook.react.ReactRootView;import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;public class MainActivity extends ReactActivity {      /**       * Returns the name of the main component registered from JavaScript. This is used to schedule       * rendering of the component.       */      @Override      protected String getMainComponentName() {        return "Tracker";      }      @Override      protected ReactActivityDelegate createReactActivityDelegate() {        return new ReactActivityDelegate(this, getMainComponentName()) {          @Override          protected ReactRootView createRootView() {           return new RNGestureHandlerEnabledRootView(MainActivity.this);          }        };      }    }

Can somebody PLEASE help me??

I want to reach the permissions shown in the picture. How can I do with React Native?

Best Regards

enter image description here

When I'm running npm run android in cmd to run react-native code into my Android device an error is raising. The error is **Could not initialize class org.codehaus.groovy.runtime.InvokerHelper**. I have followed the documentation of React Native website. But I can not figure out the error. Please help.

Thank in advance and sorry for my bad English.

I'm using react-native-router-flux to show a drawer menu but the hamburguer menu is just working when I click it. But when I try to swipe from left to right the menu is not showing, it also is not get hide when I click outside of menu.

this is my route:

export default class App extends Component {    render() {        return (<Router><Scene><Drawer                    hideNavBar                    key="drawerMenu"                    contentComponent={SideBar}                    drawerWidth={250}                    drawerPosition="right"><Scene                        key="profileScreen"                        component={Home}                    /></Drawer></Scene></Router>        );    }}

And my home page is:

import React from 'react';import { StyleSheet, Text, SafeAreaView, TouchableOpacity } from 'react-native';const Home = () => {  const goToAbout = () => {     Actions.about()  }  return (<TouchableOpacity style = {{ margin: 128 }} onPress = {goToAbout}><Text>This is HOME!</Text></TouchableOpacity>  ) }const styles = StyleSheet.create({  container: {    flex: 1,      },});export default Home;

My package json is:

"dependencies": {"react": "16.11.0","react-native": "0.62.2","react-native-gesture-handler": "^1.6.1","react-native-reanimated": "^1.9.0","react-native-router-flux": "^4.2.0","react-native-screens": "^2.8.0"  },

Thank you for any help.

I have installed the react dev tool. But I can't see it my Chrome browser when I launch my app on the emulator.

If you watch this youtube clip, you can see the react tab is in the list and you can inspect your app's UI.

Any idea why?

How can I inspect the app's UI/ elements if the react dev tool is not working on my Chrome?

I'm using a recently added (in v0.55.4) prop to TextInput called contextMenuHidden. When I add this prop to a TextInput component it seems to disable copy and paste for iOS but not for Android.

Has anyone else experienced this? Is there another step that needs to happen to get this to disable copy and paste on android?

<TextInput    style={...}    onChangeText={...}    value={...}    contextMenuHidden={true}  />

I have an app which was made entirely using react native. It's pretty much a todo list, this is the structure:

<SafeAreaView style={styles.container}><Text style={styles.title} >Registro de pacientes</Text>        {loading && (<ActivityIndicator            style={styles.loading}            size="large"            color="#0066ff"          />        )}        {!loading && (<ListaPacientes              pacientes={pacientes}             onUpdate={this.handleUpdate}          />        )}</SafeAreaView>

And here is the list:

<SectionList    sections={      pacientes && pacientes.length ?       [        {title: "Pacientes sin registrar", data: pacientes.filter(paciente => !paciente.done)},        {title: "Pacientes registrados", data: pacientes.filter(paciente => paciente.done)}      ] : []    }    keyExtractor={paciente => paciente.id}    renderItem={({item}) => renderItem(item)}    renderSectionHeader={renderSectionHeader}    style={styles.container}    ItemSeparatorComponent={renderSeparator}    ListEmptyComponent={renderEmptyComponent}    stickySectionHeadersEnabled={true}  />

This takes a list of clients and displays their names. Upon being clicked on, they are removed from the list. Very simple.

The thing is, the list of clients must be read from a csv file and, after being clicked, update the csv. I already have a piece of code that does that. However, it's written in kotlin (It was coded for another project).

Instead of having to do the whole fetching/reading/treating/updating of the data again in react native, can I somehow use the kotlin code I already have? If so, care to provide an example on how it would be done?

EDIT: To clarify, I have a kotlin method that returns an ArrayList of strings with the names I want to store on the list. How can I call that method from the javascript, obtain the arraylist, and use it as data source for my SectionList ?.

lateinit var pacientes: Array<String>@ReactMethodfun getListaPacientes() : Array<String> {    return pacientes}

Something like this?

  var res = []  res = ListaPacientesModulo.getListaPacientes()

Thank you.

I dont have any errors but I still cant open screen that I want. Here is my FlatList item:

let categories = [         {            screenName : Player,            name : "Category 1",            img : require("../Assets/Slika.jpg"),        },

Here is TouchableOpacity with onPress

return (<View style={styles.container}><FlatList                    data={categories}                    showsHorizontalScrollIndicator={false}                    numColumns={categories.length / 5}                    showsVerticalScrollIndicator={false}                    keyExtractor={(item, index) => index.toString()}                    renderItem = {({item, index}) => {                        return (<TouchableOpacity onPress={() => item.screenName}><Surface style={styles.surface}><ImageBackground                            source={item.img}                             style={styles.img}                            blurRadius={0.5}><Icon name="music" color="#fff" size={22}/><Text style={styles.name}>{item.name}</Text></ImageBackground></Surface></TouchableOpacity>                        );                    }}                /></View>

I'm trying to change font-family for texts in picker in react-native but it is not working,I have tried applying style in styles.xml in android folder like this :

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"><!-- Customize your theme here. --><item name="android:textColor">#000000</item><item name="android:spinnerItemStyle">@style/SpinnerItem</item><item name="android:spinnerDropDownItemStyle">@style/SpinnerDropDownItem</item></style><style name="SpinnerItem" parent="Theme.AppCompat.Light.NoActionBar"><item name="android:fontFamily">Muli-SemiBold</item><item name="android:textSize">18dp</item></style><style name="SpinnerDropDownItem" parent="Theme.AppCompat.Light.NoActionBar"><item name="android:textColor">#666</item><item name="android:textSize">18dp</item><item name="android:fontFamily">Muli-SemiBold</item><item name="android:padding">5dp</item></style>

How can i do this for android, item style works in iOS but not working in android, so can anyone suggest me how can i achieve it?I have fonts stored in the local folder, so do i need to give any path for that here?