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

Android App Bundle Version code suddenly very high

$
0
0

I just made a new Android bundle for my React Native app. I manually updated the version code from 90 to 91 in android/app/build.gradle, but now that I am trying to upload to Play Store, the version code is 3145819 (I expected to see 91)

build.gradle:

 defaultConfig {        applicationId "com.myapp"        minSdkVersion rootProject.ext.minSdkVersion        targetSdkVersion rootProject.ext.targetSdkVersion        versionCode 91        versionName "4.1.0"        multiDexEnabled true        missingDimensionStrategy "RNN.reactNativeVersion", "reactNative57_5"        resValue "string", "build_config_package", "com.myapp"    }

I use this command to bundle:

./gradlew bundleProdRelease --console plain

Not sure why this is happening, and I definitely prefer a smaller version code (easier for users to read when reporting bugs).

Any idea what's going on here and how to fix it?


React native 0.62.0 - Network request error on Android for file upload

$
0
0

I have upgraded react-native to 0.62 and i got the problem of Network error for Android only, iOS works fine.

I use FormData object to populate data formated as

const data = new FormData(); // On Android i add file protocol to file path - file://... data.append('photos', {    uri: 'file:///data/.../my-image.jpeg',    type: 'image/jpeg',   name: 'my-image.jpeg'});

and other textual data

data.append('description', 'my long description...');

Does anyone have the problem?

I have tried multiple Android SDKs 27, 28, 29, and got same problem on all :(

The things is if i do not upload images, but only textual data request works just fine :(

Any suggestion welcome :)?

Ask - accessing built in notes app IOS and Android - React Native

$
0
0

is it possible to open Notes app on Ios and Android when the phone has built in Notes app ?

i cannot find any package or apps name (trying to deeplink) the Notes apps on both android and ios.

is every body ever work with this feature ?

Connect React Native front end with Node back end

$
0
0

Sorry in advance if this is a silly question but I'm going in circles here. I'm pretty new to react and node, and looking to connect my react native front end with my node back end. Pretty much every tutorial I read is telling me to "paste the fetch api code after the class declaration and before the render method", but I don't have a class declaration or render method in any of my code, so I'm a little confused about where to put the fetch api code? I don't know if this makes a huge difference but each screen of my app is in it's own file as it's own function and I am using a stack navigator to get between the screens with it's functionality contained in another file for the stack navigator.

If anyone could offer me some help I would really appreciate it, I am beyond confused about what to do.

Included below is my Login Screen function so you can see what I mean when I say the screens are set up as functions. All other screens are laid out the same way. Please let me know if you need to see anything else and I will edit and add it in!

import React from 'react';function LoginScreen() {  return(<View style={{ alignItems: "center", marginTop: 24 }}><Text style={styles.text}>    Login Screen</Text></View> );}export default LoginScreen

Again, I would appreciate any help anyone could give me as this is driving me demented and I would really like to get this working!

React Nativigation navigating back on Android Keyboard Bug

$
0
0

I currently have a react native app with one main screen that navigates to a second screen that has 3 text inputs. The problem I am having only occurs on Android. On the second screen, whenever a text input is in focus and I try to navigate back via react navigations’ back button, the keyboard hides, then reappears, then hides, and then transitions back to the first screen. It seems when I initially press the back button the inputs focus is blurred, then when I let go it refocuses on the input and then blurs it again and then navigates back. Not sure why this is happening on Android. It works as expected on iOS. Any solutions?

Thanks!

Why the android keyboard is trigerring my navigation back

$
0
0

Okay people, this is the issue. When i press an android input to insert text, and the keyboard appears, my screen navigates back. This is only happening on Android.This happens with every input and if i start the screen with the keyboard opened and close it, the same issue appears.I know i am not working with the last version of react-native or libraries.

Here is my environment and package.json.

"react-native": "0.61.3""@react-native-community/datetimepicker": "^2.2.2","@react-native-community/masked-view": "^0.1.5","@react-navigation/bottom-tabs": "^5.0.0-alpha.34","@react-navigation/core": "^5.0.0-alpha.32","@react-navigation/drawer": "^5.0.0-alpha.36","@react-navigation/material-bottom-tabs": "^5.0.0-alpha.31","@react-navigation/material-top-tabs": "^5.0.0-alpha.30","@react-navigation/native": "^5.0.0-alpha.24","@react-navigation/stack": "^5.0.0-alpha.58",

Environment

SO: Ubuntu 20.04 LTS (Also tried on OSX)node: 14.1.0API Android: 28npm:6.14.4

And the app looks something like this. (Not exactly the code, i just joined to this project and the code is such a pain in the ass.)

//App.js<Tab.Navigator  initialRouteName={'HOME'}  tabBarOptions={{  activeTintColor: 'white',  style: {backgroundColor: 'black'},}}><Tab.Screen    name="Account"    component={props => <ProfileTab {...props} />}></Tab.Screen></Tab.Navigator>//ProfileTab.js<Stack.Navigator  mode="modal"  headerMode="none"  initialRouteName="SessionFilter"><Stack.Screen    component={props => (<Login       close={() => {        if (!currentUser) navigation.navigate('SessionFilter');         navigation.goBack();        }}       sendToRegister={() => {        navigation.goBack();        navigation.navigate('Registry');       }}     />   )}   name="Login" /></Stack.Navigator>//Login.jsreturn (<SafeAreaView style={{ flex: 1, backgroundColor: "white" }}><ScrollView        contentContainerStyle={{          backgroundColor: "white",          paddingHorizontal: 15,          minWidth: 350,          alignItems: "center",          flex: 1,          minHeight: Dimensions.get("window").height + 30,        }}><TextField></ScrollView></SafeAreaView>  );};//TextField.jsimport React from 'react';import { TextField } from 'react-native-material-textfield';export const TextField = (props) => (<TextField        {...props}        tintColor="black"        textColor="black"        fontSize={12}        autoCapitalize="none"        onChangeText={text => props.onChange({ target: { value: text } })}        titleTextStyle={{ fontSize: 10 }}        contentInset={{ label: 0 }}        secureTextEntry={props.type && props.type === "password"}    />);

I tried to resume all the shitty code, but it is something like this. Omitted parts i considered not important.

React Native react-native-image-picker, react-native-fetch-blob workaround to clear images taken from camera

$
0
0

You have probably noticed that storageOptions: { cameraRoll: false } parameter is not working on Android when using react-native-image-picker library.

Instead it saves pictures taken from camera to a gallery. Alternatively, storageOptions: { path: 'custom_pah' } works

I used both react-native-fetch-blob and react-native-fs as well as different solutions from articles and GitHub issues to perform very simple operation of removing shots taken from camera.

If I try to delete an image file, both file management libraries leave an empty thumbnail and do not remove file completely.

When I try to delete the whole folder specified previously in 'custom_path' param - nothing happens, though the app has storage permissions.

Please be kind and help with the solution, this is a very well known issue, for instance the Telegram APP doesn't save images to gallery, while the rest of major Android apps do.

Thank you!

How to pass an array from a parent component to child component using props in React Native?

$
0
0

I want to paas "subjects" array from SubjectsScreen to MarkAttendanceScreen and display the array items as a FlatList.

Parent Component

export default class SubjectsScreen extends Component {    state = {      subjects: ["A", "B"]    };    render() {      return (          ...<MarkAttendanceScreen subjectsArray={this.state.subjects} />      );    }}

Child Component

export default class MarkAttendanceScreen extends Component {    constructor(props) {      super(props);      this.state = {        subjects: []      };    }    componentDidMount() {      this.setState({ subjects: this.props.subjectsArray });    }    render() {      return (   <FlatList>            { this.props.subjects.map((item, key)=>(<Text key={key}> { item } </Text>)            )}</FlatList>      );    }}

Best way to fetch pedometer data React Native

$
0
0

I'd like to know what's the best way to fetch pedometer data from the phone (especially Android). Firstly I thought I could run a task in the background and subscribe to the step sensor via react-native-universal-pedometer npm package but I found out that this is not possible in RN.Then I tried react-native-google-fit package where you can query steps data from date to date but the module is quite buggy.Is there a better way of fetching pedometer data as well as average walking velocity while maintaining battery efficiency?

react-native init versus Expo for new React Native project?

$
0
0

I am completely new to React Native and I would like to develop my first RN app. I have experience with React and building iOS apps with Swift, but I have never tried React Native.

I see that there are two main ways of creating a new app, either with react-native init or through Expo. Which is the preferred toolchain for someone of my experience? Can somebody explain the tradeoffs between the two?

Back button react native doesnt closes the app

$
0
0

Hi im trying to do this:

1- i have a basic webview app, when i press back button i should get back to last page but if im on login page and press back button or back gesture on my android my app should exit, but is not working it stays open when i press back button it refresh the webview again and again here my code:

const styles = StyleSheet.create({  flexContainer: {    flex: 1  }})export default class App extends Component {  webView = {    canGoBack: false,    ref: null,  }  onAndroidBackPress = () => {    if (this.webView.canGoBack && this.webView.ref) {      this.webView.ref.goBack();      return true;    }    return false;  }  componentWillMount() {    if (Platform.OS === 'android') {      BackHandler.addEventListener('hardwareBackPress', this.onAndroidBackPress);    }    setTimeout(() => {      SplashScreen.hide();  }, 1800);  }  componentWillUnmount() {    if (Platform.OS === 'android') {      BackHandler.removeEventListener('hardwareBackPress');    }  }  render() {    return (<SafeAreaView style={styles.flexContainer}><WebView        source={{uri: 'https://clientes.dbsnetwork.net'}}        startInLoadingState={true}        allowsBackForwardNavigationGestures        renderLoading={() => (<ActivityIndicator            color='black'            size='large'            style={styles.flexContainer}          />        )}        style={{marginTop: 0}}        ref={(webView) => { this.webView.ref = webView; }}        onNavigationStateChange={(navState) => { this.webView.canGoBack = navState.canGoBack; }}      /></SafeAreaView>    );  }}

there is anything else i should do?

attached video gif

enter image description here

thank you.

Call/SMS permission final warning email from Google Play for My React Native app

$
0
0

My application is developed in React Native and released on Playstore.

So first time when it's showing warning for RECEIVE_SMS

I have removed plugin related to this permission and also changed my working flow accordingly. And again uploaded updated apk to playstore.

Still I am getting final warning mail from Google play with below message:

In October 2018, we announced updates to our Permissions policy that will limit which apps are allowed to request Call Log and SMS permissions. This is the third and final reminder to let you know that this policy may impact one or more of your apps.

Starting January 9, 2019, only an app that has been selected as a user's default app for making calls or text messages, or whose core functionality is approved for one of the exception use cases, will be able to access Call Log or SMS permissions.

I have find all over the project, I am not getting RECEIVE_SMS permission in any of the plugin.

Here is my Manifest code:

<uses-permission android:name="android.permission.INTERNET" /><uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" /><uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/><uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED" /><uses-permission android:name="android.permission.VIBRATE" /><uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/><uses-permission android:name="android.permission.WAKE_LOCK" /><permission        android:name="${applicationId}.permission.C2D_MESSAGE"        android:protectionLevel="signature" /><uses-permission android:name="${applicationId}.permission.C2D_MESSAGE" />

Here is the plugin I have used:

"dependencies": {"lodash": "^4.17.10","moment": "^2.22.2","moment-duration-format": "^2.2.2","prop-types": "^15.6.2","react": "16.4.1","react-native": "0.56.0","react-native-actionsheet": "^2.4.2","react-native-autocomplete-input": "^3.6.0","react-native-background-timer": "^2.0.1","react-native-check-box": "^2.1.0","react-native-confirmation-code-input": "^1.0.4","react-native-datepicker": "^1.7.2","react-native-device-info": "^0.24.3","react-native-dropdownalert": "^3.5.0","react-native-fabric": "github:corymsmith/react-native-fabric#523a4edab3b2bf55ea9eeea2cf0dde82c5c29dd4","react-native-firebase": "^4.3.8","react-native-google-sign-in": "^1.0.16","react-native-keyboard-aware-scroll-view": "^0.7.0","react-native-material-dialog": "^0.7.4","react-native-message-bar": "^2.0.10","react-native-modal": "^6.5.0","react-native-pages": "^0.7.0","react-native-progress": "^3.5.0","react-native-simple-radio-button": "^2.7.2","react-native-snackbar": "^0.5.0","react-native-social-auth": "^2.0.0","react-native-splash-screen": "^3.1.1","react-native-stars": "^1.1.5","react-native-swiper": "^1.5.13","react-native-tab-view": "^1.0.2","react-native-toast": "^1.0.1","react-native-vector-icons": "^5.0.0","react-native-web-service-handler": "^1.0.2","react-navigation": "^2.11.2"  },

I am using below process to find permission:

  1. I have try to find this permission using all search methods using different tools and editors
  2. Also manually check all the plugins manifest files.
  3. Checked Manifest from build folder, after creating release apk.

Still I am not able to find the point,from where this permission including in apk.

So my questions are:

  1. How I can find from where this permission including into my apk?
  2. While using search Method, I am able to find RECEIVE_SMS permission in node_modules/react native/Libraries/PermissionAndroid Module. But I am not using or importing that class in my project. So is it creating problem?

How I can build apk without CALL/SMS permission and any debug method for React Native to check it?

My app keeps crashing automatically right after I try to open it or rebuild it

$
0
0

My react-native app was working just fine, I wanted to add admob to it, so I tried to install this package: @react-native-firebase/admobbut just after adding it the app never builds with "react-native run-android" the error was aboutor around "Task :app:mergeDexDebug failed" after much of looking around for a solution I found this "multiDexEnabled true" adding it in the build.gradle app-level one in the "defaultConfig"and that worked and it was built successfully but when I open it on the emulator/physical device via USB it still crash or close when I just open it. I believe this problem has something to do with that I have another packages from @react-native-firebase, such as @react-native-firebase/app and @react-native-firebase/analytics they both was different version of the new admob package I installed so I updated them all to the same version and still nothing, didn't work out, I even tried another package called "react-native-admob" that acted the same, same errors and same reaction after the same solution. and the app works just fine after I remove the packages "admob packages": (@react-native-firebase/admob, react-native-admob).

my project specs:react-native: "0.62.@react-native-firebase/analytics: "^6.4.0@react-native-firebase/app: "^6.4.0",

I don't really know much about the error or crash logs or how to get it out of the app, so please if I can provide anything that would help please let me know.

Edit texts from a .bundle file created with React Native

$
0
0

Today I ran into a problem. I do not have the source of the files of an APP but I have extracted the same from the APK. It turns out that I want to modify the texts of the app but it is compressed in .bundle. At the time of wanting to edit the texts I can't find a way to modify a title knowing that it was created with react native, I attach part of the code where the section I want to translate and an image are.

I want to translate it from English to Spanish. EJ: Name/Nombre

        n = r(d[1]);    Object.defineProperty(e, "__esModule", { value: !0 }), e.default = void 0; var o = n(r(d[2])),        l = n(r(d[3])),        u = n(r(d[4])),        f = n(r(d[5])),        c = n(r(d[6])),        s = n(r(d[7])),        p = n(r(d[8])),        h = t(r(d[9])),        y = n(r(d[10]));    function b(t, n) { var o = Object.keys(t); if (Object.getOwnPropertySymbols) { var l = Object.getOwnPropertySymbols(t);            n && (l = l.filter(function(n) { return Object.getOwnPropertyDescriptor(t, n).enumerable })), o.push.apply(o, l) } return o }    function v(t) { for (var n = 1; n < arguments.length; n++) { var l = null != arguments[n] ? arguments[n] : {};            n % 2 ? b(l, !0).forEach(function(n) {                (0, o.default)(t, n, l[n]) }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(t, Object.getOwnPropertyDescriptors(l)) : b(l).forEach(function(n) { Object.defineProperty(t, n, Object.getOwnPropertyDescriptor(l, n)) }) } return t } var O = y.default.form.Form;    O.stylesheet.checkbox.normal.display = 'flex', O.stylesheet.checkbox.normal.alignSelf = 'flex-start', O.stylesheet.checkbox.error.display = 'flex', O.stylesheet.checkbox.error.alignSelf = 'flex-start'; var j = (function(t) {        function n() { var t, o;            (0, u.default)(this, n); for (var f = arguments.length, p = new Array(f), h = 0; h < f; h++) p[h] = arguments[h]; return (o = (0, c.default)(this, (t = (0, s.default)(n)).call.apply(t, [this].concat(p)))).setRef = function(t) { o.form = t }, o.handleChange = function(t, n) { var u = (0, l.default)(n, 1)[0];                o.props.onChange(u, t[u]) }, o.getFormType = function() { var t = o.props.product,                    n = t.manage_stock,                    l = t.type; return v({ name: y.default.String }, 'simple' === l ? v({ regular_price: y.default.String, sale_price: y.default.String, sku: y.default.String, manage_stock: y.default.Boolean }, n ? { stock_quantity: y.default.Number } : {}) : {}) }, o } return (0, p.default)(n, t), (0, f.default)(n, [{ key: "render", value: function() { var t = this.props.product; if (!t) return null; var n = y.default.struct(this.getFormType()); return h.default.createElement(O, { ref: this.setRef, type: n, value: t, onChange: this.handleChange }) } }]), n })(h.Component);    e.default = j }, 1492, [376, 1, 52, 18, 28, 29, 36, 39, 42, 54, 1493]); ```[enter image description here][1]  [1]: https://i.stack.imgur.com/bokV9.png

You attempted to use a firebase module that's not installed on your Android project by calling firebase.auth()

$
0
0

I'm trying to use firebase Auth in my app and runt into an issue when trying to register a new user.

As far as I can tell RN should autolink so I shouldn't need to manually link any of this yet here I am

I've read so many possible answers on github, firebase documentation and SO that I think I've gotten my self even more turned around and confused about whats going on.

Below is the code my google searches have told me are important to this problem

Any help is much appreciated.


Register.js

import React, { useState } from 'react';import {     StyleSheet,    View,    Image,    Text,    Dimensions,    TouchableHighlight,    ActivityIndicator,    Alert,    TextInput} from 'react-native';import { StackActions } from 'react-navigation';import auth from '@react-native-firebase/auth';let deviceHeight = Dimensions.get('window').height;let deviceWidth = Dimensions.get('window').width;export default function Register({ navigation }) {    const popAction = () => {        navigation.dispatch(StackActions.pop(1));    }    const [email, setEmail] = useState('');    const [password, setPassword] = useState('');    const [c_password, setC_Password] = useState('');    //const [firstName, setFirstName] = useState('');    //const [lastName, setLastName] = useState('');    const [showLoading, setShowLoading] = useState(false);    const register = async() => {        setShowLoading(true);        try {            const doRegister = await auth().createUserWithEmailAndPassword(email, password);            setShowLoading(false);            if(doRegister.user) {                navigation.navigate('Home');                console.log('User registered successfully!')            }        } catch (e) {            setShowLoading(false);            Alert.alert(                e.message            );        }    }    passCheck = () => {        if (password != c_password) {            Alert.alert(                e.message            );        } else {            register()        }    }    return(<View style={styles.container}><View style={styles.topMenu}><TouchableHighlight style={styles.back}                    activeOpacity={0.6}                    underlayColor="#1ABC9C"                    onPress={popAction}><Image style={styles.back}                        source={require('../../images/icons/back.png')}                    /></TouchableHighlight></View><View style={styles.logo}><Text style={styles.logoText}>                    Register</Text></View><View style={styles.registerContainer}>                {/*<TextInput style={styles.input}                    placeholder='First Name'                    value={firstName}                    onChangeText={setFirstName}                />                */}                {/*<TextInput style={styles.input}                    placeholder='Last Name'                    value={lastName}                    onChangeText={setLastName}                />                */}<TextInput style={styles.input}                    placeholder='Your Email'                    value={email}                    onChangeText={setEmail}                /><TextInput style={styles.input}                    placeholder='Your Password'                    secureTextEntry={true}                    value={password}                    onChangeText={setPassword}                /><TextInput style={styles.input}                    placeholder='Confirm Password'                    secureTextEntry={true}                    value={c_password}                    onChangeText={setC_Password}                /><TouchableHighlight style={styles.button}                    activeOpacity={0.6}                    underlayColor="#1ABC9C"                    title="Login"                    onPress={this.passCheck}><Text>                        Register</Text></TouchableHighlight></View></View>    )  }const styles = StyleSheet.create({    container: {        flex: 1,        justifyContent: 'center',        backgroundColor: '#1ABC9C'    },    topMenu: {        height: deviceHeight/10,        marginLeft: deviceWidth/30,        marginRight: deviceWidth/30,        justifyContent: 'center'    },    back: {        height: deviceHeight/15,        width: deviceHeight/15,    },    logo: {        height: 2*(deviceHeight/10),        justifyContent: 'center',        alignItems: 'center',    },    logoText: {        color: 'white',        fontStyle: 'italic',        fontWeight: '700',        fontSize: 60    },    registerContainer: {        height: 7*(deviceHeight/10),        alignItems: 'center',        justifyContent: 'space-around',    },    input: {        height: deviceHeight/15,        backgroundColor: 'white',        borderRadius: 50,        alignItems: 'center',        justifyContent: 'center'    },    button:{        height: deviceHeight/15,        backgroundColor: 'white',        borderRadius: 50,        alignItems: 'center',        justifyContent: 'center'    },    buttonText:{        color: '#1ABC9C',        fontStyle: 'italic',        fontWeight: '700',        fontSize: 30    }});

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    }    repositories {        google()        jcenter()    }    dependencies {        classpath("com.android.tools.build:gradle:3.5.2")        classpath("com.google.gms:google-services:4.3.3")        // 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()        maven { url 'https://www.jitpack.io' }    }}

android/app/build.gradle:

apply plugin: "com.android.application"apply plugin: 'base'import com.android.build.OutputFileproject.ext.react = [    enableHermes: false,  // clean and rebuild if changing]apply from: "../../node_modules/react-native/react.gradle"def enableSeparateBuildPerCPUArchitecture = falsedef enableProguardInReleaseBuilds = falsedef 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.andrewbrook.nghbrly"        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 {            // Caution! In production, you need to generate your own keystore file.            // see https://facebook.github.io/react-native/docs/signed-apk-android.            signingConfig signingConfigs.debug            minifyEnabled enableProguardInReleaseBuilds            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"        }    }    packagingOptions {        pickFirst "lib/armeabi-v7a/libc++_shared.so"        pickFirst "lib/arm64-v8a/libc++_shared.so"        pickFirst "lib/x86/libc++_shared.so"        pickFirst "lib/x86_64/libc++_shared.so"    }    // applicationVariants are e.g. debug, release    applicationVariants.all { variant ->        variant.outputs.each { output ->            // For each separate APK per architecture, set a unique version code as described here:            // https://developer.android.com/studio/build/configure-apk-splits.html            def versionCodes = ["armeabi-v7a": 1, "x86": 2, "arm64-v8a": 3, "x86_64": 4]            def abi = output.getFilter(OutputFile.ABI)            if (abi != null) {  // null for the universal-debug, universal-release variants                output.versionCodeOverride =                        versionCodes.get(abi) * 1048576 + defaultConfig.versionCode            }        }    }}dependencies {    implementation fileTree(dir: "libs", include: ["*.jar"])    //noinspection GradleDynamicVersion    implementation "com.facebook.react:react-native:+"  // From node_modules    implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.0.0"    debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {      exclude group:'com.facebook.fbjni'    }    debugImplementation("com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}") {        exclude group:'com.facebook.flipper'    }    debugImplementation("com.facebook.flipper:flipper-fresco-plugin:${FLIPPER_VERSION}") {        exclude group:'com.facebook.flipper'    }    if (enableHermes) {        def hermesPath = "../../node_modules/hermes-engine/android/";        debugImplementation files(hermesPath +"hermes-debug.aar")        releaseImplementation files(hermesPath +"hermes-release.aar")    } else {        implementation jscFlavor    }}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)apply plugin: 'com.google.gms.google-services'

settings.gradle:

rootProject.name = 'nghbrly'apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)include ':app'include ':@react-native-firebase_app'project(':@react-native-firebase_app').projectDir = new File(rootProject.projectDir, './../node_modules/@react-native-firebase/app/android')

MainApplication.java:

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

Can we use Realm database for free like alternative to Sqlite and CoreData?

$
0
0

I was doing a React-Native project. I was required to save data locally and then I decided to this in Realm.

Soon I found out it has pricing options for cloud database.I'm not able to find out if this DB can use an alternative like sqlite or CoreData like it has mentioned:

"Used by 100k+ developers and downloaded over two billion times. Realm Database is a fast, easy to use, and open source alternative to SQLite and Core Data."

Can I use Realm for free for saving data locally?

Flutter Device Preview equivalent in React Native App?

$
0
0

recently i've found this plugin can preview many device of Android or iOS device in one installed apps,

gif of the plugin is at https://github.com/aloisdeniel/flutter_device_preview

enter image description here

does react native has something like this?

I know there's some similar plugin like Expo and Appetize but i need something like this,

i mean i can preview of many device in my apps, not installing my app on many devices.

React native android can not find com.android.tools.build:gradle:3.6.3

$
0
0

Any people met the issue Could not resolve all artifacts for configuration ':react-native-fast-image:classpath' and can not find com.android.tools.build:gradle:3.6.3 ? I try open the project structure and see the gradle plugin tool is 3.6.3 and the gradle version is 5.4.6 but i dont know what happen now

The build.gradle file :

// Top-level build file where you can add configuration options common to all sub-projects/modules.buildscript {    /*ext {        buildToolsVersion = "28.0.2"        minSdkVersion = 16        compileSdkVersion = 28        targetSdkVersion = 27        supportLibVersion = "28.0.0"    }*/    repositories {        jcenter()        google()        maven {            url 'https://maven.google.com/'            name 'Google'        }        mavenCentral()    }    dependencies {        classpath 'com.android.tools.build:gradle:3.5.0'        classpath 'com.google.gms:google-services:4.0.1'        // NOTE: Do not place your application dependencies here; they belong        // in the individual module build.gradle files    }}allprojects {    repositories {        configurations.all {            resolutionStrategy.eachDependency { details ->                def requested = details.requested                if (requested.group == 'com.google.android.gms') {                    details.useVersion '12.0.1'                }                if (requested.group == 'com.google.firebase') {                    details.useVersion '12.0.1'                }            }        }        mavenLocal()        mavenCentral()        google()        jcenter()        maven {            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm            url "$rootDir/../node_modules/react-native/android"        }        maven {            url 'https://maven.google.com/'            name 'Google'        }    }}subprojects {    project.configurations.all {        resolutionStrategy.eachDependency { details ->            if (details.requested.group == 'com.android.support'&& !details.requested.name.contains('multidex') ) {                details.useVersion "27.1.1"            }        }    }}ext {    buildToolsVersion = "28.0.3"    minSdkVersion = 16    compileSdkVersion = 28    targetSdkVersion = 28    supportLibVersion = "28.0.0"    googlePlayServicesVersion = "15.0.1"    androidMapsUtilsVersion = "0.5+"}project.ext {    excludeAppGlideModule = true}/*task wrapper(type: Wrapper) {    gradleVersion = '4.7'    distributionUrl = distributionUrl.replace("bin", "all")}*/

React Native CameraRoll.getPhotos API doesn't seem to return

$
0
0

images grid

I want to create an image grid like this one but I have failed to get camera roll from the device.I have tried using @react-native-community/cameraroll but it doesn't seem to workHere is my code.

import React,{useState, useEffect} from 'react';import {View} from 'react-native';import * as Permissions from 'expo-permissions';import CameraRoll from "@react-native-community/cameraroll";const getImages = async (setImages) => {   await Permissions.askAsync(Permissions.CAMERA_ROLL);   const x=await CameraRoll.getPhotos({first:2})   await setImages([...x.edges])}export default function App() {  const [images,setImages]=useState([])  useEffect(() => {    console.log('loading photos')    getImages(setImages)    console.log('back')    console.log(images)  }, []);  return (<View ></View>  );} 

The code is intended to load images into the state when the component mounts. How can I fix this problem?

How to use different styles for android and ios on react-native?

$
0
0

I want to use different styles for ios and android, how can I do it?And maybe somebody know how to stylizing TextInput, I need only bottom border, but borderBottomWidth doesnt work.

Viewing all 28473 articles
Browse latest View live


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