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

React-native-navigation- drawer .... Could not resolve all artifacts for configuration ':react-native-screens:classpath'

$
0
0

I want to add react-navigation-drawer to my project but after adding that module my project doesn't run. I thought it's because of react-navigation-drawer module, but after some tests I recognized it's caused by react-native-reanimated. Then I tried another module and also every solution in internet.

This is the ERROR :What went wrong?:

A problem occurred configuring project ':react-native-screens'. Could not resolve all artifacts for configuration ':react-native-screens:classpath'. Could not find com.android.tools.build:gradle:3.3.1.**

These are my dependencies


Using custom fonts in React native Webview

$
0
0

I'm using custom fonts in my entire React native application. I have linked them using react-native link command. They work everywhere except inside the Webview component of Android. It works properly in iOS Webview.

import React, { Component } from "react"
import { View, StyleSheet, Text, WebView, ScrollView, Image } from "react-native"
import HTMLView from "react-native-htmlview"

export class PostDetailPage extends Component {

  static navigationOptions = {
    title: ({ state }) => state.params.post.title,
    header: {
      style: {
        backgroundColor: '#FF9800',
      },
      titleStyle: {
        color: 'white',
        fontFamily: "Ekatra",
        fontWeight: "normal"
      },
      tintColor: 'white'
    }
  }

  constructor(props) {
    super(props)
  }

  render() {
    const post = this.props.navigation.state.params.post
    const html = `
      <!DOCTYPE html>
      <html>
      <head>
        <style type="text/css">
          body {
            font-family: Lohit-Gujarati;
            font-size: 1.25rem;
            color: black;
            padding: 0px 10px 10px 10px;
          }

          p {
            text-align: justify;
          }
        </style>
      </head>
      <body>
        ${post.content}
      </body>
      </html>
    `
    return (
      <View style={{ flex: 1, overflow: "visible" }}>
        <Image source={{ uri: post.featured_image }} style={{ height: 150 }} />
        <WebView
          source={{html}}
          style={{flex: 1}}
          />
      </View>
    )
  }
}

I have tried creating a font-face inside the webview css with url("file:///android_assets/fonts/Lohit-Gujarati"). It doesn't work. Importing google fonts css works. What is the right way to use local custom fonts in React native Android Webview?

Extra blank space on bottom while using KeyboardAwareScrollView - React-native

$
0
0

I am trying to make a form with multiple input fields using react-native. I want the form submit button to remain at the bottom of the screen. I've used the following structure

<KeyboardAwareScrollView
      contentContainerStyle={{
        backgroundColor: "black",
        flexGrow: 1
      }}
      enableOnAndroid={true}
    >
      <View style={styles.container}>
        <View style={styles.formContainer}>
          {/*Form input components here*/}
        </View>
        <View style={styles.buttonContainer}>
          <Button
            icon={<Icon name="back" size={24} color="white" />}
            onPress={props.setModalVisible}
            buttonStyle={styles.backButton}
          />
          <Button
            buttonStyle={styles.button}
            containerStyle={{ flex: 1 }}
            title="Update Info"
            onPress={props.setModalVisible}
          />
        </View>
      </View>
    </KeyboardAwareScrollView>

The container has style

  container: {
    padding: 10,
    backgroundColor: "green",
    flex: 1
  },

The form container has style

  formContainer: {
    padding: 15,
    flex: 1,
    backgroundColor: "blue"
  },

Button container has style

  buttonContainer: {
    padding: 15,
    flexDirection: "row",
    backgroundColor: "yellow",
    marginTop: 'auto'
  },

Using the above code the button sticks to the bottom when there is no keyboard as I expected. I've added background color for easy visualization. Image - Form View

But when I click on a text field and scroll up I see that the container "shrinks" and the bottom of the screen is black and button is now close to input fields. Background color of KeyboardAwareScrollView contentContainerStyle fills the bottom when I [fully scroll to bottom][3]

How do I make sure that the button still sticks to the bottom in scrollview and the content container height remains the same as screen height?

I am using "react-native-keyboard-aware-scroll-view": "0.8.0",

I've tried removing marginTop: 'auto' from the buttonContainer, fixing the height of the container and all sorts of combinations with flexGrow and flex on KeyboardAwareScrollView.

How can i fix error when using expo-start

$
0
0

I have error when i try type command 'npx expo-start'. Previously it's working properly before i try to

  1. install react-native-progress
  2. make splash screen with this tutorial https://www.youtube.com/watch?v=05V_uB7RZXo

Error result

    Error: EPERM: operation not permitted, mkdir 'C:\Users\Ray'
    TypeError: Cannot read property 'get' of undefined
        at errorMessage (C:\Program Files\nodejs\node_modules\npm\lib\utils\error-message.js:38:39)
        at errorHandler (C:\Program Files\nodejs\node_modules\npm\lib\utils\error-handler.js:201:13)
        at C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js:78:20
        at cb (C:\Program Files\nodejs\node_modules\npm\lib\npm.js:225:22)
        at C:\Program Files\nodejs\node_modules\npm\lib\npm.js:263:24
        at C:\Program Files\nodejs\node_modules\npm\lib\config\core.js:81:7
        at Array.forEach (<anonymous>)
        at C:\Program Files\nodejs\node_modules\npm\lib\config\core.js:80:13
        at f (C:\Program Files\nodejs\node_modules\npm\node_modules\once\once.js:25:25)
        at afterExtras (C:\Program Files\nodejs\node_modules\npm\lib\config\core.js:171:20)
    C:\Program Files\nodejs\node_modules\npm\lib\utils\error-handler.js:97
      var doExit = npm.config.loaded ? npm.config.get('_exit') : true
                              ^

    TypeError: Cannot read property 'loaded' of undefined
        at exit (C:\Program Files\nodejs\node_modules\npm\lib\utils\error-handler.js:97:27)
        at process.errorHandler (C:\Program Files\nodejs\node_modules\npm\lib\utils\error-handler.js:216:3)
        at process.emit (events.js:305:20)
        at process._fatalException (internal/process/execution.js:164:25)
    Install for [ 'expo-start@latest' ] failed with code 7

Please help me, how can i do to fix this problem

ReactNative Video Calling and Voice Calling [closed]

$
0
0

Is there any other open source plugin for voice and video calling other than webrtc-react-native? I tried this one https://github.com/oney/react-native-webrtc but it require a signalling server and not restricted to peer to peer connection on public server.

react native does not show imported tag

$
0
0

Why <QRScanner/> doesn't show on my device? If I run the project only with the scanner, then everything works, but as soon as I transfer it to another file it breaks

enter image description here

App.js

    import React, { Component } from 'react';
    import { StyleSheet, View } from 'react-native';
    import { QRScanner } from './src/Scanner';
    import { Navbar } from './src/Navbar'

    const instructions = Platform.select({
      ios: 'Press Cmd+R to reload,\n' + 'Cmd+D or shake for     dev menu',
      android: 'Double tap R on your keyboard to reload,\n' +     'Shake or press menu button for dev menu',
    });

    export default class App extends Component {
      render() {
    return (
      <View>
        <Navbar title='QR Scanner'/>
        <View style={styles.view}>
          <QRScanner/>
        </View>
      </View>
    )
      }
     }

    const styles = StyleSheet.create({
    view: {
      flex: 1,
      flexDirection: 'column',
      justifyContent: 'flex-end',
  },
})

Scanner

    import React, { useState, useEffect } from 'react';
    import { Text, View, StyleSheet, Button } from 'react-native';
    import { BarCodeScanner } from 'expo-barcode-scanner';


    export const QRScanner = (props) => {
        const [hasPermission, setHasPermission] = useState(null);
        const [scanned, setScanned] = useState(false);

        useEffect(() => {
            (async () => {
                const { status } = await BarCodeScanner.requestPermissionsAsync();
                setHasPermission(status === 'granted');
            })();
        }, []);

        const handleBarCodeScanned = ({ type, data }) => {
            setScanned(true);
            alert(`${type} ${data}`);
        };

        const putOnServer = ({ type, data }) => {
            console.log('1')
        };

        if (hasPermission === null) {
            return <Text>Requesting for camera permission</Text>;
        }
        if (hasPermission === false) {
            return <Text>No access to camera</Text>;
        }

        return(
            <View>
                <BarCodeScanner
                    onBarCodeScanned={scanned ? undefined : handleBarCodeScanned}
                    style={StyleSheet.absoluteFillObject}
                />

                {scanned && (
                    <Button title={'Tap to Scan Again'} onPress={ pressHandler } />
                )}
            </View>
        )
    }

Execution failed for task ':app:processDebugGoogleServices'. Failed to delete: \google-services\debug

$
0
0

I am keep getting below error:

Execution failed for task ':app:processDebugGoogleServices'. > Failed to delete: D:\Program\ReactNative\MobileSC_New\android\app\build\generated\res\google-services\debug this is my app level gradle file

apply plugin: "com.android.application"
apply plugin: "io.fabric"

// Need to set this when we have variant setup
//project.ext.envConfigFiles = [
//        debug: ".env.dev",
//        release: ".env",
//        staging: ".env",
//]

apply from: project(':react-native-config').projectDir.getPath() + "/dotenv.gradle"

import com.android.build.OutputFile

project.ext.react = [
    entryFile: "index.js",
    enableHermes: false,  // clean and rebuild if changing
]

apply from: "../../node_modules/react-native/react.gradle"
def enableSeparateBuildPerCPUArchitecture = false
def enableProguardInReleaseBuilds = false
def jscFlavor = 'org.webkit:android-jsc:+'
def enableHermes = project.ext.react.get("enableHermes", false);

android {
    compileSdkVersion rootProject.ext.compileSdkVersion

    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }

    defaultConfig {
        applicationId "com.mobilesc"
        minSdkVersion rootProject.ext.minSdkVersion
        targetSdkVersion rootProject.ext.targetSdkVersion
        versionCode project.env.get("APP_VERSION_CODE").toInteger()
        versionName project.env.get("APP_VERSION_NUMBER")

        multiDexEnabled true

//        manifestPlaceholders = [
//                FABRIC_API_KEY:project.env.get("FABRIC_API_KEY"),
//                GOOGLE_MAPS_ANDROID_API_KEY:project.env.get("GOOGLE_MAPS_ANDROID_API_KEY")
//        ]
        resValue "string", "build_config_package", "com.mobilesc"

    }
    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
            manifestPlaceholders = [enableCrashReporting:"false"]
        }
        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"
            manifestPlaceholders = [enableCrashReporting:"true"]
        }
    }
    // 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
            }

        }
    }

    packagingOptions {
        pickFirst 'lib/x86/libc++_shared.so'
        pickFirst 'lib/x86_64/libjsc.so'
        pickFirst 'lib/arm64-v8a/libjsc.so'
        pickFirst 'lib/arm64-v8a/libc++_shared.so'
        pickFirst 'lib/x86_64/libc++_shared.so'
        pickFirst 'lib/armeabi-v7a/libc++_shared.so'
    }
}

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

    if (enableHermes) {
        def hermesPath = "../../node_modules/hermes-engine/android/";
        debugImplementation files(hermesPath + "hermes-debug.aar")
        releaseImplementation files(hermesPath + "hermes-release.aar")
    } else {
        implementation jscFlavor
    }


    implementation "com.google.firebase:firebase-messaging:18.0.0"
    implementation 'com.google.firebase:firebase-analytics:17.2.1'
    implementation 'me.leolin:ShortcutBadger:1.1.21@aar' // <-- Add this line if you wish to use badge on Android
    implementation('com.crashlytics.sdk.android:crashlytics:2.9.9@aar') {
        transitive = true
    }
}

apply plugin: 'com.google.gms.google-services'

// CRASH ISSUE: https://github.com/invertase/react-native-firebase/issues/2411
// WORKAROUND for com.google.gms:google-services:4.2.0: https://github.com/invertase/react-native-firebase/issues/1676#issuecomment-441243419
//googleServices.disableVersionCheck = true
com.google.gms.googleservices.GoogleServicesPlugin.config.disableVersionCheck = true
task copyDownloadableDepsToLibs(type: Copy) {
    from configurations.compile
    into 'libs'
}

apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)

this is my project level gradle file

// Top-level build file where you can add configuration options common to all sub-projects/modules.

buildscript {
    ext {
        buildToolsVersion = "28.0.3"
        minSdkVersion = 21
        compileSdkVersion = 28
        targetSdkVersion = 28
        supportLibVersion = "28.0.0"
    }
    repositories {
        google()
        jcenter()
        mavenCentral()
        maven { url "https://maven.google.com" }
        maven { url "https://jitpack.io" }
        maven { url 'https://maven.fabric.io/public' }
    }
    dependencies {
        classpath 'com.android.tools.build:gradle:3.4.2'
        classpath 'com.google.gms:google-services:4.2.0'
        classpath 'io.fabric.tools:gradle:1.28.1'
        // NOTE: Do not place your application dependencies here; they belong
        // in the individual module build.gradle files
    }
}

allprojects {
    repositories {
        mavenLocal()
        google()
        jcenter()
        mavenCentral()
        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/'
//            name 'Google'
//        }
        maven { url 'https://jitpack.io' }
    }

//    subprojects {
//        afterEvaluate {project ->
//            if (project.hasProperty("android")) {
//                android {
//                    compileSdkVersion rootProject.ext.compileSdkVersion
//                    buildToolsVersion rootProject.ext.buildToolsVersion
//                }
//            }
//        }
//    }
}

i've try to follow this topic but none of them work Gradle Error:Execution failed for task ':app:processDebugGoogleServices'

React Native how to design this button?

$
0
0

I need help in designing this button in react-native. Please help me?

Button]


How to solve the error, Failed to launch emulator. Reason: No emulators found as an output of `emulator -list-avds` in React native?

$
0
0

I am creating react native app for mobile application. I am fully new in building react native app. I am using ubuntu for creating the app and following below link to create the app. https://facebook.github.io/react-native/docs/getting-started . Can anyone please solve the issue ?

At below stage I am getting error:

cd AwesomeProject
npx react-native run-android

Error in my command line:

All-Series:~/Projects_App/AwesomeProject$ npx react-native run-android
info Running jetifier to migrate libraries to AndroidX. You can disable it using "--no-jetifier" flag.
Jetifier found 864 file(s) to forward-jetify. Using 4 workers...
info Starting JS server...
/bin/sh: 1: adb: not found
info Launching emulator...
error Failed to launch emulator. Reason: No emulators found as an output of `emulator -list-avds`.
warn Please launch an emulator manually or connect a device. Otherwise app may fail to launch.
info Installing the app...
> Task :app:compileDebugJavaWithJavac FAILED

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.5/userguide/command_line_interface.html#sec:command_line_warnings
13 actionable tasks: 4 executed, 9 up-to-date

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':app:compileDebugJavaWithJavac'.
> Could not find tools.jar. Please check that /usr/lib/jvm/java-8-openjdk-amd64 contains a valid JDK installation.

* 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

BUILD FAILED in 5s

error 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 app:installDebug -PreactNativeDevServerPort=8081

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':app:compileDebugJavaWithJavac'.
> Could not find tools.jar. Please check that /usr/lib/jvm/java-8-openjdk-amd64 contains a valid JDK installation.

* 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

BUILD FAILED in 5s

    at checkExecSyncError (child_process.js:621:11)
    at execFileSync (child_process.js:639:15)
    at runOnAllDevices (/home/rupeevest/Projects_App/AwesomeProject/node_modules/@react-native-community/cli-platform-android/build/commands/runAndroid/runOnAllDevices.js:94:39)
    at processTicksAndRejections (internal/process/task_queues.js:93:5)

React Native App in google Playstore always give same size of update, every-time I Release new Updates (android only)

$
0
0

i have a application which is completely made with RN and it is released in google play store.

i am creating release with ./gradlew bundleRelease command which will create a bundle unlike apk, also recommended by RN

ref. https://facebook.github.io/react-native/docs/signed-apk-android#generating-the-release-apk

now i am confuse that everytime i upload a new update i have to download a complete apk even if the update is so small

Note: I m not trying to reduce the app size here this is just to inform

please help me in this. i have used proGard also in the android part to minimise the app size

How to solve "libmain.so not found" while using Unity as a library in Android application with latest AndroidX Versions out of ReactNative

$
0
0

We have a ReactNative application that has integrated Unity based on react-native-unity-view successfully as a library for quite a long time. However, after most recent updates on ReactNative regarding AndroidX and latest SDK-changes, we're running into the issue "libmain.so not found". This exception happens on the very first attempt to display a Unity-View.

There is a similar issue on SO, please don't mark as duplicate as our approach might be different and particulary since we give many many more details here.

There is a running and still working example on GitHub (based on ReactNative 0.57): https://github.com/f111fei/react-native-unity-demo. As long as this project is based on ReactNative 0.57 and its appropriate gradle-settings, everything works fine. But as soon as we upgrade to the latest ReactNative version (and even 0.60 for example), which gives us an android-folder that is very different against to the older one), the issue happens with a crash of the application. (We also tried to set up everything from scratch to exclude the possibility that this issue was due to upgrades. With RN 0.57 everything still works fine, with RN 0.60 and above not)

The exception is as follows:

E Unity   : Failed to load 'libmain.so', the application will terminate.
D AndroidRuntime: Shutting down VM
E AndroidRuntime: FATAL EXCEPTION: main
E AndroidRuntime: Process: com.rnunitydemo, PID: 16887
E AndroidRuntime: java.lang.UnsatisfiedLinkError: dalvik.system.PathClassLoader[DexPathList[[zip file "/data/app/com.rnunitydemo-bKGyotdcwjVnBxuR9zLE4Q==/base.apk"],nativeLibraryDirectories=[/data/app/com.rnunitydemo-bKGyotdcwjVnBxuR9zLE4Q==/lib/arm64, /data/app/com.rnunitydemo-bKGyotdcwjVnBxuR9zLE4Q==/base.apk!/lib/arm64-v8a, /system/lib64, /product/lib64]]] couldn't find "libmain.so"

First I'm going to list the android-folder and gradle-files from most recent version, where the crash happens. After that, I will list the files where everything works fine:

Not working (newer) Version

./android/build.gradle:

buildscript {
    ext {
        buildToolsVersion = "28.0.3"
        minSdkVersion = 16
        compileSdkVersion = 28
        targetSdkVersion = 28
    }
    repositories {
        google()
        jcenter()
    }
    dependencies {
        classpath("com.android.tools.build:gradle:3.4.2")
    }
}

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()
        maven { url 'https://jitpack.io' }
    }
}

./android/settings.gradle:

rootProject.name = 'rnunitydemo'

apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)

include ":UnityExport"
project(":UnityExport").projectDir = file("./UnityExport")


include ':app'

./android/app/build.gradle:

apply plugin: "com.android.application"

import com.android.build.OutputFile

project.ext.react = [
    entryFile: "index.js",
    enableHermes: false,  // clean and rebuild if changing
]

apply from: "../../node_modules/react-native/react.gradle"

def enableSeparateBuildPerCPUArchitecture = false

def enableProguardInReleaseBuilds = false

def jscFlavor = 'org.webkit:android-jsc:+'

def enableHermes = project.ext.react.get("enableHermes", false);

android {
    compileSdkVersion rootProject.ext.compileSdkVersion

    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }

    defaultConfig {
        applicationId "com.rnunitydemo"
        minSdkVersion rootProject.ext.minSdkVersion
        targetSdkVersion rootProject.ext.targetSdkVersion
        versionCode 1
        versionName "1.0"
    }
    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'
        }
    }
    buildTypes {
        debug {
            signingConfig signingConfigs.debug
        }
        release {
            signingConfig signingConfigs.debug
            minifyEnabled enableProguardInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
        }
    }
    // 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

    if (enableHermes) {
        def hermesPath = "../../node_modules/hermes-engine/android/";
        debugImplementation files(hermesPath + "hermes-debug.aar")
        releaseImplementation files(hermesPath + "hermes-release.aar")
    } else {
        implementation jscFlavor
    }
}

task copyDownloadableDepsToLibs(type: Copy) {
    from configurations.compile
    into 'libs'
}

apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)

./android/UnityExport/build.gradle:

// GENERATED BY UNITY. REMOVE THIS COMMENT TO PREVENT OVERWRITING WHEN EXPORTING AGAIN

buildscript {
    repositories {
        google()
        jcenter()
    }

    dependencies {
        classpath("com.android.tools.build:gradle:3.4.2")
    }
}

allprojects {
    repositories {
        google()
        jcenter()
        flatDir {
            dirs 'libs'
        }
    }
}

apply plugin: 'com.android.library'


dependencies {
    api fileTree(include: ['*.jar'], dir: 'libs')
}

android {
    compileSdkVersion 28
    buildToolsVersion '28.0.2'

    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }

    defaultConfig {
        minSdkVersion 16
        targetSdkVersion 28
        ndk {
            abiFilters 'armeabi-v7a', 'x86'
        }
        multiDexEnabled true
        versionCode 1
        versionName '0.1'
    }

    lintOptions {
        abortOnError false
    }

    aaptOptions {
        noCompress = ['.unity3d', '.ress', '.resource', '.obb']
        ignoreAssetsPattern = "!.svn:!.git:!.ds_store:!*.scc:.*:!CVS:!thumbs.db:!picasa.ini:!*~"
    }

    buildTypes {
        debug {
            minifyEnabled false
            useProguard false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-unity.txt'
            signingConfig signingConfigs.debug
            jniDebuggable true
        }
        release {
            minifyEnabled false
            useProguard false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-unity.txt'
            signingConfig signingConfigs.debug
        }
    }

    packagingOptions {
        doNotStrip '*/armeabi-v7a/*.so'
        doNotStrip '*/x86/*.so'
    }


}

All these files above lead to a crash ("libmain.so not found") as soon as Unity will be launched.

Working (older) Version

In our previous version, as it can be found on GitHub, everything went fine:

./android/build.gradle:

buildscript {
    ext {
        buildToolsVersion = "27.0.3"
        minSdkVersion = 16
        compileSdkVersion = 27
        targetSdkVersion = 26
        supportLibVersion = "27.1.1"
    }
    repositories {
        jcenter()
        google()
    }
    dependencies {
        classpath 'com.android.tools.build:gradle:3.1.4'
    }
}

allprojects {
    repositories {
        mavenLocal()
        jcenter()
        google()
        maven {
            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
            url "$rootDir/../node_modules/react-native/android"
        }
        flatDir {
            dirs project(':UnityExport').file('libs')
        }
    }
}

task wrapper(type: Wrapper) {
    gradleVersion = '4.4'
    distributionUrl = distributionUrl.replace("bin", "all")
}

./android/settings.gradle:

rootProject.name = 'rnunitydemo'
include ':react-native-unity-view'
project(':react-native-unity-view').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-unity-view/android')

include ":UnityExport"
project(":UnityExport").projectDir = file("./UnityExport")

include ':app'

./android/app/build.gradle:

apply plugin: "com.android.application"

import com.android.build.OutputFile

project.ext.react = [
    entryFile: "index.js"
]

apply from: "../../node_modules/react-native/react.gradle"

def enableSeparateBuildPerCPUArchitecture = false

/**
 * Run Proguard to shrink the Java bytecode in release builds.
 */
def enableProguardInReleaseBuilds = false

android {
    compileSdkVersion rootProject.ext.compileSdkVersion
    buildToolsVersion rootProject.ext.buildToolsVersion

    defaultConfig {
        applicationId "com.rnunitydemo"
        minSdkVersion rootProject.ext.minSdkVersion
        targetSdkVersion rootProject.ext.targetSdkVersion
        versionCode 1
        versionName "1.0"
        ndk {
            abiFilters "armeabi-v7a", "x86"
        }
    }

    lintOptions {
        checkReleaseBuilds false
        // Or, if you prefer, you can continue to check for errors in release builds,
        // but continue the build even when errors are found:
        abortOnError false
    }

    splits {
        abi {
            reset()
            enable enableSeparateBuildPerCPUArchitecture
            universalApk false  // If true, also generate a universal APK
            include "armeabi-v7a", "x86"
        }
    }

    signingConfigs {
        release {
            // storeFile file(MYAPP_RELEASE_STORE_FILE)
            // storePassword MYAPP_RELEASE_STORE_PASSWORD
            // keyAlias MYAPP_RELEASE_KEY_ALIAS
            // keyPassword MYAPP_RELEASE_KEY_PASSWORD
        }
    }

    buildTypes {
        debug {
            manifestPlaceholders = [
                "DEBUGGABLE": "true"
            ]
        }
        release {
            manifestPlaceholders = [
                "DEBUGGABLE": "false"
            ]
            minifyEnabled enableProguardInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
            signingConfig signingConfigs.release
        }
    }
    // 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:
            // http://tools.android.com/tech-docs/new-build-system/user-guide/apk-splits
            def versionCodes = ["armeabi-v7a":1, "x86":2]
            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 {
    compile project(':react-native-unity-view')
    implementation fileTree(dir: "libs", include: ["*.jar"])
    implementation "com.android.support:appcompat-v7:${rootProject.ext.supportLibVersion}"
    implementation "com.facebook.react:react-native:+"  // From node_modules
}

// 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/UnityExport/build.gradle:

(same as above)

There are some other reports according to this issue in the official Unity2D-Forums, but without any working solution. According to a comment we are aware of using the very same abiFilter-Setting in both build.gradle-Files (this from our app and the build-gradle from UnityExport), but it didn't solve the issue either.

Can someone help please?

** Update **

System information of development machine:

System:
    OS: macOS Mojave 10.14.6
    CPU: (16) x64 Intel(R) Core(TM) i9-9980HK CPU @ 2.40GHz
    Memory: 112.35 MB / 32.00 GB
    Shell: 5.0.11 - /usr/local/bin/bash

  SDKs:
    iOS SDK:
      Platforms: iOS 13.2, DriverKit 19.0, macOS 10.15, tvOS 13.2, watchOS 6.1
    Android SDK:
      API Levels: 23, 25, 26, 27, 28, 29
      Build Tools: 23.0.1, 25.0.0, 25.0.1, 25.0.2, 26.0.1, 27.0.3, 28.0.3, 29.0.0, 29.0.2
      System Images: android-29 | Google APIs Intel x86 Atom
      Android NDK: 20.0.5594570
  IDEs:
    Android Studio: 3.5 AI-191.8026.42.35.5900203
    Xcode: 11.2.1/11B500 - /usr/bin/xcodebuild
  Binaries:
    Node: 10.17.0 - /usr/local/opt/node@10/bin/node
    Yarn: 1.16.0 - /usr/local/bin/yarn
    npm: 6.11.3 - /usr/local/opt/node@10/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  npmPackages:
    react: 16.9.0 => 16.9.0
    react-native: 0.61.4 => 0.61.4
  npmGlobalPackages:
    react-native-cli: 2.0.1

React Native 0.57.1 Android Duplicate Resources

$
0
0

When running ./android/gradlew assembleRelease I get the following error:

``` * What went wrong: Execution failed for task ':app:mergeReleaseResources'.

[drawable-xhdpi-v4/node_modules_reactnavigation_src_views_assets_backicon] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-xhdpi/node_modules_reactnavigation_src_views_assets_backicon.png [drawable-xhdpi-v4/node_modules_reactnavigation_src_views_assets_backicon] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-xhdpi/node_modules_reactnavigation_src_views_assets_backicon.png: Error: Duplicate resources [drawable-xxhdpi-v4/node_modules_reactnavigation_src_views_assets_backicon] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-xxhdpi/node_modules_reactnavigation_src_views_assets_backicon.png [drawable-xxhdpi-v4/node_modules_reactnavigation_src_views_assets_backicon] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-xxhdpi/node_modules_reactnavigation_src_views_assets_backicon.png: Error: Duplicate resources [drawable-hdpi-v4/node_modules_reactnavigation_src_views_assets_backicon] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-hdpi/node_modules_reactnavigation_src_views_assets_backicon.png [drawable-hdpi-v4/node_modules_reactnavigation_src_views_assets_backicon] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-hdpi/node_modules_reactnavigation_src_views_assets_backicon.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_marilyn_monroe_trophies_cookoo30x] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_marilyn_monroe_trophies_cookoo30x.png [drawable-mdpi-v4/app_assets_images_characters_marilyn_monroe_trophies_cookoo30x] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_marilyn_monroe_trophies_cookoo30x.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_cleopatra_emotions_blinking_5] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_cleopatra_emotions_blinking_5.png [drawable-mdpi-v4/app_assets_images_characters_cleopatra_emotions_blinking_5] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_cleopatra_emotions_blinking_5.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_coins_5] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_coins_5.png [drawable-mdpi-v4/app_assets_images_coins_5] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_coins_5.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_marilyn_monroe_emotions_blinking_2] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_marilyn_monroe_emotions_blinking_2.png [drawable-mdpi-v4/app_assets_images_characters_marilyn_monroe_emotions_blinking_2] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_marilyn_monroe_emotions_blinking_2.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_leonardo_da_vinci_emotions_angry_4] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_leonardo_da_vinci_emotions_angry_4.png [drawable-mdpi-v4/app_assets_images_characters_leonardo_da_vinci_emotions_angry_4] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_leonardo_da_vinci_emotions_angry_4.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_leonardo_da_vinci_emotions_happy_2] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_leonardo_da_vinci_emotions_happy_2.png [drawable-mdpi-v4/app_assets_images_characters_leonardo_da_vinci_emotions_happy_2] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_leonardo_da_vinci_emotions_happy_2.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_unlockablecharacters] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_unlockablecharacters.png [drawable-mdpi-v4/app_assets_images_unlockablecharacters] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_unlockablecharacters.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_cleopatra_emotions_happy_6] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_cleopatra_emotions_happy_6.png [drawable-mdpi-v4/app_assets_images_characters_cleopatra_emotions_happy_6] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_cleopatra_emotions_happy_6.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_marilyn_monroe_trophies_cookoo3x] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_marilyn_monroe_trophies_cookoo3x.png [drawable-mdpi-v4/app_assets_images_characters_marilyn_monroe_trophies_cookoo3x] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_marilyn_monroe_trophies_cookoo3x.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_leonardo_da_vinci_emotions_happy_3] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_leonardo_da_vinci_emotions_happy_3.png [drawable-mdpi-v4/app_assets_images_characters_leonardo_da_vinci_emotions_happy_3] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_leonardo_da_vinci_emotions_happy_3.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_leonardo_da_vinci_emotions_angry_5] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_leonardo_da_vinci_emotions_angry_5.png [drawable-mdpi-v4/app_assets_images_characters_leonardo_da_vinci_emotions_angry_5] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_leonardo_da_vinci_emotions_angry_5.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_marilyn_monroe_emotions_blinking_3] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_marilyn_monroe_emotions_blinking_3.png [drawable-mdpi-v4/app_assets_images_characters_marilyn_monroe_emotions_blinking_3] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_marilyn_monroe_emotions_blinking_3.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_coinsmodal_mostpopularlabel] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_coinsmodal_mostpopularlabel.png [drawable-mdpi-v4/app_assets_images_coinsmodal_mostpopularlabel] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_coinsmodal_mostpopularlabel.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_cleopatra_emotions_blinking_4] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_cleopatra_emotions_blinking_4.png [drawable-mdpi-v4/app_assets_images_characters_cleopatra_emotions_blinking_4] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_cleopatra_emotions_blinking_4.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_coins_4] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_coins_4.png [drawable-mdpi-v4/app_assets_images_coins_4] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_coins_4.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_napoleon_trophies_cookoo30x] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_napoleon_trophies_cookoo30x.png [drawable-mdpi-v4/app_assets_images_characters_napoleon_trophies_cookoo30x] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_napoleon_trophies_cookoo30x.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_earthbg] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_earthbg.png [drawable-mdpi-v4/app_assets_images_earthbg] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_earthbg.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_einee_emotions_happy_6] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_einee_emotions_happy_6.png [drawable-mdpi-v4/app_assets_images_characters_einee_emotions_happy_6] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_einee_emotions_happy_6.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_einee_trophies_angry10x] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_einee_trophies_angry10x.png [drawable-mdpi-v4/app_assets_images_characters_einee_trophies_angry10x] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_einee_trophies_angry10x.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_leonardo_da_vinci_trophies_3conversations] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_leonardo_da_vinci_trophies_3conversations.png [drawable-mdpi-v4/app_assets_images_characters_leonardo_da_vinci_trophies_3conversations] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_leonardo_da_vinci_trophies_3conversations.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_napoleon_trophies_cookoo10x] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_napoleon_trophies_cookoo10x.png [drawable-mdpi-v4/app_assets_images_characters_napoleon_trophies_cookoo10x] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_napoleon_trophies_cookoo10x.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_einee_emotions_angry_2] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_einee_emotions_angry_2.png [drawable-mdpi-v4/app_assets_images_characters_einee_emotions_angry_2] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_einee_emotions_angry_2.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_napoleon_profile] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_napoleon_profile.png [drawable-mdpi-v4/app_assets_images_characters_napoleon_profile] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_napoleon_profile.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_einee_emotions_happy_4] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_einee_emotions_happy_4.png [drawable-mdpi-v4/app_assets_images_characters_einee_emotions_happy_4] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_einee_emotions_happy_4.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_einee_trophies_angry30x] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_einee_trophies_angry30x.png [drawable-mdpi-v4/app_assets_images_characters_einee_trophies_angry30x] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_einee_trophies_angry30x.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_coins_6] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_coins_6.png [drawable-mdpi-v4/app_assets_images_coins_6] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_coins_6.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_cleopatra_emotions_blinking_6] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_cleopatra_emotions_blinking_6.png [drawable-mdpi-v4/app_assets_images_characters_cleopatra_emotions_blinking_6] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_cleopatra_emotions_blinking_6.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_einee_bg] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_einee_bg.jpg [drawable-mdpi-v4/app_assets_images_characters_einee_bg] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_einee_bg.jpg: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_cleopatra_emotions_cookoo_2] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_cleopatra_emotions_cookoo_2.png [drawable-mdpi-v4/app_assets_images_characters_cleopatra_emotions_cookoo_2] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_cleopatra_emotions_cookoo_2.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_leonardo_da_vinci_emotions_blinking_3] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_leonardo_da_vinci_emotions_blinking_3.png [drawable-mdpi-v4/app_assets_images_characters_leonardo_da_vinci_emotions_blinking_3] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_leonardo_da_vinci_emotions_blinking_3.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_cleopatra_emotions_happy_4] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_cleopatra_emotions_happy_4.png [drawable-mdpi-v4/app_assets_images_characters_cleopatra_emotions_happy_4] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_cleopatra_emotions_happy_4.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_cleopatra_emotions_angry_2] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_cleopatra_emotions_angry_2.png [drawable-mdpi-v4/app_assets_images_characters_cleopatra_emotions_angry_2] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_cleopatra_emotions_angry_2.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_leonardo_da_vinci_trophies_allconversations1x] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_leonardo_da_vinci_trophies_allconversations1x.png [drawable-mdpi-v4/app_assets_images_characters_leonardo_da_vinci_trophies_allconversations1x] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_leonardo_da_vinci_trophies_allconversations1x.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_coinsmodal_coins500] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_coinsmodal_coins500.png [drawable-mdpi-v4/app_assets_images_coinsmodal_coins500] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_coinsmodal_coins500.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_cleopatra_emotions_angry_3] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_cleopatra_emotions_angry_3.png [drawable-mdpi-v4/app_assets_images_characters_cleopatra_emotions_angry_3] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_cleopatra_emotions_angry_3.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_cleopatra_emotions_happy_5] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_cleopatra_emotions_happy_5.png [drawable-mdpi-v4/app_assets_images_characters_cleopatra_emotions_happy_5] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_cleopatra_emotions_happy_5.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_leonardo_da_vinci_emotions_blinking_2] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_leonardo_da_vinci_emotions_blinking_2.png [drawable-mdpi-v4/app_assets_images_characters_leonardo_da_vinci_emotions_blinking_2] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_leonardo_da_vinci_emotions_blinking_2.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_cleopatra_emotions_cookoo_3] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_cleopatra_emotions_cookoo_3.png [drawable-mdpi-v4/app_assets_images_characters_cleopatra_emotions_cookoo_3] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_cleopatra_emotions_cookoo_3.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_einee_trophies_angry100x] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_einee_trophies_angry100x.png [drawable-mdpi-v4/app_assets_images_characters_einee_trophies_angry100x] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_einee_trophies_angry100x.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_donald_trump_bg] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_donald_trump_bg.jpg [drawable-mdpi-v4/app_assets_images_characters_donald_trump_bg] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_donald_trump_bg.jpg: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_cleopatra_trophies_allconversations3x] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_cleopatra_trophies_allconversations3x.png [drawable-mdpi-v4/app_assets_images_characters_cleopatra_trophies_allconversations3x] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_cleopatra_trophies_allconversations3x.png: Error: Duplicate resources [drawable-mdpi-v4/app_assets_images_characters_leonardo_da_vinci_emotions_angry_6] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/src/main/res/drawable-mdpi/app_assets_images_characters_leonardo_da_vinci_emotions_angry_6.png [drawable-mdpi-v4/app_assets_images_characters_leonardo_da_vinci_emotions_angry_6] /Users/Ilyakar/Documents/Business/Development/My_Projects/new/Einee/App/android/app/build/generated/res/react/release/drawable-mdpi/app_assets_images_characters_leonardo_da_vinci_emotions_angry_6.png: Error: Duplicate resources ```

I already tried the following from the answers I found on React Native Duplicate resources with zero success:

Attempt #1:

"Deleting the drawables with rm -rf android/app/src/main/res/drawable-* and generating APK on Android Studio worked for me."

Attempt #2:

"rm -rf android/app/src/main/res/drawable-*

react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res/

And compile android again react-native run-android"


Any other ideas?

React-native Consistent way to make a animated view to get full height

$
0
0

I have created a Bottomsheet Component that mimicates the google maps BootmSheet. Th component has 3 different view states: CLOSED, SUMMARY, DETAILS. I have used Animated.View with position:absolute and an animated value which controls bottom style rule. SUMMARY and DETAILS have different animated values because I want to show the effect that one is opening and the other is opening. So my render and the constructor is something like that

constructor(props) {
        super(props)
        this.state = {
            animatedPosition: new Animated.Value(-(DEVICE.height)),
            animatedPositionFull: new Animated.Value(-(DEVICE.height)),
        }
    }

render() {
        <>
           <Animated.View style={{
                position: 'absolute',
                height: CONTENT_HEIGHT,
                bottom: animatedPosition
            }}>
                {contentSummaryBottomsheet}
            </Animated.View >
            <Animated.View style={{
                position: 'absolute',
                height: FULL_CONTENT_HEIGHT,
                bottom: animatedPositionFull
            }}>
                {contentDetailsBottomShet}
            </Animated.View >
        </>
    }

When the state is NONE nothing is rendered. When the state is SUMMARY the above animated view is rendered with height about half of screen When the state is DETAILS I want the component to take the whole screen. In componentDidUpdate I check what animation to do

componentDidUpdate(prevProps) {
        //9 scenarios
        /*
        A: closed-> closed |  full -> full | summary -> summary
        B: closed-> full | closed -> summary
        C: half -> closed | full -> closed
        D: half -> full | full -> half
        */
        console.log("Did Update")
        //if the state changed
        if (prevProps.displayState != this.props.displayState) {
            //if now the state is closed and before it was anything but closed, close it regardless of what that state was
            if (prevProps.displayState !== BottomSheetStates.CLOSED && this.props.displayState === BottomSheetStates.CLOSED) {
                //Scenario C:
                this.animateCloseSummary()
                this.animateCloseFull()
            } else {
                //and if it was closed before
                if (prevProps.displayState === BottomSheetStates.CLOSED) {
                    //Scenario B:
                    //and now we go to summary show summary
                    if (this.props.displayState === BottomSheetStates.OPEN_SUMMARY) {
                        this.animateOpenSummary();
                    }
                    //and now we go to full show full
                    if (this.props.displayState === BottomSheetStates.OPEN_DETAILS) {
                        this.animateOpenFull();
                    }
                }
                //SCENARIO D:
                else if (prevProps.displayState === BottomSheetStates.OPEN_DETAILS) {
                    //if it was open in full and we go to summary close full and show summary
                    this.animateCloseFull();
                    this.animateOpenSummary();
                } else if (prevProps.displayState === BottomSheetStates.OPEN_SUMMARY) {
                    //if it was open in summary and we go to full close summary and show full
                    this.animateCloseSummary();
                    this.animateOpenFull();
                }
            }
        } else {
        }

    }

  animateOpenSummary = () => {
        let { animationTime } = this.props
        let { animatedPosition } = this.state
        Animated.timing(animatedPosition, {
            toValue: 10,
            duration: animationTime,
        }).start()
    }

    animateCloseSummary = () => {
        let { animationTime } = this.props
        let { animatedPosition } = this.state
        Animated.timing(animatedPosition, {
            toValue: -(DEVICE.height),
            duration: animationTime,
        }).start()
    }

I tried to use flex:1 but with absolute position but it doesn't do what I wanted. So the only way I found to do what I want is to calculate the height of the window. In iOS using Dimensions API along with some checking if the device has notch gives me what I want . In Android I didn't found any consistent way to calculate the height. Dimensions API works different if the device has notch. So I used the react-native-device-info package to find if the device has notch. The way that the module finds if the device has notch is to have an array with device model names and check if the array contains the current model name. This way is not very accurate especially if you consider that every day a new device comes up with notch .

let DEVICE = Dimensions.get('window')
const STATUS_BAR_HEIGHT = StatusBar.currentHeight || 20 
let isIPhoneX = (DEVICE.height == 812 || DEVICE.height == 896)
const STATUS_BAR_IOS = isIPhoneX ? 64 : 20
let iosHeight = Dimensions.get('screen').height - STATUS_BAR_IOS
const CONTENT_HEIGHT = DEVICE.height/2
const FULL_CONTENT_HEIGHT = Platform.OS === "android" ? DeviceInfo.hasNotch() ? DEVICE.height : DEVICE.height - STATUS_BAR_HEIGHT : iosHeight

My next approach was on the bootstrapping of the application to use a SafeAreaView with flex:1 and on the layout event to get the height and store is a global. This is a consistent way but it creates a dependency on the BottonmSheet Component that I would like to avoid.

<SafeAreaView style={{flex: 1 }} onLayout={(evn) => {           setHeight(evn.nativeEvent.layout.height)
        }}>

So I need to ask if there is way to get the window height

Not able to get Firebase crashlytics in react native android appliction

$
0
0

I am trying to add Firebase Crashlytics in react native application. I have added all the dependencies as per firebase console suggestion but I am not getting any crash report on the console. I have implemented crash reports as per the native android code.

React Native on Android: Unable to determine the current character, it is not a string, number, array, or object

$
0
0

I create a new application and insert a old code, when i build the application this error appears:

Script 'C:\Users\nameuser\Desktop\nameapp\node_modules@react-native-community\cli-platform-android\native_modules.gradle' line: 191

What went wrong:

A problem occurred evaluating settings 'nameapp'.

Unable to determine the current character, it is not a string, number, array, or object

The current character read is 'i' with an int value of 105
Unable to determine the current character, it is not a string, number, array, or object
line number 1
index number 0
info Run "react-native --help" to see a list of all available commands.

With react-native info command I have the current situation:

info
  React Native Environment Info:
    System:
      OS: Windows 10
      CPU: (8) x64 Intel(R) Core(TM) i7-8550U CPU @ 1.80GHz
      Memory: 6.46 GB / 15.85 GB
    Binaries:
      Yarn: 1.15.2 - C:\laragon\bin\nodejs\node-v11\yarn.CMD
      npm: 6.12.0 - C:\Program Files\nodejs\npm.CMD
    IDEs:
      Android Studio: Version  3.5.0.0 AI-191.8026.42.35.5900203

And on the package.json:

{
  "name": "nameapp",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "@react-native-community/cli-platform-android": "^2.9.0",
    "axios": "^0.18.0",
    "haversine": "^1.1.0",
    "moment": "^2.22.2",
    "react": "16.6.3",
    "react-native": "^0.59.8",
    "react-native-actionsheet": "^2.4.2",
    "react-native-auto-height-image": "^1.1.0",
    "react-native-cached-image": "^1.4.3",
    "react-native-cli": "^2.0.1",
    "react-native-fbsdk": "^0.8.0",
    "react-native-global-font": "^1.0.2",
    "react-native-google-places": "^3.0.5",
    "react-native-image-crop-picker": "^0.24.1",
    "react-native-image-pan-zoom": "^2.1.10",
    "react-native-image-placeholder": "^1.0.14",
    "react-native-iphone-x-helper": "^1.2.0",
    "react-native-keyboard-manager": "^4.0.13-10",
    "react-native-maps": "github:react-community/react-native-maps",
    "react-native-maps-super-cluster": "^1.4.1",
    "react-native-modal-datetime-picker": "^5.1.0",
    "react-native-open-maps": "^0.3.3",
    "react-native-progress": "^3.4.0",
    "react-native-push-notification": "^3.1.2",
    "react-native-router-flux": "^4.0.6",
    "react-native-share": "^1.2.1",
    "react-native-snap-carousel": "^3.7.4",
    "react-native-swiper": "^1.5.13",
    "react-native-vector-icons": "^4.6.0",
    "react-native-view-shot": "^2.5.0",
    "react-redux": "^5.0.7",
    "redux": "^3.7.2",
    "redux-persist": "^4.10.1",
    "redux-persist-transform-filter": "0.0.15",
    "redux-thunk": "^2.2.0"
  },
  "devDependencies": {
    "babel-jest": "23.6.0",
    "jest": "23.6.0",
    "metro-react-native-babel-preset": "0.51.1",
    "react-test-renderer": "16.6.3"
  },
  "jest": {
    "preset": "react-native"
  },
  "rnpm": {
    "assets": [
      "./src/fonts"
    ]
  }
}

Thank for the help.


CLEARTEXT communication error while running React Native Debugger

$
0
0

In order to fix "cleartext communication to localhost not permitted by a network security policy," error I got while running debugger remotely from a physical device attached to my mac. I created an

network_security_config.xml file and inserted the following code.

<network-security-config>
       <base-config cleartextTrafficPermitted="true">
        <trust-anchors>
            <certificates src="system" />
        </trust-anchors>
    </base-config>
</network-security-config>

I pointed this file to AndroidManifest.xml file.

<application
  android:networkSecurityConfig="@xml/network_security_config"

However, now when I run the application I get this error:

"textTransform" is not a valid style property.StyleSheet root: {"backgroundColor":"#0000000", "fontWeight":"normal", "fontStyle": "normal", "textDecorationLine: "none", "textTransform:: "none"}

If I remove the network_security_config.xml file. Everything runs as expected but I can not access remote debugger.

How to solve react native null value in picker?

$
0
0

I've been working on a react native application on the Android Platform. I implemented a DropDown picker but it gives an error.

The code piece that gives the error:

<View style={styles.if_filterbox}>
    <View style={{ alignSelf: 'center', paddingTop: 5 }}>
        <Text style={styles.if_formLabel}>Adres Seçiniz</Text>
    </View>


    <View style={{ flex: 1, flexDirection: 'column' }}>
        <View style={{ flex: 0.5, flexDirection: 'row' }}>


        <View style={styles.if_regionselect}>
            <Picker
            selectedValue={this.state.cityID}
            style={styles.if_picker}
            mode="dropdown"
            onValueChange={(itemValue, itemIndex) => {
                if (itemValue !== 0) {
                this.setState({
                    city: this.state.cities[itemValue],
                })
                }
            }
            }>
            {this.checkIsCitySelected()}
            {Object.keys(this.state.cities).map(key => {
                return <Picker.Item label={this.state.cities[key].isim} value={key} />
            })}
            </Picker>
        </View>
        </View>
    </View>
</View>  

checkIsCitySelected = () => {
    if (this.state.cityID >= 0) {
      return (<Picker.Item label={this.state.city["isim"]} value={this.state.cityID} />)
    } else {
      return (<Picker.Item label='Şehir Seçiniz' value='-1' />)
    }
  }

I know that cities array is not empty.

Error: Android Dropdown Error

React Native: onPress in Android side somehow triggers onNavigationStateChange

$
0
0

I have some code that I implemented a couple of months ago that fixed the ability for a user to who was reading an article on my app and wanted to click on a hyperlink inside that article, once having done so, the user would be taken to an external browser. This is the implementation:

<View style={styles.content}>
            {Boolean(this.props.article.VideoID) && (
              <VimeoVideo videoId={this.props.article.VideoID.toString()} />
            )}
            {Boolean(this.props.article.Summary) && (
              <Text style={styles.boldParragraph}>
                {this.props.article.Summary}
              </Text>
            )}
            {this.props.article.Sections.map(s => (
              <WebViewAutoHeight
                key={s.Body.substr(10)}
                source={{
                  //prettier-ignore
                  html: `<body style="font-family: -apple-system, Roboto, sans-serif; background-color: ${lightTheme.grey2} !important; color: ${v2Colors.charcoalDarkest}; font-size: ${moderateScale(14, 0.2)}px;">${s.Body}</body>`
                }}
                // onNavigationStateChange={event => {
                //   if (event.url !== uri) {
                //     Linking.openURL(event.url);
                //   }
                // }}
              />
            ))}
          </View>

The commented out part. It works for iOS but on Android, as soon as the user clicks on READ MORE, it takes them to open up another browser in their phone not sure of the connection because onPress={mainActionButtonPress} is what the user is pressing and mainActionButtonPress is connected to a function:

 _goto = article => {
    this.props.setSelectedArticle(article);
    this.props.navigation.navigate("ArticleDetails", { isRead: true });
  };

how is onNavigationStateChange property inside of AutoHeightWebView being triggered by the _goto function? So I looked into this further and my best guess is that when _goto triggers this.props.navigation.navigate("ArticleDetails", { isRead: true });, JavaScript executes everything inside of there including onNavigationStateChange even though it should only do so when event.url !== uri.

How can We Integrate K net Payment in react-native?

$
0
0

Hello I am working on react native project. Here in this project how should we integrate K-net Payment Integration.

Any SDK's is possible for this please let me give the guidance.

react-native-maps get current location

$
0
0

I want to display my current location but I cannot.

I add permission code to AndroidManifest.xml like below.

<uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />

However my emulator did not ask to me 'Allow to 00 access your location while you are using the app'.

Below is my app.js code.

import React, { Component } from 'react';
import { Alert, StyleSheet, Text, View, TouchableOpacity, PermissionsAndroid } from 'react-native';

export default class App extends Component {
    state = {
        location: null
    };

    findCoordinates = () => {
        navigator.geolocation.getCurrentPosition(
            position => {
                const location = JSON.stringify(position);

                this.setState({ location });
            },
            error => Alert.alert(error.message),
            { enableHighAccuracy: true, timeout: 20000, maximumAge: 1000 }
        );
    };

    render() {
        return (
            <View style={styles.container}>
                <TouchableOpacity onPress={this.findCoordinates}>
                    <Text style={styles.welcome}>Find My Coords?</Text>
                    <Text>Location: {this.state.location}</Text>
                </TouchableOpacity>
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#F5FCFF'
    },
    welcome: {
        fontSize: 20,
        textAlign: 'center',
        margin: 10
    }
});
Viewing all 30345 articles
Browse latest View live


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