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

react-native Task :app:multiDexListDebug FAILED

$
0
0

I have installed react-native-firebase package using yarn. I've setup the code in the build.gradle, settings.gradle as well as the AndroidManifest as well. Added multiDexEnabled as true and also added the implementation line in the code, but it is still not working.

build.gradle (App Level)

apply plugin: "com.android.application"import com.android.build.OutputFile/** * The react.gradle file registers a task for each build variant (e.g. bundleDebugJsAndAssets * and bundleReleaseJsAndAssets). * These basically call `react-native bundle` with the correct arguments during the Android build * cycle. By default, bundleDebugJsAndAssets is skipped, as in debug/dev mode we prefer to load the * bundle directly from the development server. Below you can see all the possible configurations * and their defaults. If you decide to add a configuration block, make sure to add it before the * `apply from: "../../node_modules/react-native/react.gradle"` line. * * project.ext.react = [ *   // the name of the generated asset file containing your JS bundle *   bundleAssetName: "index.android.bundle", * *   // the entry file for bundle generation. If none specified and *   // "index.android.js" exists, it will be used. Otherwise "index.js" is *   // default. Can be overridden with ENTRY_FILE environment variable. *   entryFile: "index.android.js", * *   // https://facebook.github.io/react-native/docs/performance#enable-the-ram-format *   bundleCommand: "ram-bundle", * *   // whether to bundle JS and assets in debug mode *   bundleInDebug: false, * *   // whether to bundle JS and assets in release mode *   bundleInRelease: true, * *   // whether to bundle JS and assets in another build variant (if configured). *   // See http://tools.android.com/tech-docs/new-build-system/user-guide#TOC-Build-Variants *   // The configuration property can be in the following formats *   //         'bundleIn${productFlavor}${buildType}' *   //         'bundleIn${buildType}' *   // bundleInFreeDebug: true, *   // bundleInPaidRelease: true, *   // bundleInBeta: true, * *   // whether to disable dev mode in custom build variants (by default only disabled in release) *   // for example: to disable dev mode in the staging build type (if configured) *   devDisabledInStaging: true, *   // The configuration property can be in the following formats *   //         'devDisabledIn${productFlavor}${buildType}' *   //         'devDisabledIn${buildType}' * *   // the root of your project, i.e. where "package.json" lives *   root: "../../", * *   // where to put the JS bundle asset in debug mode *   jsBundleDirDebug: "$buildDir/intermediates/assets/debug", * *   // where to put the JS bundle asset in release mode *   jsBundleDirRelease: "$buildDir/intermediates/assets/release", * *   // where to put drawable resources / React Native assets, e.g. the ones you use via *   // require('./image.png')), in debug mode *   resourcesDirDebug: "$buildDir/intermediates/res/merged/debug", * *   // where to put drawable resources / React Native assets, e.g. the ones you use via *   // require('./image.png')), in release mode *   resourcesDirRelease: "$buildDir/intermediates/res/merged/release", * *   // by default the gradle tasks are skipped if none of the JS files or assets change; this means *   // that we don't look at files in android/ or ios/ to determine whether the tasks are up to *   // date; if you have any other folders that you want to ignore for performance reasons (gradle *   // indexes the entire tree), add them here. Alternatively, if you have JS files in android/ *   // for example, you might want to remove it from here. *   inputExcludes: ["android/**", "ios/**"], * *   // override which node gets called and with what additional arguments *   nodeExecutableAndArgs: ["node"], * *   // supply additional arguments to the packager *   extraPackagerArgs: [] * ] */project.ext.react = [    enableHermes: false,  // clean and rebuild if changing]apply from: "../../node_modules/react-native/react.gradle"/** * Set this to true to create two separate APKs instead of one: *   - An APK that only works on ARM devices *   - An APK that only works on x86 devices * The advantage is the size of the APK is reduced by about 4MB. * Upload all the APKs to the Play Store and people will download * the correct one based on the CPU architecture of their device. */def enableSeparateBuildPerCPUArchitecture = false/** * Run Proguard to shrink the Java bytecode in release builds. */def enableProguardInReleaseBuilds = false/** * The preferred build flavor of JavaScriptCore. * * For example, to use the international variant, you can use: * `def jscFlavor = 'org.webkit:android-jsc-intl:+'` * * The international variant includes ICU i18n library and necessary data * allowing to use e.g. `Date.toLocaleString` and `String.localeCompare` that * give correct results when using with locales other than en-US.  Note that * this variant is about 6MiB larger per architecture than default. */def jscFlavor = 'org.webkit:android-jsc:+'/** * Whether to enable the Hermes VM. * * This should be set on project.ext.react and mirrored here.  If it is not set * on project.ext.react, JavaScript will not be compiled to Hermes Bytecode * and the benefits of using Hermes will therefore be sharply reduced. */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.safetravel_100"        minSdkVersion rootProject.ext.minSdkVersion        targetSdkVersion rootProject.ext.targetSdkVersion        versionCode 1        versionName "1.0"        multiDexEnabled true    }    splits {        abi {            reset()            enable enableSeparateBuildPerCPUArchitecture            universalApk false  // If true, also generate a universal APK            include "armeabi-v7a", "x86", "arm64-v8a", "x86_64"        }    }    signingConfigs {        debug {            storeFile file('debug.keystore')            storePassword 'android'            keyAlias 'androiddebugkey'            keyPassword 'android'        }    }    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 project(':react-native-geocoder')    implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.0.0"    implementation 'androidx.multidex:multidex:2.0.0'    debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {      exclude group:'com.facebook.fbjni'    }    debugImplementation("com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}") {        exclude group:'com.facebook.flipper'    }    debugImplementation("com.facebook.flipper:flipper-fresco-plugin:${FLIPPER_VERSION}") {        exclude group:'com.facebook.flipper'    }    if (enableHermes) {        def hermesPath = "../../node_modules/hermes-engine/android/";        debugImplementation files(hermesPath +"hermes-debug.aar")        releaseImplementation files(hermesPath +"hermes-release.aar")    } else {        implementation jscFlavor    }}// Run this once to be able to run the application with BUCK// puts all compile dependencies into folder libs for BUCK to usetask copyDownloadableDepsToLibs(type: Copy) {    from configurations.compile    into 'libs'}apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)apply plugin: 'com.google.gms.google-services'

build.gradle (Project Level)

// 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.6.3')        classpath 'com.google.gms:google-services:4.2.0'   //added        // 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' }    }}

Changing app navigation structure from version 4 to 5 in react native

$
0
0

I was working on an old app using react navigation version 4 the app contains a register and login in page obviously and then the content of the app.

recently I started remaking the content of the app using react navigation version 5 in order to use the shared element animation and the bottom tab navigator and it was fairly simple.

but I struggled with converting the login part to version 5 since the app structure is somewhat complicated and I am somewhat new to react navigation version 5.

i will leave a figure of the app structure bellow a long with samples of the code used.

Navigation used in the app

App.js :

import { setNavigator } from "./app/navigationRef";const articleListFlow = createStackNavigator({  Main: MainScreen, // screen with diffrent articles categories  ResultsShow: ResultShowScreen, // article details screen});const loginFlow = createStackNavigator({  Signup: SignupScreen,  Signin: SigninScreen,});loginFlow.navigationOptions = () => {  return {    headerShown: false,  };};articleListFlow.navigationOptions = {  title: "News Feed",  tabBarIcon: ({ tintColor }) => (<View><Icon style={[{ color: tintColor }]} size={25} name={"ios-cart"} /></View>  ),  activeColor: "#ffffff",  inactiveColor: "#ebaabd",  barStyle: { backgroundColor: "#d13560" },};const switchNavigator = createSwitchNavigator({  ResolveAuth: ResolveAuthScreen,  MainloginFlow: createSwitchNavigator({    //WelcomeScreen: WeclomeScreen,    loginFlow: loginFlow,  }),  mainFlow: createMaterialBottomTabNavigator(    {      articleListFlow: articleListFlow,      ArticleSave: ArticleSaveScreen, // we dont need this one      Account: AccountScreen,    },    {      activeColor: "#ffffff",      inactiveColor: "#bda1f7",      barStyle: { backgroundColor: "#6948f4" },    }  ),});const App = createAppContainer(switchNavigator);export default () => {  return (<AuthProvider><App        ref={(navigator) => {          setNavigator(navigator);        }}      /></AuthProvider>  );};

NavigationRef.js :

import { NavigationActions } from "react-navigation";let navigator;export const setNavigator = (nav) => {  navigator = nav;};export const navigate = (routeName, params) => {  navigator.dispatch(    NavigationActions.navigate({      routeName,      params,    })  );};// routename is the name of the routes singin singup accountscreen// params information we want to pass to the screen we want to show

AuthContext.js

import { AsyncStorage } from "react-native";import createDataContext from "./createDataContext";import userAPI from "../api/user";// using navigate to access the navigator and redirect the userimport { navigate } from "../navigationRef";// AUTHENTICATION REDUCERSconst authReducer = (state, action) => {  switch (action.type) {    case "add_error": {      return {        ...state,        errorMessage: action.payload,      };    }    case "clear_error_message": {      return {        ...state,        errorMessage: "",      };    }    case "signin": {      return {        errorMessage: "",        token: action.payload,      };    }    default:      return state;  }};// CLEARING ERROR MESSAGES WHEN SWITCHING SIGNIN-SIGNUPconst clearErrorMessage = (dispatch) => () => {  dispatch({ type: "clear_error_message" });};// AUTOMATIC SIGNIN ONLY USING TOKENS ON USER DEVICEconst tryLocalSignin = (dispatch) => async () => {  const token = await AsyncStorage.getItem("token");  if (token) {    // if token exists    dispatch({ type: "signin", payload: token });    navigate("Main");  } else {    // if token doesnt exist    navigate("WelcomeScreen");  }};// SIGNUPconst signup = (dispatch) => async ({ email, password }) => {  try {    const response = await userAPI.post("/signup", { email, password });    await AsyncStorage.setItem("token", response.data.token);    dispatch({ type: "signin", payload: response.data.token });    // making use of the navigate component to access navigation    // and redirect the user    navigate("Main");  } catch (err) {    dispatch({      type: "add_error",      payload: "Something went wrong with sign up",    });  }};// SIGNINconst signin = (dispatch) => async ({ email, password }) => {  try {    const response = await userAPI.post("/signin", { email, password });    await AsyncStorage.setItem("token", response.data.token);    // using signin since the logic is the same    dispatch({ type: "signin", payload: response.data.token });    // making use of the navigate component to access navigation    // and redirect the user    navigate("Main");  } catch (err) {    console.log(err);    dispatch({      type: "add_error",      payload: "Something went wrong with sign in",    });  }};// SIGNOUTconst signout = (dispatch) => async () => {  // removing the token makes identification not work again  await AsyncStorage.removeItem("token");  dispatch({ type: "signout" });  navigate("loginFlow");};// CREATING CONTEXT AND PROVIDER OBJECTS FOR AUTHENTICATIONexport const { Provider, Context } = createDataContext(  authReducer,  {    signin,    signup,    signout,    clearErrorMessage,    tryLocalSignin,  },  {    token: null,    errorMessage: "",  });

createDataContext.js

import React, { useReducer } from "react";export default (reducer, actions, defaultValue) => {  const Context = React.createContext();  const Provider = ({ children }) => {    const [state, dispatch] = useReducer(reducer, defaultValue);    const boundActions = {};    for (let action in actions) {      // for every action in the actions, call it with dispatch      boundActions[action] = actions[action](dispatch);    }    return (<Context.Provider value={{ state, ...boundActions }}>        {children}</Context.Provider>    );  };  return { Context, Provider };};

My appologies for the long code and thank you in advance for anyone who can help.

ios Getting Location react-native/Expo

$
0
0

I am building an app totally depending on the users location, the app takes latitude and longitude of the user and depends on that retrieve the data for user

The app is working well with android but with ios is not getting the location of the user

any possible solution or something might be missed ?

and this is my code .... and this is the error

[Unhandled promise rejection: Error: Cannot obtain current location: Error Domain=kCLErrorDomain Code=0 "(null)"]

import * as Location from 'expo-location';import * as Permissions from 'expo-permissions';const getLocation = dispatch => async () => {    let {status} = await Location.requestPermissionsAsync(Permissions.LOCATION);    if (status === !'granted') {        dispatch({type: 'add_error' , error : 'Permission to access location denied'});    }    navigate('Home');    let location = await Location.getCurrentPositionAsync({});    dispatch({type : 'get_location' , payload : location});       dispatch({type : 'lat_value', payload : location.coords.latitude});    dispatch({type : 'long_value', payload : location.coords.longitude});    let keys = {        latitude : location.coords.latitude,        longitude : location.coords.longitude            }    await AsyncStorage.setItem('lat', JSON.stringify(location.coords.latitude));    await AsyncStorage.setItem('lng', JSON.stringify(location.coords.longitude));    const place = await Location.reverseGeocodeAsync(keys, 'en');        place.find( p => {            stateName =             p.region +'';            area = p.city;            country = p.country;        });        dispatch({type : 'set_country', payload: place.country});              dispatch({type: 'area' , payload : area});

Expo - geofence api not returning values on geofence start

$
0
0

I am attempting to get Expo's geofencing api up and running via a button action in react native.

I've put together an example, but when I attempt to initiate the geofencing action it doesn't do anything. I receive no notification if I am inside or outside a region. Was hoping to get some guidance on this. I can't find a working example. I've already found the following posts that don't seem to work:

Expo startGeofencingAsync not starting

Expo - increase location accuracy with Geofence

App.js

import { StyleSheet, Text, View, Button } from 'react-native';import React, { Component } from 'react';import * as Permissions from 'expo-permissions';import * as Location from 'expo-location';import * as TaskManager from 'expo-task-manager';class App extends Component {state= {  point : {latitude: 0, longitude: 0},  hasLocationPermission: null,  location: null}async componentDidMount() {  this.getLocationsPermissions();  //Permissions.askAsync(Permissions.LOCATION);  //await Location.startLocationUpdatesAsync('firstTask', {  //  accuracy: Location.Accuracy.Balanced,  //});}//update location pointsgetCurrentLoc = async () => {  console.log('retrieving points');  let location = await Location.getCurrentPositionAsync({});  location =  await JSON.stringify(location);  location = await eval( '('+'['+ location +']'+')' );  this.setState({ location: location })}//ask for location permissions getLocationsPermissions = async () => {  let { status } = await Permissions.askAsync(Permissions.LOCATION);  //status && console.log('location: ', status)  if (status !== 'granted') {    this.setState({      errorMessage: 'Permission to access location was denied',    });    } else {      this.setState({ hasLocationPermission : status })    }}_startGeofence = async () => {  console.log('starting geofencing test ...')  Location.startGeofencingAsync('geofence',    [    {      latitude: 40.763882,      longitude: -73.929893,      radius: 50     }     ]    );};  render() {    return (<View><Text>geofence test</Text><Button           onPress={this._startGeofence}          title="AM-I-IN-THE-REGION?"        /><Text>{this.state.location ? `my current location is lat: ${this.state.location[0].coords.latitude}` : `none`}</Text></View>    );  }}export default App;TaskManager.defineTask("geofence", ({ data: { eventType, region }, error }) => {  if (error) {    // check `error.message` for more details.    return;  }  if (eventType === Location.GeofencingEventType.Enter) {    console.log("You've entered region:", region);  } else if (eventType === Location.GeofencingEventType.Exit) {    console.log("You've left region:", region);  }});

React Native iOS simulator "Connect to Metro to Develop Javascript"

$
0
0

I'm running a react native app and constantly running into the issue of the app not connecting to the code to do automatic updates.

Things I've tried:

  • Reloading main.jsbundle via the following command: npx react-native bundle --entry-file index.js --platform ios --dev false --bundle-output ios/main.jsbundle --assets-dest ios/assets
  • Completely removing node and react native from my computer
  • Restarting my computer
  • Running on a physical device and running on the simulator
  • Cleaning derived data in Xcode

This is the screen on starting up, which offers the advice, "Connect to Metro to develop JavaScript."

Connect to Metro to develop JavaScript.

From the metro bundler that automatically starts up, I get this message when I type 'r' to reload that says, "React Native: No apps connected."

"No apps connected"

I'm using 0.61 and always have been.

What else should I try?

EDIT

I was able to get it working by restarting my computer (again).

Every once in a while, a restart does the trick, yet most of the time it doesn't work. There still has to be a more reliable way of fixing this.

What's a good way to store a lot of small texts with metadata with reactNative?

$
0
0

I am developing an app that will displays a series of small texts everyday and I have been wondering what's the best way to store them. I intend to change them only when I update it to new versions so.

OAuth2 Authorization Flow for Yahoo using Expo AuthSession API

$
0
0

Expo SDK Version: 37.0.3Platforms(Android/iOS/web/all): iOS

Hello, I am trying to build a fantasy basketball app based on the Yahoo Fantasy API. I am trying to use AuthSession API from expo in order to do the OAuth Authentication process listed here. I am able to get the Authorization code from yahoo after the user authenticates using AuthSession, I then need to take that code and send it to the OAuth 2.0 Token Endpoint: using the HTTP Post method. I send the data using fetch and I am getting the error below back:

{ "error": "INVALID_AUTHORIZATION_CODE","error_description": "OAuth authorization code expired or invalid",}

I've pasted my code for the signIn() function below. Please let me know if you have any pointers as to how I can clear this error and get the Access token.

import React, { useEffect, useState } from 'react';import {View, Text, TouchableOpacity, Alert } from 'react-native';import * as WebBrowser from 'expo-web-browser';import { makeRedirectUri,  useAuthRequest } from 'expo-auth-session';import { Base64 } from 'js-base64';const useProxy = true;const redirectUri = makeRedirectUri({ useProxy });const CLIENT_ID = *scrambledcleintid*const CLIENT_SECRET = *scrambledclientsecret*function SignIn({ navigation }) {  WebBrowser.maybeCompleteAuthSession();  var code;  const discovery = {      authorizationEndpoint: 'https://api.login.yahoo.com/oauth2/request_auth',      tokenEndpoint: 'https://api.login.yahoo.com/oauth2/get_token'  };//request  const [request, result, promptAsync] = useAuthRequest({      clientId: CLIENT_ID,      clientSecret: CLIENT_SECRET,      scopes: ["openid"],       responseType:'code',      redirectUri, //will likely need to change for production      extraParams: {          // ideally, this will be a random value          nonce: "nonce",        },  },discovery);useEffect(() => {if (result) {        if (result.error) {          Alert.alert("Authentication error",            result.params.error_description || "something went wrong"          );          return;        }        if (result.type === "success") {          code = result.params.code;          getTokens();          //const { name } = code;          //setName(name);        }      }    }, [result]);    const getTokens = async () => {      try {        const authcode = Base64.encode(`${CLIENT_ID}:${CLIENT_SECRET}`);        const bodystr = `code=${code}&grant_type=authorization_code&redirect_uri=${redirectUri}`;        const response = await fetch('https://api.login.yahoo.com/oauth2/get_token', {          method: 'POST',          headers: {            Authorization : `Basic ${authcode}`,'Content-Type' : 'application/x-www-form-urlencoded',          },              body: bodystr        });        const responseJson = await response.json();         } catch (err) {        console.error(err);      }    }  return (<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}><Text>Sign In screen</Text><TouchableOpacity        style = {styles.button}        onPress={() => promptAsync({ useProxy, redirectUri })}><Text style={styles.buttonText}>Sign In</Text> </TouchableOpacity></View>  );}export default SignIn;

React native app working in IOS simulator not installing in testflight

$
0
0

My IOS app developed in react native working in the simulator but not working in Testflight.

When clicking on install, Install progress shows after that showing install.


Pod issue -: Nanaimo::Reader::ParseError - [!] Array missing ',' in between objects

$
0
0

I'm getting issue during install pod in react-native project

Nanaimo::Reader::ParseError - [!] Array missing ',' in between objectsplease help me if anyone have idea about that.

enter image description here

3D Animations on View with React Native

$
0
0

I want to implement a flip effect in my React Native app, similar like described here:

https://www.codementor.io/reactjs/tutorial/building-a-flipper-using-react-js-and-less-css

My question is. Can I achieve it somehow with the help of some library like 'Animations'https://facebook.github.io/react-native/docs/animations.html or I have to play with 'plain' CSS styles.

What is the 'good practive' for such animations in React Native?

class CardBack extends Component {  render() {    return (<TouchableOpacity onPress={this.flip}><View style={styles.scrumCardBorder}><View style={styles.cardBack}></View></View></TouchableOpacity>    );  }  flip() {    this.setState({flipped: !this.state.flipped})  }}class CardFront extends Component {  render() {    return (<TouchableOpacity><View style={styles.scrumCardBorder}><View style={styles.cardFront}><Text style={styles.cardValue}>5</Text></View></View></TouchableOpacity>    );  }}

How to use KeyboardAvoidingView with FlatList?

$
0
0

I have a FlatList component with an Input inside each row. When I select the input I want it to scroll up above the keyboard.

My code:

return (<KeyboardAvoidingView behavior='padding' style={{ flex: 1 }} ><FlatList      style={{ flex: 1, backgroundColor: '#fff' }}      data={ds}      renderItem={({ item }) => <ListItem data={item} />}      ListFooterComponent={this.renderButton}    /></KeyboardAvoidingView>);

In this scenario, the FlatList is never loaded. When I delete flex:1 from both components, FlatList renders properly but selecting an Input does not make it scroll up

What is the meaning of 'No bundle URL present' in react-native?

$
0
0

When I run a react-native project, I get a error no bundle URL present , but I don't know what mistakes I do, I was very confused.

enter image description here

ld: library not found for -lRCTGeolocation error after upgrading to 60.5

$
0
0

I upgrade my react native project to 60.5 and after that I get this error building iOS XcodeSpace

ld: library not found for -lRCTGeolocation

using sys root for 'iPhoneSimulator' but targeting 'MacOSX' warning in NPM install

$
0
0

for some reason I'm not able to do NPM install on my project anymore since I'm getting the following messages:

  SOLINK_MODULE(target) Release/.nodeclang: warning: using sysroot for 'iPhoneSimulator' but targeting 'MacOSX' [-Wincompatible-sysroot]ld: warning: building for macOS, but linking in .tbd file (/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs/iPhoneSimulator13.5.sdk/usr/lib/libc++.tbd) built for iOS Simulatorld: warning: building for macOS, but linking in .tbd file (/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs/iPhoneSimulator13.5.sdk/usr/lib/libSystem.tbd) built for iOS Simulatorld: warning: building for macOS, but linking in .tbd file (/usr/lib/system/libcache.dylib) built for iOS Simulatorld: warning: building for macOS, but linking in .tbd file (/usr/lib/system/libcommonCrypto.dylib) built for iOS Simulatorld: warning: building for macOS, but linking in .tbd file (/usr/lib/system/libcompiler_rt.dylib) built for iOS Simulatorld: warning: building for macOS, but linking in .tbd file (/usr/lib/system/libcopyfile.dylib) built for iOS Simulatorld: warning: bui

How to fix this???? I have tried uninstalling node and reinstalling node but I'm still getting the same error.

react native edit file after build

$
0
0

Is there any way to edit a json file after the app was build? I heard that an apk file can be unzipped, but how about IOS? My goal is to make an app that can be changed by a non-programmer, after it was finished. Adding assets would be also good, but I don't think I would be possible.


react-native google sign issue on IOS

$
0
0

I have followed the the steps on how to add this plugin. It works perfectly well on Android, however on iOS when I run react-native run-ios i get the following error:

The following build commands failed: CompileC /Users/joeabdelsater/Library/Developer/Xcode/DerivedData/karya-arjazwuuyvljfrfxdrikbhslvzgv/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/AppAuth.build/Objects-normal/x86_64/OIDAuthorizationService+IOS.o /Users/joeabdelsater/Documents/apps/react-native/karya/karyagit/ios/Pods/AppAuth/Source/iOS/OIDAuthorizationService+IOS.m normal x86_64 objective-c com.apple.compilers.llvm.clang.1_0.compiler(1 failure)

My podfile.lock is below:

PODS:  - AppAuth (1.3.1):    - AppAuth/Core (= 1.3.1)    - AppAuth/ExternalUserAgent (= 1.3.1)  - AppAuth/Core (1.3.1)  - AppAuth/ExternalUserAgent (1.3.1)  - GoogleSignIn (5.0.2):    - AppAuth (~> 1.2)    - GTMAppAuth (~> 1.0)    - GTMSessionFetcher/Core (~> 1.1)  - GTMAppAuth (1.0.0):    - AppAuth/Core (~> 1.0)    - GTMSessionFetcher (~> 1.1)  - GTMSessionFetcher (1.4.0):    - GTMSessionFetcher/Full (= 1.4.0)  - GTMSessionFetcher/Core (1.4.0)  - GTMSessionFetcher/Full (1.4.0):    - GTMSessionFetcher/Core (= 1.4.0)  - RNGoogleSignin (4.0.3):    - GoogleSignIn (~> 5.0.2)    - React  - GoogleSignIn (~> 5.0.2)SPEC REPOS:  trunk:    - AppAuth    - boost-for-react-native    - FBSDKCoreKit    - FBSDKLoginKit    - FBSDKShareKit    - GoogleSignIn    - GTMAppAuth    - GTMSessionFetcherCOCOAPODS: 1.8.4

And my Podfile is:

platform :ios, '9.0'require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'target 'karya' do  # Pods for karya  pod 'GoogleSignIn', '~> 5.0.2'

Any ideas how to solve this? I am assuming it is related to google signin.Thanks

React Native API fetch in background

$
0
0

When user login it takes 3 sec to fetch data from server. In the mean time if user minimize the application (IOS) api request fails. But working fine in android.

How to set PDF height dynamically using 'react-native-html-to-pdf' package?

$
0
0

I am creating a PDF document in react-native. My aim is to create single page,no more pages and while my page's content gets bigger, my single page's height also must get bigger automatically.

options = {            width: 675,            height: ????,            html: `<div id="myDiv" style="width: 100%; min-height: 850px"> </div>`            }

In the above code, I set myDiv's min-height and when myDiv's height changes dynamically, I want to take this height value and set the option's height automatically. I tried javascript offsetHeight property but it does not work because HTML's inside is completely a string. I tried to use template literals, but i couldn't succeed.

Is there a way to handle this,using template literals or any other ways?

Alarm for react native application in iOS [closed]

$
0
0

I have been trying to build an alarm app in react-native for my iOS application. So far I am not able to get any solution for alarm. I want an alarm, not a notification. Guys, please help me with this.

FlatList re-render with Redux

$
0
0

I'm using PureComponent to render items of my FlatList and when I use FlatList and pass a local state to it in data, the rendering works very well, I don't have wasteful re-rendering.However, when I use FlatList with an array from my redux store in data, if I scroll down, each time that onReachEnd is called, re-render work well. But when I don't have anymore data to load and I scroll up, all my items re-render one per one.

Like my whole list is lost.

I'm using exactly the same list with local state in data, and it works perfectly! The issue only appear when I try to make FlatList and Redux work together

<FlatList   ref={(view) => this.list = view}   data={this.props.requestsList}   style={{flex: 1}}   keyExtractor={(item) => String(item.emitter.id)}   renderItem={this._renderRequestsItems}   onEndReachedThreshold={0.5}   onEndReached={!this.props.lastPage ? this._endReached : null}   ListFooterComponent={reloadIndicator}   ListHeaderComponent={this._getHeaderComponent}   ListEmptyComponent={this._getEmptyComponent}/>
Viewing all 16564 articles
Browse latest View live


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