Quantcast
Channel: Active questions tagged react-native+android - Stack Overflow
Viewing all 29788 articles
Browse latest View live

Plugins section in Android main project build.gradle

$
0
0

What is the format of the main project level Android build.gradle file when we have to use plugins section inside buildscript section? In other words I want to know where to put this section in the build.gradle file?

// plugins { 
// id "de.undercouch.download" version "4.0.2" 
// }

I want to know about this plugins section.

I am looking in the following guide:

https://docs.gradle.org/current/userguide/plugins.html

But it is in bits and pieces and I want to see complete example of build.gradle file.


React Native - What is the android alternative to iOS direction property on layout

$
0
0

My app supports both LTR and RTL, in specific components (graphs for exapmle are always English) i would like to manually set direction to ltr. It works great on iOS but not on android. Any ideas?

How do i extract a image URL from my firebase storage download react native/web [duplicate]

$
0
0

This question already has an answer here:

I have a problem with my current program, im using firebase storage with web, and i am trying to get the url by using getDownloadURL() method. I am using the documentation method but the var img that they were using cant be extracted out.

my console.log(url) outputs the url fine, but i am having trouble trying to make it appear on my app's screen when i do as i could not use any way to push that generated url out to my other codes, such as storing it inside my other variables.

I have tried various methods online pertaining to this such as using the xml,http etc but unfortunately i am unable to derive anything therefore i am posting this question..

    var storage = firebase.storage();       
    var ref = storage.ref('data/fbimage.jpg');
    var imageurl = ref.getDownloadURL().then(async function(url) {
      console.log(url);
      //how do i extract out the url from here?
    })

    console.log(imageurl) //I want the url to be used outside here to <Image source = {{url : imageurl}}/> 
    // but console log outputs a long text instead of what i require
    //...

Any help would be appreciated. Thank you!

Deprecated Gradle features were used in this build, making it incompatible with Gradle 6

$
0
0

I try to get Apk in react-native however it doesn't give me anything. release file which is in Apk file is empty and after Gradlew bundle release is finished, it says

    Deprecated Gradle features were used in this build, making it incompatible with Gradle 6.0.
Use '--warning-mode all' to show the individual deprecation warnings.
See https://docs.gradle.org/5.4.1/userguide/command_line_interface.html#sec:command_line_warnings

I couldn't find how to solve this issue

    react-native run-android
info Starting JS server...
info Building and installing the app on the device (cd android && ./gradlew app:installDebug)...
Starting a Gradle Daemon, 2 incompatible and 1 stopped Daemons could not be reused, use --status for details
> Task :app:transformClassesWithDexBuilderForDebug FAILED

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':app:transformClassesWithDexBuilderForDebug'.
> java.nio.file.AccessDeniedException: /home/kourosh/Projects/FitnessApp/android/app/build/intermediates/transforms/dexBuilder/debug/45/androidx/versionedparcelable/R.dex

* 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.org

Deprecated Gradle features were used in this build, making it incompatible with Gradle 6.0.
Use '--warning-mode all' to show the individual deprecation warnings.
See https://docs.gradle.org/5.4.1/userguide/command_line_interface.html#sec:command_line_warnings

BUILD FAILED in 1m 15s
19 actionable tasks: 1 executed, 18 up-to-date
error Could not install the app on the device, read the error above for details.
Make sure you have an Android emulator running or a device connected and have
set up your Android development environment:
https://facebook.github.io/react-native/docs/getting-started.html
error Command failed: ./gradlew app:installDebug. Run CLI with --verbose flag for more details.

java version "12.0.1" 2019-04-16 node -v v10.16.0 npm -v 6.9.0

How to set canOverrideExistingModule=true in React Native for Android Apps?

$
0
0

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:

enter image description here

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.

Realm for web development

$
0
0

I have been using a Realm for mobile development and now I am trying to build a website using the same database. I was wondering if a realm database can be used for standard web development.

How to add custom font in react native android

$
0
0

I am learning react-native, trying to create some demo apps just for learning. I want to set fontFamily to roboto thin of my toolbar title.

I have added roboto thin ttf in assets/fonts folder of my android project, however it seems that it is creating issues while running app. I am getting this issue while running

react-native start

ERROR  EPERM: operation not permitted, lstat 'E:\Myntra\android\app\build\gener
ated\source\r\debug\android\support\v7\appcompat'
{"errno":-4048,"code":"EPERM","syscall":"lstat","path":"E:\\Myntra\\android\\app
\\build\\generated\\source\\r\\debug\\android\\support\\v7\\appcompat"}
Error: EPERM: operation not permitted, lstat 'E:\Myntra\android\app\build\genera
ted\source\r\debug\android\support\v7\appcompat'
    at Error (native)

When I am removing the font then it is working fine. I am unable to fix this issue, can anyone help me what can be the reason for this.

Thanks in advance.

(React native) How to use SafeAreaView for Android notch devices?

$
0
0

I'm actually developing an app with react native and i'm testing with my one plus 6 and it has a notch. The SafeAreaView is a solution for the iPhone X but for Android, it seems there is no solution.

Did someone heard about anything to solve this kinf of issue ?


Plugins section in Android main project build.gradle and missing modules

$
0
0
  1. I get the following error:

BUILD FAILED in 56s ERROR: Plugin [id: 'de.undercouch.download'] was not found in any of the following sources:

- Gradle Core Plugins (plugin is not in 'org.gradle' namespace)
- Plugin Repositories (plugin dependency must include a version number for this source)

I want to know about this plugins section.

I am looking in the following guide:

Plugins in Android Gradle

But it is in bits and pieces and I want to see complete example of build.gradle file.


  1. How to integrate the following in "/nbproject":

/@react-native-community/cli-platform-android/native_modules.gradle

all I can see is the following folder in the path:

/@react-native-community/cli

  1. Missing react-native-unimodules in /nbproject. At the end of this post is my settings.gradle: So what command I should use instead of:

npm install


//apply from: "../../node_modules/react-native-unimodules/gradle.groovy"
apply from: "/Users/lion/Documents/Project/ReactNative/Libraries/rn_mac_kitchensync/node_modules/react-native-unimodules/gradle.groovy"
include ':react-native-screens'
project(':react-native-screens').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-screens/android')
include ':react-native-reanimated'
project(':react-native-reanimated').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-reanimated/android')
include ':react-native-gesture-handler'
project(':react-native-gesture-handler').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-gesture-handler/android')
//==
include ':react-native-vector-icons'
project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android')
//
include ':ReactAndroid'
//
project(':ReactAndroid').projectDir = new File(
        rootProject.projectDir, '../node_modules/react-native/ReactAndroid')
//
includeUnimodulesProjects()
//includeUnimodules([
//        modulesPaths: ['../../node_modules']
//])

rootProject.name = 'NativebaseKitchenSink'

include ':app'

React Native run on multiple simultaneous Android emulators

$
0
0

I would like to test my app on at least 2 Android emulators simultaneously. I can start 2 emulators but can't seem to find how to react-native run-android my app on 2 emulators with ADB. If possible I would also like to be able to run a react-native log-android on each one while testing my app.

Is there a way to do so ?

react-native run-android error "Task :app:javaPreCompileDebug FAILED"

$
0
0

EDIT: This issue was solved by forcing the gradle not to jetify my native library. This is done by adding in gradle.properties

android.jetifier.blacklist = your-causing-issues-library

For more details you can read the official docs or this post



I need to use some native code in a react native project. The native code is provided in a .jar file by the hardware manufacturer. In a clean project (react-native init), with this .jar file inside /android/app/libs folder, this error shows as soon as I try to run "react native run-android".

==============

Error is as follow:

Task :app:javaPreCompileDebug FAILED 6 actionable tasks: 6 executed

FAILURE: Build failed with an exception. What went wrong: Execution failed for task ':app:javaPreCompileDebug'. Could not resolve all files for configuration ':app:debugCompileClasspath'. Failed to transform file 'iMagPayV5.1.4.jar' to match attributes {artifactType=android-classes, org.gradle.usage=java-runtime-jars} Execution failed for JetifyTransform: /home/buonapasta/Desktop/React-Native/samples/project/android/app/libs/iMagPayV5.1.4.jar. Failed to transform '/home/buonapasta/Desktop/React-Native/samples/project/android/app/libs/iMagPayV5.1.4.jar' using Jetifier. Reason: 10. (Run with --stacktrace for more details.)

==============

Help is appreciated in advance!! (Sorry if some information is incomplete).

React Native version 0.60.4 running on Ubuntu 18.04. I've tried to include some other .jar files in a clean project without inconvenience, but as soon as I include this particular .jar everything blows. Also, this library is working on an Android Studio project. The .jar can be found on https://github.com/GPaoloni/imagpay-framework

android/app/build.gradle looks like this:

...

dependencies {
    implementation fileTree(dir: "libs", include: ["*.jar"])
    implementation "com.facebook.react:react-native:+"  // From node_modules

    if (enableHermes) {
      def hermesPath = "../../node_modules/hermesvm/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 use
task copyDownloadableDepsToLibs(type: Copy) {
    from configurations.compile
    into 'libs'
}

android/build.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"
    }
    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 just want being able to include the .jar library (to be used by a native activity).

==============

Update:

I've tried doing like sugested:

npm install --save-dev jetifier
npx jetify

But the error still the same.

Reading the npm page of jetifier, in the "Usage for jar/zip/aar files" section:

npm install jetifier
npx jetifier-standalone <your arguments here>

Runing this gives me the following error:

Exception in thread "main" java.lang.ArrayIndexOutOfBoundsException: 10
    at org.objectweb.asm.ClassReader.readFrameType(ClassReader.java:2313)
    at org.objectweb.asm.ClassReader.readFrame(ClassReader.java:2269)
    at org.objectweb.asm.ClassReader.readCode(ClassReader.java:1448)
    at org.objectweb.asm.ClassReader.readMethod(ClassReader.java:1126)
    at org.objectweb.asm.ClassReader.accept(ClassReader.java:698)
    at org.objectweb.asm.ClassReader.accept(ClassReader.java:500)
    at com.android.tools.build.jetifier.processor.transform.bytecode.ByteCodeTransformer.runTransform(ByteCodeTransformer.kt:39)
    at com.android.tools.build.jetifier.processor.Processor.visit(Processor.kt:443)
    at com.android.tools.build.jetifier.processor.archive.ArchiveFile.accept(ArchiveFile.kt:49)
    at com.android.tools.build.jetifier.processor.Processor.visit(Processor.kt:425)
    at com.android.tools.build.jetifier.processor.archive.Archive.accept(Archive.kt:76)
    at com.android.tools.build.jetifier.processor.Processor.transformLibrary(Processor.kt:421)
    at com.android.tools.build.jetifier.processor.Processor.transform(Processor.kt:247)
    at com.android.tools.build.jetifier.processor.Processor.transform$default(Processor.kt:234)
    at com.android.tools.build.jetifier.standalone.Main.run(Main.kt:157)
    at com.android.tools.build.jetifier.standalone.Main$Companion.main(Main.kt:109)
    at com.android.tools.build.jetifier.standalone.Main.main(Main.kt)

React Native access strings.xml from inside javascript code

$
0
0

Is there a way to access the current values from android/app/src/main/res/values/strings.xml from inside Javascript code? I want to place different endpoint URLs for each build, but I'm failing even to detect the type of build inside react-native code without having to resort to the __DEV__ variable (which can be turned off from the dev menu)

Cant find variable:Buffer in react native android application

How To Send & Receive Data Over Wifi Without Internet In React-Native

$
0
0

I am developing a game on React-Native that works completely offline without needing internet connection,

The game will be multiplayer 1vs1 game, and players will join via Wifi Hotspot (also known as wifi Direct) The game will also allow users to chat with eachother

and this all should be done without internet by just using the wifi..

I have tried "React-Native-Wifi-Hotspot" but there is no documentation about how to send and receive data

I want to send and receive objects/arrays over wifi hotspot between 2 connected devices. P2P

I have also readed about react-native-wifi-p2p library but it's documentation says that we need a local server or something i am really not sure about how to do that.

I have an error in react native null is not an object ''evaluating _ReanimatedModule.default.configureProps'

$
0
0

I installed react native on linux machine.I want to implement createBottomTabNavigator in my practice code.I create 5 folders and index.js inside them. navigate.js :

import {createAppContainer} from 'react-navigation';
import {createBottomTabNavigator} from 'react-navigation-tabs';

import Profile from './common/pages/profile';
import Home from './common/pages/home';
import Search from './common/pages/search';
import Camera from './common/pages/camera';
import Notification from './common/pages/notification';

const Navigate=createBottomTabNavigator({
    Profile:{screen:Profile},
    Home:{screen:Home},
    Camera:{screen:Camera},
    Search:{screen:Search},
    Notification:{screen:Notification}
});
export default createAppContainer(Navigate);

and main index.js:

import {AppRegistry} from 'react-native';
import Navigate from './navigate';
import {name as appName} from './app.json';

AppRegistry.registerComponent(appName, () => Navigate);

now when I run in genymotion i have error:

  • null is not an object ''evaluating _ReanimatedModule.default.configureProps'

my package.json:

{
  "name": "myinstagram",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "react-native start",
    "test": "jest",
    "lint": "eslint ."
  },
  "dependencies": {
    "react": "16.8.6",
    "react-native": "0.60.5",
    "react-native-gesture-handler": "^1.4.1",
    "react-native-reanimated": "^1.2.0",
    "react-navigation": "^4.0.2",
    "react-navigation-tabs": "^2.4.1"
  },
  "devDependencies": {
    "@babel/core": "^7.6.0",
    "@babel/runtime": "^7.6.0",
    "@react-native-community/eslint-config": "^0.0.5",
    "babel-jest": "^24.9.0",
    "eslint": "^6.3.0",
    "jest": "^24.9.0",
    "metro-react-native-babel-preset": "^0.56.0",
    "react-test-renderer": "16.8.6"
  },
  "jest": {
    "preset": "react-native"
  }
}

React-native-final-tree-view : On clicking a particular node,the entire tree closes. How can I resolve this?

$
0
0

I'm developing a react-native app which consists of a tree view for which I have used the React-native-final-tree-view library. On clicking on a node,The entire tree closes and also the children is expanded={true} by default. How can I resolve this?

  handleNodeClick = (node,level) => {
    console.log("onPress called ", node['chapterTitle'] === undefined ? node['sectionTitle'] : node['chapterTitle']);
  }

Passing data through React-Navigation Issue using @merryjs/photo-viewer in react-native

$
0
0

Passing Data Using React-Navigation. Only grid images showing but the image preview throwing android error.

render() {
    const photos = this.props.navigation.getParam('getPhotos').acf.gallery;
    const imageSize = Dimensions.get('window').width / 3;
    const imageStyle = {
      width: imageSize,
      height: imageSize,
    };

    return (
      <View style={styles.container}>
        <PhotoView
          visible={this.state.visible}
          data={photos}
          hideStatusBar={true}
          hideCloseButton={true}
          hideShareButton={true}
          initial={this.state.initial}
          onDismiss={() => {
            this.setState({visible: false});
          }}
          onChange={data => {
            this.setState({initial: data.index});
          }}
        />
        <ScrollView showsVerticalScrollIndicator={false}>
          <View style={styles.photoContainer}>
            {photos.map((cat, index) => (
              <TouchableOpacity
                key={index.id}
                style={[imageStyle, {}]}
                ref={r => (this.r = r)}
                onPress={() =>
                  this.setState({visible: true, initial: index.id})
                }>
                <Image style={imageStyle} source={{uri: cat.url}} />
              </TouchableOpacity>
            ))}
          </View>
        </ScrollView>
      </View>
    );
  }

"react-native": "0.61.5", "@merryjs/photo-viewer": "^3.1.2",

Android Error

Attempt to invoke interface method 'java.lang.string com.facebook.react.bridge.readablemap.getstring on a null object reference

Razor pay not working in react-native version 0.61.5. Android app crash on razorpayCheckout.open. Any solutions?

$
0
0

All parameters are holding proper values, but app crashes without logs RazorpayCheckout.open line.

 let options = {
           description: title,
           image: 'https://cdn.razorpay.com/logos/DjijAUZBHCGlv4_medium.png',
           currency: currency,
           key: orderInfo.key,
           amount: base_price,
           name: 'dfgdfg',
           order_id:orderInfo.order_id,
           prefill: {
             email: user.email,
             contact: user.country_code + user.mobile_number,
             name: user.first_name + '' + user.last_name
           },
            theme: { color: '#F37254' }
   }
     RazorpayCheckout.open(options).then((err,data) => {
         console.log(err,data)
      }).catch((error) => {
         console.log(error)
     });

RNCamera Error:TypeError: CameraManager.checkIfRecordAudioPermissionsAreDefined is not a function

$
0
0

[Unhandled promise rejection: TypeError: CameraManager.checkIfRecordAudioPermissionsAreDefined is not a function. (In 'CameraManager.checkIfRecordAudioPermissionsAreDefined()', 'CameraManager.checkIfRecordAudioPermissionsAreDefined' is undefined)]

return (
  <View>
    <Text>Welcome to React Native QRScanner!</Text>

    <RNCamera
      ref={ref => {
        this.camera = ref;
      }}
      style={{
        flex: 1,
        width: '100%'
      }}
      androidRecordAudioPermissionOptions={{
        title: 'Permission to use audio recording',
        message: 'We need your permission to use your audio',
        buttonPositive: 'Ok',
        buttonNegative: 'Cancel',
      }}
      onBarCodeRead={this.barcodeRecognized}
    >

    </RNCamera>
  </View>
);

Getting "java.lang.UnsatisfiedLinkError: couldn't find DSO to load: libhermes.so" error

$
0
0

I'm in the process of migrating a React Native project from react-native version 0.58.5 to 0.60.4.

For the Android part I've done all the changes mentioned here

I let Hermes disabled in my app build.gradle file:

project.ext.react = [
    entryFile: "index.js",
    enableHermes: false,  // clean and rebuild if changing
]
...
def jscFlavor = 'org.webkit:android-jsc:+'
def enableHermes = project.ext.react.get("enableHermes", false);
...
dependencies {
    ...

    if (enableHermes) {
      println 'Hermes is enabled'
      def hermesPath = "../../node_modules/hermesvm/android/";
      debugImplementation files(hermesPath + "hermes-debug.aar")
      releaseImplementation files(hermesPath + "hermes-release.aar")
    } else {
      println 'Hermes is disabled'
      implementation jscFlavor
    }
}
...

I can see the Hermes is disabled print at build time. And this is exactly what I want.

When launching the Android app with react-native run-android I get the following crash at startup :

FATAL EXCEPTION: create_react_context
                         E  Process: com.reactnativetestapp, PID: 21038
                         E  java.lang.UnsatisfiedLinkError: couldn't find DSO to load: libhermes.so
                         E      at com.facebook.soloader.SoLoader.doLoadLibraryBySoName(SoLoader.java:738)
                         E      at com.facebook.soloader.SoLoader.loadLibraryBySoName(SoLoader.java:591)
                         E      at com.facebook.soloader.SoLoader.loadLibrary(SoLoader.java:529)
                         E      at com.facebook.soloader.SoLoader.loadLibrary(SoLoader.java:484)
                         E      at com.facebook.hermes.reactexecutor.HermesExecutor.<clinit>(HermesExecutor.java:20)
                         E      at com.facebook.hermes.reactexecutor.HermesExecutorFactory.create(HermesExecutorFactory.java:27)
                         E      at com.facebook.react.ReactInstanceManager$5.run(ReactInstanceManager.java:949)
                         E      at java.lang.Thread.run(Thread.java:764)

After some research I could see this crash occurs for people wanting to enable Hermes and that has a wrong gradle configuration : [0.60.3] App crash on startup when enabling Hermes (enableHermes: true)

Why am I getting this crash while Hermes is disabled?

Note that when setting enableHermes to true no crash occurs.

Viewing all 29788 articles
Browse latest View live


Latest Images

<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>