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

How can I open my React Native App from the browser?

$
0
0

I would like to open my app from the browser.

example: I open a browser, type in: https://open.my.app, or app://www.example.com and have my app as an option come up.

I read about Deep Links and I am quite sure I set up my project properly, YET nothing happens when I either try to type and run: https://open.my.app, app://www.example.com

My AndroidManifest:

<manifest xmlns:android="http://schemas.android.com/apk/res/android"    package="com.somemobileapp"><uses-permission android:name="android.permission.INTERNET" /><uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/><application      android:name=".MainApplication"      android:label="@string/app_name"      android:icon="@mipmap/ic_launcher"      android:allowBackup="false"      android:theme="@style/AppTheme"><activity        android:name=".MainActivity"        android:launchMode="singleTask"        android:label="@string/app_name"        android:configChanges="keyboard|keyboardHidden|orientation|screenSize"        android:windowSoftInputMode="adjustResize"><intent-filter><action android:name="android.intent.action.MAIN" /><category android:name="android.intent.category.LAUNCHER" /><category android:name="android.intent.category.BROWSABLE" /><!-- Change these two in the future to a proper one --><data android:scheme="https" android:host="www.example.com" /><data android:scheme="app" android:host="open.my.app" /></intent-filter></activity><activity android:name="com.facebook.react.devsupport.DevSettingsActivity" /></application></manifest>

So even after this, it's not working.


React Native app crashes on the first launch only

$
0
0

When loading my app for the first time, it crashes with the following error:

facebook::react::Recoverable: Could not open file/data/user/0/****/files/ReactNativeDevBundle.js: No such file or directory

Upon reading similar issues, it points to a possible issue with my app version and the codePush SDK, however there seems to be no issues with the versioning of both.

Does anyone have an idea what is going on? If i kill the app and reopen in the android emulator, the app works with no issues.

Can't access to camera through react-native-webview

$
0
0

I am using react-native-webview version 4.0.2 . So I have a webview that contains an add button that allows us to take picture with the camera but when clicking at that button nothing is shown and no camera permission shown : this is on android side but working very well on ios (i can see permission and access to camera ) . In my AndroidManifest.xml i do have :

<uses-permission android:name="android.permission.CAMERA" /><uses-feature android:name="android.hardware.camera"      android:required="false"/><uses-feature android:name="android.hardware.camera.autofocus"     android:required="false"/> 

So please do you have any suggestion ?

Get value from Picker onValueChange in react-native

$
0
0

I am developing an app using react native.Already I have implemented a list of user data. One example of data is this.

UID234 {"name":"Chris","age":31,"traits":{"eyes":"blue","shoe_size":10}}

Here's my code.


import RNPickerSelect from 'react-native-picker-select';...<RNPickerSelect     onValueChange={(value) => console.log(value)} // そのユーザーのvalueを取る     // {console.log(to_user)}    items={[      { label: 'Chris', value: 'UID234' },      { label: 'Marge', value: 'UID345' },      { label: 'Yuri', value: 'UID456' }            ]}     style={pickerSelectStyles}     placeholder={{ label: '選択してください', value: '' }}     />

In this case, when I select Chris, I can see "UID234" is shown on the console.

What I want to do is to print "Chris" on the screen.How can I do that? Please help me...

iOS simulator - AWS S3 Upload small picture EntityTooLarge

$
0
0

I'm currently using AWS S3 upload, concerning picture upload, mostly small ones, ID Card, Shots, not large ones.On Real Devices (Android), the upload works well, however, on iOS Simulator, I'm keep having these errors :

"<?xml version="1.0" encoding="UTF-8"?><Error><Code>EntityTooLarge</Code><Message>Your proposed upload exceeds the maximum allowed size</Message>. <ProposedSize>50930</ProposedSize><MaxSizeAllowed>49156</MaxSizeAllowed>. <RequestId>...RequestId...</RequestId>. <HostId>....idHost....</HostId></Error>"

My file got a size indeed of 49156, and when doing the basics request, I'm using it, but when validate the upload on S3, I don't know why it's setting the size to 50930 (in the example above)...

My FormData looks like this :

data: FormData_parts: Array(10)0: (2) ["key", "users/blabla/kyc-blabla.jpg"]1: (2) ["acl", "private"]2: (2) ["bucket", "mybucket.eu"]3: (2) ["X-Amz-Algorithm", "AWS4-HMAC-SHA256"]4: (2) ["X-Amz-Credential", "credential"]5: (2) ["X-Amz-Date", "date"]6: (2) ["Policy", "policyInfos"]7: (2) ["X-Amz-Signature", "signature info"]8: (2) ["Content-Type", "image/jpeg"]9: Array(2)   0: "file"   1:     name: "6DC54103-30CE-4017-9BCA-65B4838BDAF4.jpg"     size: 49156     type: "image/jpeg"     uri: "6DC54103-30CE-4017-9BCA-65B4838BDAF4.jpg"

It works well on Android.

React Native: Navigate Push Makes TextInput Flashing Once On First Focus (Android)

$
0
0

On my real Android device, focusing a TextInput after pushing a screen into a Stack Navigation makes the keyboard flashing once (appears then disappears immediately). This always happens if I never tap the TextInput after keyboard flashing. Focusing the TextInput again breaks this problem, but this first focus issue is kind of annoying, especially the app is designed for fast pace operation. Please advice.

This doesn't occur:

  • in Android Emulator
  • if I use navigation.navigate('...')

i

These codes below are exactly the same that run on my deivce, it's just simple codes no fancy things.

App.js

import * as React from 'react';import { NavigationContainer } from '@react-navigation/native';import { createStackNavigator } from '@react-navigation/stack';import CategoryScreen from './screens/Category';const CartNavStack = createStackNavigator();export default function App() {  return (<NavigationContainer><CartNavStack.Navigator><CartNavStack.Screen name="Category" component={CategoryScreen} /></CartNavStack.Navigator></NavigationContainer>  );}

Category.js

import React from 'react';import { View, TextInput, Button } from 'react-native';export default function Cart({ navigation }) {  function goToAnotherCategory() {    navigation.push('Category');  }  return (<View><Button onPress={goToAnotherCategory} title="Go to Another Category" /><TextInput style={{ margin: 10, borderWidth: 1, backgroundColor: 'white' }} /></View>  )}

I'm using these versions:

"dependencies": {  ..."@react-navigation/native": "^5.5.1","@react-navigation/stack": "^5.5.1","react": "16.11.0","react-native": "0.62.2"  ...}

React Native - Deep linking is not working when app is not in background (Android, iOS)

$
0
0
  • if app in background

    specific screen will open.

  • if app is not in background or kill the app

    it will show first screen only.

Linking.getInitialURL() is return null

value change automatically without seleting picker (RNPickerSelect)

$
0
0

[enter link description here][1]

here is video url[1]: https://filebin.net/5ayyyrzj1tcsjz2u/VID_20200702_153820.mp4?t=7zkou7gf

<RNPickerSelect          placeholder={{            label: 'M/F',            value: null,          }}          value={gender}          style={pickerSelectStyles}          onValueChange={value => setGender(value)}          items={[            {label: 'Male', value: 'm'},            {label: 'Female', value: 'f'},          ]}        />

this happened only some device like one plus and redmi


The react-native-background-timer package stops working in background in Android

$
0
0

I am trying to build the app in react native which plays a sound every 8 seconds. When I install the app in debug mode locally sound plays in every 8 sec even mobile is locked or app in the background.

When I make an android apk and install on my device and start the app in the background then after about 40 seconds my app stops working until I awake my app.

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

RepoLink is here

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

Using Firebase in React Native shows a timer warning

$
0
0

I am using Firebase with React Native. Firebase shows me a timer warning as shown in the screenshot.

enter image description here

I read the following note in the React Native troubleshooting guide.

React Native implements a polyfill for WebSockets. These polyfills are initialized as part of the react-native module that you include in your application through import React from 'react'. If you load another module that requires WebSockets, such as Firebase, be sure to load/require it after react-native:

import React from 'react';import Firebase from 'firebase';

I tried import React before Firebase. But, I still keep getting these timer warnings. The application does work fine. I keep getting multiple warnings at regular intervals. Any help would be well appreciated.

I am using the latest React Native and the warning comes in the Android emulator.

React-native react-native-swipe-up-down-fix plugin does not work properly with tab bar

$
0
0

I want to implement swipe gesture in the app for that i tired react-native swipe-up-down plugin it worked perfectly without footer tab-bar in the app, but when i add tab-bar in the footer then it works fine and swipe-mini is visible when the app/page reload, but once user do swipe-up and then tries to perform swipe down then show-mini is not visible actully it hides below the footer tabbar.

Change backgroundColor BEHIND keyboard with React Native?

$
0
0

This sounds needless and crazy, but it's actually much more sane than it sounds.

I've been trying to find a way to do this and am pretty close to giving up. Currently I assume it's not possible.

What I'd like to do is change the color behind the keyboard so that the app doesn't have a big white area in the app switcher.

enter image description here

Can not get expo push token

$
0
0

I am building a React native app which is based on Expo , i use Expo's push notification . when i test app with expo cli i get the expo token . and after i generate a .aab and i post it on play store . i can't get the expo token from any device . i don't know why .

registerForPushNotification = async() => {    // Check for existing permissions    const {status} = await Permissions.getAsync(Permissions.NOTIFICATIONS);    let finalStatus = status;    // if no existing permission, ask user for permission    if (status !== 'granted') {        const {status} = await Permissions.askAsync(Permissions.NOTIFICATIONS);        finalStatus = status;    }    // if no permission, exit the function.    if (finalStatus !== 'granted') {      alert('Failed to get push token for push notification!')      return;}    // get push notification token.    let token = await Notifications.getExpoPushTokenAsync();    alert(token)    firebase.database().ref('/users/usersInfo/'+user).update({      expoToken:token    })    if (Platform.OS === 'android') {      Notifications.createChannelAndroidAsync('default', {        name: 'default',        sound: true ,        priority: 'max',        vibrate: [0, 250, 250, 250],      });    }  }

Loading screen in react native webview [closed]

$
0
0

I have a problem with my webview on react-native. The page I'm loading has a button to log in with google account.

When I don't define userAgent I get a 403 disallowed user agent error. If I define userAgent and click on the button. I connect with my google account and then I have an infinite loading screen. Do you have a solution for resolve my problem ? Thank you !

<WebView   source={{uri: "http://example.fr"}} (It s just for example)  userAgent="Mozilla/5.0 (Linux; Android 4.1.1; Galaxy Nexus Build/JRO03C) AppleWebKit/535.19 (KHTML, like Gecko) Chrome/18.0.1025.166 Mobile Safari/535.19"  ref={this.WEBVIEW_REF}  onNavigationStateChange={this.onNavigationStateChange.bind(this)}/>

Loading Screen

I have a flatlist in react Native but i press button save not reload data automatically

$
0
0

I have a flatlist in react Native but i press button save not reload data automatically and not render in flattest but i reload app and the item save appears

I need that I press button save the data render data automatically in a flatList I need help

strong text/**

  • #############################################################################
  • List screen.
  • #############################################################################*/class ListScreen extends React.Component {

/**

  • Constructor.*/constructor(props) {
super(Props);this.state = {  listData : [ ]};

} /* End constructor. */

/**

  • Render this component.*/render() { return (
<Root><View style={styles.listScreenContainer}>    { /* ########## Add Restaurant button ########## */ }<CustomButton      text="Add Restaurant"      width="94%"      onPress={ () => { this.props.navigation.navigate("AddScreen"); } }    />    { /* ########## Restaurant list ########## */ }<FlatList      style={styles.restaurantList}      data={this.state.listData}      renderItem={ ({item}) =><View style={styles.restaurantContainer}><Text style={styles.restaurantName}>{item.name}</Text><CustomButton            text="Delete"            onPress={ () => {              Alert.alert("Please confirm","Are you sure you want to delete this restaurant?",                [                  { text : "Yes", onPress: () => {                    // Pull data out of storage.                    AsyncStorage.getItem("restaurants",                      function(inError, inRestaurants) {                        if (inRestaurants === null) {                          inRestaurants = [ ];                        } else {                          inRestaurants = JSON.parse(inRestaurants);                        }                        // Find the right one to delete and splice it out.                        for (let i = 0; i < inRestaurants.length; i++) {                          const restaurant = inRestaurants[i];                          if (restaurant.key === item.key) {                            inRestaurants.splice(i, 1);                            break;                          }                        }                        // Store updated data in storage.                        AsyncStorage.setItem("restaurants",                          JSON.stringify(inRestaurants), function() {                            // Set new state to update list.                            this.setState({ listData : inRestaurants });                            // Show toast message to confirm deletion.                            Toast.show({                              text : "Restaurant deleted",                              position : "bottom",                              type : "danger",                              duration : 2000                            });                          }.bind(this)                        );                      }.bind(this)                    );                  } },                  { text : "No" },                  { text : "Cancel", style : "cancel" }                ],                { cancelable : true }              )          } } /></View>      }    /></View></Root>

); } /* End render(). */

/**

  • Execute after the component mounts.*/componentDidMount() {
// Block hardware back button on Android.BackHandler.addEventListener("hardwareBackPress", () => { return true; });// Get list of restaurants.AsyncStorage.getItem("restaurants",  function(inError, inRestaurants) {    if (inRestaurants === null) {      inRestaurants = [ ];    } else {      inRestaurants = JSON.parse(inRestaurants);    }    this.setState({ listData : inRestaurants });  }.bind(this));

}; /* End componentDidMount() */

} /* End ListScreen. */

/**

  • #############################################################################
  • Add screen.
  • #############################################################################*/class AddScreen extends React.Component {

/**

  • Constructor.*/constructor(props) {
super(props);this.state = {  name : "",  cuisine : "",  price : "",  rating : "",  phone : "",  address : "",  webSite : "",  delivery : "",  key : `r_${new Date().getTime()}`};

} /* End constructor. */

/**

  • Render this component.*/render() { return (
<ScrollView style={styles.addScreenContainer}><View style={styles.addScreenInnerContainer}><View style={styles.addScreenFormContainer}>      { /* ########## Name ########## */ }<CustomTextInput        label="Name"        maxLength={20}        stateHolder={this}        stateFieldName="name"      />      { /* ########## Cuisine ########## */ }<Text style={styles.fieldLabel}>Cuisine</Text><View style={styles.pickerContainer}><Picker          style={styles.picker}          prompt="Cuisine"          selectedValue={this.state.cuisine}          onValueChange={            (inItemValue) => this.setState({ cuisine : inItemValue })          }><Picker.Item label="" value="" /><Picker.Item label="Algerian" value="Algerian" /><Picker.Item label="American" value="American" /><Picker.Item label="BBQ" value="BBQ" /><Picker.Item label="Belgian" value="Belgian" /><Picker.Item label="Brazilian" value="Brazilian" /><Picker.Item label="British" value="British" /><Picker.Item label="Cajun" value="Cajun" /><Picker.Item label="Canadian" value="Canadian" /><Picker.Item label="Chinese" value="Chinese" /><Picker.Item label="Cuban" value="Cuban" /><Picker.Item label="Egyptian" value="Egyptian" /><Picker.Item label="Filipino" value="Filipino" /><Picker.Item label="French" value="French" /><Picker.Item label="German" value="German" /><Picker.Item label="Greek" value="Greek" /><Picker.Item label="Haitian" value="Haitian" /><Picker.Item label="Hawaiian" value="Hawaiian" /><Picker.Item label="Indian" value="Indian" /><Picker.Item label="Irish" value="Irish" /><Picker.Item label="Italian" value="Italian" /><Picker.Item label="Japanese" value="Japanese" /><Picker.Item label="Jewish" value="Jewish" /><Picker.Item label="Kenyan" value="Kenyan" /><Picker.Item label="Korean" value="Korean" /><Picker.Item label="Latvian" value="Latvian" /><Picker.Item label="Libyan" value="Libyan" /><Picker.Item label="Mediterranean" value="Mediterranean" /><Picker.Item label="Mexican" value="Mexican" /><Picker.Item label="Mormon" value="Mormon" /><Picker.Item label="Nigerian" value="Nigerian" /><Picker.Item label="Other" value="Other" /><Picker.Item label="Peruvian" value="Peruvian" /><Picker.Item label="Polish" value="Polish" /><Picker.Item label="Portuguese" value="Portuguese" /><Picker.Item label="Russian" value="Russian" /><Picker.Item label="Salvadorian" value="Salvadorian" /><Picker.Item label="Sandwiche Shop" value="Sandwiche Shop" /><Picker.Item label="Scottish" value="Scottish" /><Picker.Item label="Seafood" value="Seafood" /><Picker.Item label="Spanish" value="Spanish" /><Picker.Item label="Steak House" value="Steak House" /><Picker.Item label="Sushi" value="Sushi" /><Picker.Item label="Swedish" value="Swedish" /><Picker.Item label="Tahitian" value="Tahitian" /><Picker.Item label="Thai" value="Thai" /><Picker.Item label="Tibetan" value="Tibetan" /><Picker.Item label="Turkish" value="Turkish" /><Picker.Item label="Welsh" value="Welsh" /></Picker></View>      { /* ########## Price ########## */ }<Text style={styles.fieldLabel}>Price</Text><View style={styles.pickerContainer}><Picker          style={styles.picker}          selectedValue={this.state.price}          prompt="Price"          onValueChange={            (inItemValue) => this.setState({ price : inItemValue })          }><Picker.Item label="" value="" /><Picker.Item label="1" value="1" /><Picker.Item label="2" value="2" /><Picker.Item label="3" value="3" /><Picker.Item label="4" value="4" /><Picker.Item label="5" value="5" /></Picker></View>      { /* ########## Rating ########## */ }<Text style={styles.fieldLabel}>Rating</Text><View style={styles.pickerContainer}><Picker          style={styles.picker}          selectedValue={this.state.rating}          prompt="Rating"          onValueChange={            (inItemValue) => this.setState({ rating : inItemValue })          }><Picker.Item label="" value="" /><Picker.Item label="1" value="1" /><Picker.Item label="2" value="2" /><Picker.Item label="3" value="3" /><Picker.Item label="4" value="4" /><Picker.Item label="5" value="5" /></Picker></View>      { /* ########## Phone ########## */ }<CustomTextInput        label="Phone Number"        maxLength={20}        stateHolder={this}        stateFieldName="phone"      />      { /* ########## Address ########## */ }<CustomTextInput        label="Address"        maxLength={20}        stateHolder={this}        stateFieldName="address"      />      { /* ########## Web Site ########## */ }<CustomTextInput        label="Web Site"        maxLength={20}        stateHolder={this}        stateFieldName="webSite"      />      { /* ########## Delivery ########## */ }<Text style={styles.fieldLabel}>Delivery?</Text><View style={styles.pickerContainer}><Picker          style={styles.picker}          prompt="Delivery?"          selectedValue={this.state.delivery}          onValueChange={            (inItemValue) => this.setState({ delivery : inItemValue })          }><Picker.Item label="" value="" /><Picker.Item label="Yes" value="Yes" /><Picker.Item label="No" value="No" /></Picker></View></View>    { /* ########## Buttons ########## */ }<View style={styles.addScreenButtonsContainer}><CustomButton        text="Cancel"        width="44%"        onPress={          () => { this.props.navigation.navigate("ListScreen"); }        }      /><CustomButton        text="Save"        width="44%"        onPress={ () => {          AsyncStorage.getItem("restaurants",            function(inError, inRestaurants) {              if (inRestaurants === null) {                inRestaurants = [ ];              } else {                inRestaurants = JSON.parse(inRestaurants);              }              inRestaurants.push(this.state);              AsyncStorage.setItem("restaurants",                JSON.stringify(inRestaurants), function() {                  this.props.navigation.navigate("ListScreen");                }.bind(this)              );            }.bind(this)          );        } }      /></View></View></ScrollView>

); } /* End render(). */

} /* End AddScreen. *


How to use google maps offline in react native

$
0
0

I'm trying to enable users to use maps offline in my react native App, I'm using react-native-maps

I want to provide the offline mode just for a predefined area (let's say a city), therefore I need to download all the needed tiles which will be a huge number of images, so I wonder if there is a way in the google map API to download an area of the map (like in google map app)?
from the documentation it is possible to enable caching, which I do the same thing (according to the doc) however, In my case I don't want to cache every place that the user go to, as I said I just want to cache/download a predefined area.
EDIT 1
react-native-maps support offline navigation for that, I need to use this code :

<LocalTile pathTemplate={this.state.pathTemplate} tileSize={256}/>

with pathTemplate point to my tiles location which had to have the following hierarchy :

location/{z}/{x}/{y}

therefore my real probleme is how to get the tiles for my area.
I can do it manually by saving tiles from the google maps tile server, however I don't know if it is legal and also it will take a lot of time and calculation (when zooming in, I need to calculate the coordinated of the next tiles )
so It will be nice, if google map API provide a way to download an area's tile (with needed zoom),
another alternative would be using another map provider like OpenStreetMAp, but here also, I need to find a way to download all tiles at once

React Native android TextInput fail to show keyboard

$
0
0

I am facing some issue with react native textInput.

TextInput was working fine before I added createBottomTabNavigation. It worked fine on IOS but not the Android. I created a sample component and the issue persist.The issue here:

  1. when TextInput field is clicked on at SamplePage Component, the page just kinda blink and the keyboard retreat.

Here is an image of the issue on my real android device:react-native android app

And here are my codes:

import React from 'react';import 'react-native-gesture-handler';import {  SafeAreaView,  StyleSheet,  ScrollView,  View,  Text,  StatusBar,  TouchableOpacity,  TextInput,} from 'react-native';import { NavigationContainer } from '@react-navigation/native';import { useNavigation } from '@react-navigation/native';import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';import Ionicons from 'react-native-vector-icons/Ionicons';import ContextApp from '../../context/contextApp';import PremiumScreen from './premiumScreen';import SettingsPage from '../setting/settingsPage';import ProfileContainer from '../profile/profileContainer';  const MainPage = () => {    const Pages = () => {      return (<SafeAreaView><StatusBar barStyle="dark-content"         backgroundColor="white"/><ScrollView                contentInsetAdjustmentBehavior="automatic"                alwaysBounceVertical={false}                style={styles.scrollView}><View style={styles.container}><View style={styles.partsView}><Text style={styles.sectionTitle}>Call Someone Today!</Text><View style={styles.switch}><Text style={styles.sectionDescription}>Go Online! </Text><Switch                              style={styles.switchButton}                              trackColor={{ false: "#767577", true: "#81b0ff" }}                              thumbColor={isEnabled ? "#f5dd4b" : "#f4f3f4"}                              ios_backgroundColor="#3e3e3e"                              onValueChange={toggleSwitch}                              value={isEnabled}                          /></View><Text style={styles.sectionTitle}>OR</Text></View></View></ScrollView></SafeAreaView>        )      }    const SamplePage = () => {      return (<View><TextInput          placeholder="Can't type me"          style={{            backgroundColor: 'white',            width: '100%',            height: 40,            paddingLeft: 15,            fontSize: 20,            paddingBottom: 5,            paddingTop: 5,            color: 'grey'          }}></TextInput></View>      )    }      const Tab = createBottomTabNavigator();    return (<NavigationContainer><Tab.Navigator        screenOptions={({ route }) => ({          tabBarIcon: ({ focused, color, size }) => {            let iconName: string;            if (route.name === 'Home') {              iconName = focused                ? 'ios-people'                : 'ios-people';            } else if (route.name === 'Premium') {              iconName = focused ? 'ios-star' : 'ios-star-outline';            } else if (route.name === 'Settings') {              iconName = focused ? 'ios-settings' : 'ios-settings';            } else if (route.name === 'Profile') {              iconName = focused ? 'ios-contact' : 'ios-contact';            } else if (route.name === 'SamplePage') {              iconName = focused ? 'ios-star' : 'ios-star-outline';            }            // You can return any component that you like here!            return <Ionicons name={iconName} size={size} color={color} />;          },        })}        tabBarOptions={{          activeTintColor: 'tomato',          inactiveTintColor: 'gray',        }}><Tab.Screen name="Home" component={Pages} /><Tab.Screen name="Premium" component={PremiumScreen} /><Tab.Screen name="Settings" component={SettingsPage} /><Tab.Screen name="Profile" component={ProfileContainer} /><Tab.Screen name="SamplePage" component={SamplePage} /></Tab.Navigator></NavigationContainer>      );  };const styles = StyleSheet.create({    scrollView: {      height: '100%',    },    // rest of styles  });  export default MainPage;

My dependencies:

"dependencies": {"@react-native-community/masked-view": "^0.1.10","@react-native-community/picker": "^1.6.4","@react-navigation/bottom-tabs": "^5.5.1","@react-navigation/native": "^5.2.6","@react-navigation/stack": "^5.3.2","@types/react-native-vector-icons": "^6.4.5","@types/shortid": "0.0.29","@types/yup": "^0.29.3","axios": "^0.19.2","formik": "^2.1.4","moment": "^2.27.0","react": "16.11.0","react-native": "0.62.2","react-native-gesture-handler": "^1.6.1","react-native-image-crop-picker": "^0.32.0","react-native-image-picker": "^2.3.1","react-native-linear-gradient": "^2.5.6","react-native-permissions": "^2.1.5","react-native-reanimated": "^1.8.0","react-native-safe-area-context": "^1.0.0","react-native-screens": "^2.7.0","react-native-sideswipe": "^1.5.0","react-native-vector-icons": "^6.6.0","react-native-webview": "^9.4.0","shortid": "^2.2.15","yup": "^0.29.1"  },

Need some help solving this issue! Thanks in advance!

Fresh react native app is throwing an error with android emulator

$
0
0

Error

I've made a new React Native project using npx react-native init AwesomeProject. This is the error I'm getting and I can't find out why. Any suggestions? Mind you this is a brand new project. I execute the new command and then tried to start.

Implementing Deep link url cause react native app fail to open android

$
0
0

I am trying to implement deep link to my react native app.The problem is I got an error when I tried open the link when my app is at background The error is

undefined is not an object (evaluating 'this.props')

It works fine if my app is not on background (the app is not running)

My initial route is App showing about 2.5sec splash screen before it redirect to specific route depending if the user is login or not, if the user login then it will redirect to Main route, otherwise to login route.

This my App Route

function mapStateToProps (state) {  return {    deviceVersion: state.device.version,    auth: {      form: {        isFetching: state.auth.form.isFetching      }    },    global: state.global,    search: state.search  }}function mapDispatchToProps (dispatch) {  return {    actions: bindActionCreators({ ...authActions, ...deviceActions, ...globalActions, ...searchActions }, dispatch)  }}var reactMixin = require('react-mixin')import TimerMixin from 'react-timer-mixin'

My componentDidMount function

componentDidMount () {            this.setTimeout(                    () => {                      this.props.actions.getSessionToken()                      this.props.actions.setHeight(height)                      this.props.actions.getIp()                      this.props.actions.getUniqueId()                      this.props.actions.getLanguage()                    },                    2500                )

Render function

render () {    return (<View style={styles.container}><StatusBar          backgroundColor="#b33939"        /><View style={{flex:1}}><Header isFetching={this.props.auth.form.isFetching}          showState={this.props.global.showState}          currentState={this.props.global.currentState}          onGetState={this.props.actions.getState}          onSetState={this.props.actions.setState} /></View><View style={{flex:1}}><Text style={styles.summary}>Welcome</Text></View></View>    )  }}reactMixin(App.prototype, TimerMixin)export default connect(mapStateToProps, mapDispatchToProps)(App)

When I implement Deeplink I add Linking Listener to my componentDidMount function to handle the url, and I move some actions inside timeout to handleOpenURL function

componentDidMount () {    Linking.getInitialURL()            .then(url => this.handleOpenURL({ url }))            .catch(console.error);    Linking.addEventListener('url', this.handleOpenURL);  }

handleOpenURL function looks like this

handleOpenURL(event) {    console.log('URL', event)    if(!_.isNull(event.url))    {      var url = event.url      var removeDomain = url.replace("https://www.example.com/", "")      console.log(removeDomain)      var lastChar = removeDomain[removeDomain.length -1];      if(lastChar != '/')      {        var data = removeDomain.split("/")        if(data[0] == 'listing')        {          this.props.actions.openListingDetail(data[1], null)        }      }    }else{      this.setTimeout(            () => {              this.props.actions.getSessionToken()              this.props.actions.setHeight(height)              this.props.actions.getIpAdd()              this.props.actions.getUniqueId()              this.props.actions.getLanguage()            },            2500        )    }  }

getSessionToken function is to check if the user login.and I am using react router flux

This works fine if the app is not currently running. The Url open listing route correctly.This also works fine if open normally without deep link url.But I got an error when the app is on background, it cant execute this.props.actions.openListingDetail(data[1], null)The error message

undefined is not an object (evaluating 'this.props')

Any idea Whats wrong ?

'installDebug' not found in root project 'android' React Native

$
0
0

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

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

If I run ./gradlew tasks I get:

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

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

Viewing all 28486 articles
Browse latest View live


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