I am starting to learn React Native and I've got a problem.

I am building a interview app and the first step looks like below.

So there is a text input and audio recorder inside it. If I click audio recorder, it should change like the 2nd image below.

So my questions are:

1.Is there any ready-made solution like above?

2.If not, is there any audio-recorder component?

3.If I have to create it from scratch, I am not sure how to place them.

Thanks in advance.

I am using vue-native-router in my project. I have it set up as follows:

App.Vue

<template><app-navigator></app-navigator></template><script>  import {  createAppContainer,  createStackNavigator,  } from "vue-native-router"; import HomeScreen from "./homescreen" import InfoScreen from "./infoscreen" const StackNavigator = createStackNavigator(   {     Home: HomeScreen,     Info: InfoScreen    },   {      initialRouteName: 'Home',   }  );  const AppNavigator = createAppContainer(StackNavigator);  export default {    components: { AppNavigator }, }</script>

I have two separate Vue Components making up HomeScreen,

within one of those components, I am trying to change the StackNavigator from HomeScreen to InfoScreen:

<button @press="changeScreen" :title =  (data.name) />

Here is what change screen looks like:

 changeScreen() {    console.log("CLICKED")    this.navigation.navigate("Home");  },

changeScreen is called, and the console log will run but navigation is unaffected. Interestingly this.navigation is null.... So I wonder if I have set up my navigator incorrectly? Should I register the navigator in index.js somehow??

If it is any help, here is the official documentation and the guide that I am following. https://vue-native.io/docs/vue-native-router.html

Thanks for the help!

I'm developing an iOS app using Expo. My app needs Location permission in order for geofencing to work when the app is not in use. I've followed Expo's documentation for Location Permission and provided NSLocationWhenInUseUsageDescription, NSLocationAlwaysAndWhenInUseUsageDescription, and NSLocationAlwaysUsageDescription descriptions in my app.json. But when my app prompts the user for location permissions the options given are While Using App, Allow Once, or Don't Allow.

How can I get my app to prompt for Always Allow?

Using this code i try to add on each marker an onpress option

there is the source source and there is a sample of my work

after many try i give up ... is there a way to add on my onpress the x position to my Animated.ScrollView

when i scroll i can see the marker changing but i want to add an onpress function in each marker. when press one off the marker i want to the scrollview set to the position of my maker

componentWillMount() {    this.index = 0;    this.animation = new Animated.Value(0);  }  componentDidMount() {    // We should detect when scrolling has stopped then animate    // We should just debounce the event listener here    AsyncStorage.getItem('userToken', (err, result) => {      if (this.state.userToken == null) {        this.setState({ userToken: result })        this.GetAllMarker()      }    });    this.animation.addListener(({ value }) => {      console.log(value)      let index = Math.floor(value / CARD_WIDTH + 0.3); // animate 30% away from landing on the next item      if (index >= this.state.markers.length) {        index = this.state.markers.length - 1;      }      if (index <= 0) {        index = 0;      }      clearTimeout(this.regionTimeout);      this.regionTimeout = setTimeout(() => {        if (this.index !== index) {          this.index = index;          const { coordinates } = this.state.markers[index];          console.log(index)          this.map.animateToRegion(            {              ...coordinates,              latitudeDelta: this.state.region.latitudeDelta,              longitudeDelta: this.state.region.longitudeDelta,            },            350          );        }      }, 10);    });  }  GenerateBearer() {    let tmp = `Bearer ` + this.state.userToken    tmp = tmp.replace('"', '');    tmp = tmp.replace('"', '');    return (tmp)  }  GetAllMarker() {    let Bearer = this.GenerateBearer();    console.log(Bearer)    fetch(Config.API_URL +"/api/public/user/aroundMe?latitude="+ this.state.region.latitude +"&longitude="+ this.state.region.longitude +"&rayon=50", {      method: 'GET',      headers: {'Accept': '*/*','Content-Type': 'application/json','Authorization': Bearer,      }    })      .then(res => res.json())      .then(res => {        this.setState({ markers: res })      })      .catch(error => {        this.setState({ error: error });      });  }  handleMarkerPress(e){    this.state.markers[1] = e    console.log(e)  }  render() {    const interpolations = this.state.markers.map((marker, index) => {      const inputRange = [        (index - 1) * CARD_WIDTH,        index * CARD_WIDTH,        ((index + 1) * CARD_WIDTH),      ];      const scale = this.animation.interpolate({        inputRange,        outputRange: [1, 2.5, 1],        extrapolate: "clamp",      });      const opacity = this.animation.interpolate({        inputRange,        outputRange: [0.35, 1, 0.35],        extrapolate: "clamp",      });      return { scale, opacity };    });    return (<View style={styles.container}><MapView          ref={map => this.map = map}          initialRegion={this.state.region}          style={styles.container}><UrlTile            urlTemplate="http://ip/styles/klokantech-basic/{z}/{x}/{y}.png"            zIndex={-1}          />          {this.state.markers.map((marker, index) => {            const scaleStyle = {              transform: [                {                  scale: interpolations[index].scale,                },              ],            };            const opacityStyle = {              opacity: interpolations[index].opacity,            };            return (<MapView.Marker key={index} coordinate={marker.coordinates} onPress={(event) => this.handleMarkerPress(index)} ><Animated.View style={[styles.markerWrap, opacityStyle]} ><Animated.View style={[styles.ring, scaleStyle]} /><View style={styles.marker} /></Animated.View></MapView.Marker>            );          })}</MapView><Animated.ScrollView          horizontal          scrollEventThrottle={1}          showsHorizontalScrollIndicator={true}          snapToInterval={CARD_WIDTH}          onScroll={Animated.event(            [{nativeEvent: {              contentOffset: {                x: this.animation,                  },                },},],            { useNativeDriver: true }          )}          style={styles.scrollView}          contentContainerStyle={styles.endPadding}>          {this.state.markers.map((marker, index) => {            if (marker.isAlerte == false)              return (<View style={styles.card} key={index}><Image                    source={marker.image}                    style={styles.cardImage}                    resizeMode="cover"                  /><View style={styles.textContent}><Text numberOfLines={1} style={styles.cardtitle}>{marker.espace.titre}</Text><Text numberOfLines={1} style={styles.cardDescription}>                      {marker.description}</Text></View></View>)            else              return (<View style={styles.card} key={index}><Image                    source={marker.image}                    style={styles.cardImage}                    resizeMode="cover"                  /><View style={styles.textContent}><Text numberOfLines={1} style={styles.cardtitle}>{marker.alerte.type}</Text><Text numberOfLines={1} style={styles.cardDescription}>                      {marker.description}</Text></View></View>)          })          }</Animated.ScrollView></View>    );  }}

First off, I don't know react, but I figured deploying to an iOS device instead of the simulator wouldn't be too difficult to do with the docs. They were a bit sparse but I got somewhere and now I'm stuck.I created a main.jsbundle and added it to the Xcode project and uncommented the line in AppDelegate.m.

When I deploy it I get this error:

2015-03-26 16:13:08.538 AwesomeProject[4753:2477032] >  RCTJSLog> "Running application "AwesomeProject" with appParams: {"rootTag":1,"initialProps":{}}. __DEV__ === true, development-level warning are ON, performance optimizations are OFF"2015-03-26 16:13:08.547 AwesomeProject[4753:2477032] >  RCTJSLog> "Error:  stack:   runApplication                  main.jsbundle:33769  jsCall                          main.jsbundle:7157  _callFunction                   main.jsbundle:7404  applyWithGuard                  main.jsbundle:877  guardReturn                     main.jsbundle:7206  callFunctionReturnFlushedQueue  main.jsbundle:7413 URL: file:///private/var/mobile/Containers/Bundle/Application/DBC0DAF4-B568-4CF5-B156-9EFEE4E7FF4A/AwesomeProject.app/main.jsbundle line: 1536 message: Invariant Violation: Application AwesomeProject has not been registered."2015-03-26 16:13:08.723 AwesomeProject[4753:2477032] >  RCTJSLog> "#CLOWNTOWN (error while displaying error): Network request failed"

I'm pretty new with iOS development and publishing apps in App Store. My project has been created with ReactNative. I've submitted the app for approval, but it's been rejected. Some reasons make sense, but I can't understand one of them. This one:

Your app includes content or features that users aren't able to use in this version. Apps that are for demonstration, trial, or up-sell purposes are not appropriate for the App Store.

I've been reviewing my app, look for "demo|beta|trial" words, but I haven't them.

Any idea about why they say that ? What should I check?

Thanks

Error: ""Expo Developer Tools is disconnected from Expo CLI. Use the expo start command to start the CLI again.""I'm new to react native. In my very first project (learning from udemy), I was running app through expo in android. To install react native paper, I just killed the cmd. And typed "npm install react-native-paper". After the installation process, to again enter in the expo I typed '''npm run android'''. But it showed me the error ""Expo Developer Tools is disconnected from Expo 'CLI'. Use the expo start command to start the CLI again."" I have tried every effort to resolve this problem, but in the end the only option remain left was to restart the project again.

Also after restarting project from beginning, i got stuck at same very point install react native paper. then again proceeding from that step to run expo, again same problem occur "Expo Developer Tools is disconnected from Expo CLI. Use the expo start command to start the 'CLI' again." I'm unable to proceed after that. Please help me! how do I proceed further! I'm just in learning phase to react native. Also this is my first question.

After updating xCode I am facing the below error from a week. I am not able to run app on device. I dont think the issue is with xcode because even if I try to run on android device the same issue occurs.

The issue occurs when we run npm start also with reset option the same error occurs.

The only option is to run on android device after deleting ios build folder.

The error

The following files share their name; please adjust your hasteImpl:    * <rootDir>/node_modules/react-native/package.json    * <rootDir>/ios/build/oleo/Build/Products/Debug-iphoneos/oleo.app/assets/node_modules/react-native/package.jsonFailed to construct transformer:  DuplicateError: Duplicated files or mocks. Please check the console for more info    at setModule (/Users/murtazakanpurwala/Documents/Work/Web_Design_Dev/Clients/Oleo/OleoCW/node_modules/jest-haste-map/build/index.js:620:17)    at workerReply (/Users/murtazakanpurwala/Documents/Work/Web_Design_Dev/Clients/Oleo/OleoCW/node_modules/jest-haste-map/build/index.js:691:9)    at processTicksAndRejections (internal/process/task_queues.js:93:5)    at async Promise.all (index 668) {  mockPath1: 'node_modules/react-native/package.json',  mockPath2: 'ios/build/oleo/Build/Products/Debug-iphoneos/oleo.app/assets/node_modules/react-native/package.json'}(node:8630) UnhandledPromiseRejectionWarning: Error: Duplicated files or mocks. Please check the console for more info    at setModule (/Users/murtazakanpurwala/Documents/Work/Web_Design_Dev/Clients/Oleo/OleoCW/node_modules/jest-haste-map/build/index.js:620:17)    at workerReply (/Users/murtazakanpurwala/Documents/Work/Web_Design_Dev/Clients/Oleo/OleoCW/node_modules/jest-haste-map/build/index.js:691:9)    at processTicksAndRejections (internal/process/task_queues.js:93:5)    at async Promise.all (index 668)(node:8630) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)(node:8630) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

Package.json

{"name": "oleo","version": "0.0.1","private": true,"scripts": {"start": "react-native start","test": "jest","lint": "eslint .","create-bundle-ios": "react-native bundle --platform ios --dev true --entry-file index.js --bundle-output ios/main.jsbundle","create-bundle-android": "react-native bundle --platform android --dev true --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res"  },"dependencies": {"@react-native-community/async-storage": "^1.9.0","@react-native-community/netinfo": "^5.8.0","@react-native-community/push-notification-ios": "^1.1.1","@react-native-firebase/analytics": "^6.7.1","@react-native-firebase/app": "^6.7.1","@react-native-firebase/auth": "^6.7.1","@react-native-firebase/firestore": "^6.7.1","@react-native-firebase/messaging": "^6.7.1","@react-native-firebase/storage": "^6.7.1","accordion-collapse-react-native": "^0.2.10","lodash": "^4.17.15","md5": "^2.2.1","moment": "^2.24.0","react": "16.8.6","react-native": "0.60.5","react-native-chooser": "^1.7.0","react-native-datepicker": "^1.7.2","react-native-draggable-flatlist": "^2.3.2","react-native-exit-app": "^1.1.0","react-native-gesture-handler": "^1.6.1","react-native-image-crop-picker": "^0.25.3","react-native-image-view": "^2.1.8","react-native-material-dropdown": "^0.11.1","react-native-modal": "^11.5.6","react-native-pdf": "^6.1.1","react-native-phone-input": "^0.2.4","react-native-popup-dialog": "^0.18.3","react-native-push-notification": "^3.2.1","react-native-reanimated": "^1.8.0","react-native-screens": "^2.7.0","react-native-snackbar": "^2.2.0","react-native-swiper": "^1.6.0","react-native-webview": "^7.4.2","react-navigation": "^4.3.8","react-navigation-stack": "^1.10.3","rn-fetch-blob": "^0.11.2"  },"devDependencies": {"@babel/core": "^7.9.0","@babel/runtime": "^7.9.2","@react-native-community/eslint-config": "^0.0.5","babel-jest": "^24.9.0","eslint": "^6.8.0","jest": "^24.9.0","metro-react-native-babel-preset": "^0.56.4","react-test-renderer": "16.8.6"  },"jest": {"preset": "react-native"  }}

I have deleted multiple times node modules, did a fresh install as well but the issue comes up every time.

I want to write a component which can edit an article for words input and insert images. I use TextInput for words input. If I want to insert an image in the middle of the text, I will generate an Image component and an new TextInput after the Image. But I don't know how to get the cursor position and content after the cursor.Anyone help?

I have an app written in react-native and which uses Firebase Analytics for tracking.

It seems that data is tracked in production, but when I try doing adjustments in tracking, I want to use the DebugView to test my changes.

But I simply cannot see any data or available devices in the DebugView of the Firebase Analytics console. It has previously worked for me in other apps, but no devices/data appears with this app.

I have already added the IS_ANALYTICS_ENABLED=YES plist entry and -FIRDebugEnabled launch argument on iOS. On Android I have run the adb shell setprop debug.firebase.analytics.app ... command.

I can see in the logs, that Firebase Analytics is receiving my events and uploading these.

2020-05-15 15:55:34.027603+0200 dacapp[33120:11310779] 5.20.0 - [Firebase/Analytics][I-ACS023044] Successful upload. Got network response. Code, size: 204, -1

I have also checked with Charles Proxy, which also tells me that Firebase Analytics backend is receiving the data as it should.

So I'm pretty sure everyting is sent to FA as it should. I have access to the reports and StreamView of FA and can see data there. The only thing that's not working is the DebugView.

Tried on Android 9 and iOS 13.4, with Firebase/Core 5.5 and react-native-firebase 5.5.6

I am new to react native, I want to make a VPN client app for Android and IOS. VPN protocol should be IPSec or IKEv2 or any other. I have tried these:

1. OpenVPN

node-openvpn and openvpn-bin but no luck

const openvpnmanager = require('node-openvpn'); **const opts = {  host: '127.0.0.1', // normally '127.0.0.1', will default to if undefined  port: 1337, //port openvpn management console  timeout: 1500, //timeout for connection - optional, will default to 1500ms if undefined  logpath: 'log.txt' //optional write openvpn console output to file, can be relative path or absolute};const auth = {  user: 'vpnUserName',  pass: 'vpnPassword',};const openvpn = openvpnmanager.connect(opts)// will be emited on successful interfacing with openvpn instanceopenvpn.on('connected', () => {  openvpnmanager.authorize(auth);})

2. react native open settings

react-native-device-setting and react-native-open-settings in which they have showed to programmatically open android phone settings like:

install package: npm install react-native-device-settings --save

usage:

import DeviceSettings from 'react-native-device-settings';DeviceSettings.open(); // Open settings menuDeviceSettings.app(); // Open app settings menuDeviceSettings.wifi(); // Open wifi settings menu

but there is no method to open up the VPN Settings and configure VPN. 47306057 has also asked the same problem

i need some direction or way to solve this. is there a library or something that i should use or make a VPN app in android studio and then import the aar file here. will it work?

Can anyone help me out in this? Thanks

I'm trying to load a splash screen for an iOS app built in React Native. I'm trying to accomplish this through class states and then a setTimeout function as follows:

class CowtanApp extends Component {  constructor(props){    super(props);    this.state = {      timePassed: false    };  }  render() {    setTimeout(function(){this.setState({timePassed: true})}, 1000);    if (!this.state.timePassed){      return <LoadingPage/>;    }else{      return (<NavigatorIOS          style = {styles.container}          initialRoute = {{            component: LoginPage,            title: 'Sign In',          }}/>      );    }  }}

The loading page works for a second, and then I guess when setTimeout tries to change the state to true, my program crashes: 'undefined is not an object (evaluating this.setState)'. I've been going at this for a couple of hours, any ideas on how to fix it?

I've followed multiple tutorials and read multiple Stackoverflow posts, but no matter what I do, I can't get anything to show up in my DebugView for my iOS app using RNFireBase. I would really appreciate some help with this. I've lost days trying to figure this out and I have no idea what is wrong. I tried on both a simulator and a physical device and no luck with either.

I'm getting logging messages to show up in my console in XCode, but nothing shows up in the Firebase Console. Here are the messages I get locally when using an event:

React Native

<TouchableOpacity  onPress={() =>    analytics().logSelectContent({      content_type: "clothing",      item_id: "abcd",    })  }><Text>Log message</Text></TouchableOpacity>;

Logs

2020-05-15 12:22:26.486761-0400 Example App[23464:8820959] 6.13.0 - [Firebase/Analytics][I-ACS023051] Logging event: origin, name, params: app, select_content, {    content_type = clothing;    ga_event_origin (_o) = app;    ga_screen_class (_sc) = UIViewController;    ga_screen_id (_si) = -3307323385789565728;    item_id = abcd;}2020-05-15 12:22:26.487676-0400 Example App[23464:8820959] 6.13.0 - [Firebase/Analytics][I-ACS023073] Debug mode is enabled. Marking event as debug and real-time. Event name, parameters: select_content, {    content_type = clothing;    ga_debug (_dbg) = 1;    ga_event_origin (_o) = app;    ga_realtime (_r) = 1;    ga_screen_class (_sc) = UIViewController;    ga_screen_id (_si) = -3307323385789565728;    item_id = abcd;}2020-05-15 12:22:26.500453-0400 Example App[23464:8820959] 6.13.0 - [Firebase/Analytics][I-ACS023072] Event logged. Event name, event params: select_content, {    content_type = clothing;    ga_debug (_dbg) = 1;    ga_event_origin (_o) = app;    ga_realtime (_r) = 1;    ga_screen_class (_sc) = UIViewController;    ga_screen_id (_si) = -3307323385789565728;    item_id = abcd;}2020-05-15 12:22:26.502567-0400 Example App[23464:8821128] 6.13.0 - [Firebase/Analytics][I-ACS002002] Measurement timer scheduled to fire in approx. (s): 0.98287880420684812020-05-15 12:22:26.502616-0400 Example App[23464:8821128] 6.13.0 - [Firebase/Analytics][I-ACS023028] Upload task scheduled to be executed in approx. (s): 0.98287880420684812020-05-15 12:22:27.497172-0400 Example App[23464:8821128] 6.13.0 - [Firebase/Analytics][I-ACS002001] Measurement timer fired2020-05-15 12:22:27.497304-0400 Example App[23464:8821128] 6.13.0 - [Firebase/Analytics][I-ACS002003] Measurement timer canceled2020-05-15 12:22:27.497444-0400 Example App[23464:8821128] 6.13.0 - [Firebase/Analytics][I-ACS023033] Starting data upload2020-05-15 12:22:27.501020-0400 Example App[23464:8821128] 6.13.0 - [Firebase/Analytics][I-ACS023105] Event is not subject to real-time event count daily limit. Marking an event as real-time. Event name, parameters: select_content, {    content_type = clothing;    ga_debug (_dbg) = 1;    ga_event_origin (_o) = app;    ga_realtime (_r) = 1;    ga_screen_class (_sc) = UIViewController;    ga_screen_id (_si) = -3307323385789565728;    item_id = abcd;}2020-05-15 12:22:27.511485-0400 Example App[23464:8821128] 6.13.0 - [Firebase/Analytics][I-ACS012018] Saving bundle. size (bytes): 4992020-05-15 12:22:27.512391-0400 Example App[23464:8821128] 6.13.0 - [Firebase/Analytics][I-ACS023116] Bundle added to the upload queue. BundleID, timestamp (ms): 38, 15895597464852020-05-15 12:22:27.518879-0400 Example App[23464:8821128] 6.13.0 - [Firebase/Analytics][I-ACS023038] Uploading events. Elapsed time since last successful upload (s): 44.211020946502692020-05-15 12:22:27.519180-0400 Example App[23464:8820960] 6.13.0 - [Firebase/Analytics][I-ACS023039] Measurement data sent to network. Timestamp (ms), data: 1589559747518, <APMPBMeasurementBatch: 0x2808513f0>2020-05-15 12:22:27.524885-0400 Example App[23464:8820960] 6.13.0 - [Firebase/Analytics][I-ACS900000] Uploading data. Host: https://app-measurement.com/a2020-05-15 12:22:27.607462-0400 Example App[23464:8820960] 6.13.0 - [Firebase/Analytics][I-ACS901006] Received SSL challenge for host. Host: https://app-measurement.com/a2020-05-15 12:22:27.674761-0400 Example App[23464:8821408] 6.13.0 - [Firebase/Analytics][I-ACS023044] Successful upload. Got network response. Code, size: 204, -12020-05-15 12:22:27.679982-0400 Example App[23464:8821408] 6.13.0 - [Firebase/Analytics][I-ACS002002] Measurement timer scheduled to fire in approx. (s): -0.19421613216400152020-05-15 12:22:27.680071-0400 Example App[23464:8821408] 6.13.0 - [Firebase/Analytics][I-ACS023028] Upload task scheduled to be executed in approx. (s): -0.19421613216400152020-05-15 12:22:27.688291-0400 Example App[23464:8821408] 6.13.0 - [Firebase/Analytics][I-ACS023024] No data to upload. Upload task will not be scheduled2020-05-15 12:22:27.688364-0400 Example App[23464:8821408] 6.13.0 - [Firebase/Analytics][I-ACS002003] Measurement timer canceled

Here's everything I've done:

I modified my AppDelegate.m

// imports#import <Firebase.h> // Imported Firebase.h// more imports- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions{    if ([FIRApp defaultApp] == nil) {        [FIRApp configure];    }// ... rest of my didFinishLaunchingWithOptions

I added GoogleService-Info.plist to my app target. I then followed this post and:

Now it doesn't matter much but still for the people who are getting errors on this issue. Debug mode of firebase analytics does not work sometimes due to issue in GoogleServices-Info.plist file Simply makes these 2 changes.

Set IS_ANALYTICS_ENABLED to YES

Set FIREBASE_ANALYTICS_COLLECTION_DEACTIVATE to NO

Removing FIREBASE_ANALYTICS_COLLECTION_DEACTIVATED entirely

I then removed FIREBASE_ANALYTICS_COLLECTION_DEACTIVATED from my .plist like this post suggested. Still not working.

Made sure there was no OS_ACTIVITY_MODE:disable enabled like this post said

Make sure to remove the OS_ACTIVITY_MODE:disable from the Environment Variables in your project scheme if you added it at some point.

Set environment variables

Podfile.lock relevant section

- Firebase/Analytics (6.13.0):    - Firebase/Core  - Firebase/Core (6.13.0):    - Firebase/CoreOnly    - FirebaseAnalytics (= 6.1.6)  - Firebase/CoreOnly (6.13.0):    - FirebaseCore (= 6.4.0)  - FirebaseAnalytics (6.1.6):    - FirebaseCore (~> 6.4)    - FirebaseInstanceID (~> 4.2)    - GoogleAppMeasurement (= 6.1.6)    - GoogleUtilities/AppDelegateSwizzler (~> 6.0)    - GoogleUtilities/MethodSwizzler (~> 6.0)    - GoogleUtilities/Network (~> 6.0)    - "GoogleUtilities/NSData+zlib (~> 6.0)"    - nanopb (= 0.3.9011)  - FirebaseCore (6.4.0):    - FirebaseCoreDiagnostics (~> 1.0)    - FirebaseCoreDiagnosticsInterop (~> 1.0)    - GoogleUtilities/Environment (~> 6.2)    - GoogleUtilities/Logger (~> 6.2)  - FirebaseCoreDiagnostics (1.2.4):    - FirebaseCoreDiagnosticsInterop (~> 1.2)    - GoogleDataTransportCCTSupport (~> 3.0)    - GoogleUtilities/Environment (~> 6.5)    - GoogleUtilities/Logger (~> 6.5)    - nanopb (~> 0.3.901)  - FirebaseCoreDiagnosticsInterop (1.2.0)  - FirebaseInstanceID (4.2.7):    - FirebaseCore (~> 6.0)    - GoogleUtilities/Environment (~> 6.0)    - GoogleUtilities/UserDefaults (~> 6.0)

I have React Native project which stops working after Xcode upgrade to version 11.3.1. The error is following

Could not install at this time.Failed to load Info.plist from bundle at path /Users/dmytro/Library/Developer/CoreSimulator/Devices/F0BD5650-04A4-4534-B3F6-56B74ED1B0C2/data/Library/Caches/com.apple.mobile.installd.staging/temp.aRWRdh/extracted/Target.app/Frameworks/RCTVibration.framework; Extra info about plist: ACL=<not found

and details

DetailsThis app could not be installed at this time.Domain: IXUserPresentableErrorDomainCode: 1Failure Reason: Could not install at this time.Recovery Suggestion: Failed to load Info.plist from bundle at path /Users/dmytro/Library/Developer/CoreSimulator/Devices/F0BD5650-04A4-4534-B3F6-56B74ED1B0C2/data/Library/Caches/com.apple.mobile.installd.staging/temp.aRWRdh/extracted/Target.app/Frameworks/RCTVibration.framework; Extra info about plist: ACL=<not found> --Failed to load Info.plist from bundle at path /Users/dmytro/Library/Developer/CoreSimulator/Devices/F0BD5650-04A4-4534-B3F6-56B74ED1B0C2/data/Library/Caches/com.apple.mobile.installd.staging/temp.aRWRdh/extracted/Target.app/Frameworks/RCTVibration.framework; Extra info about plist: ACL=<not found> Domain: MIInstallerErrorDomainCode: 35User Info: {    FunctionName = "-[MIBundle _validateWithError:]";    LegacyErrorString = PackageInspectionFailed;    SourceFileLine = 128;}--

I had been trying to find information about this error that I will post below, I did all the configurations and made research, I am using the latest version of everything.But since I am new to Detox, I was assuming that the test written for iOS works for Android, if so please ignore and please provide details on how to adapt.

Basically the error I am getting is this:

detox[40905] INFO:  [test.js] configuration="android.emu.debug" reportSpecs=true readOnlyEmu=false useCustomLogger=true forceAdbInstall=false DETOX_START_TIMESTAMP=1588961953280 node_modules/.bin/jest --config e2e/config.json '--testNamePattern=^((?!:ios:).)*$' --maxWorkers 1 "e2e"detox[40909] INFO:  [DetoxServer.js] server listening on localhost:49577...detox[40909] ERROR: [DetoxExportWrapper.js/DETOX_INIT_ERROR] DetoxRuntimeError: Failed to run application on the deviceHINT: Most likely, your tests have timed out and called detox.cleanup() while it was waiting for "ready" message (over WebSocket) from the instrumentation process.    at EmulatorDriver._getInstrumentationCrashError (/Users/brunosoko/Documents/appExam/node_modules/detox/src/devices/drivers/android/AndroidDriver.js:165:12)    at EmulatorDriver.instrumentationCloseListener (/Users/brunosoko/Documents/appExam/node_modules/detox/src/devices/drivers/android/AndroidDriver.js:128:67)    at EmulatorDriver._terminateInstrumentation (/Users/brunosoko/Documents/appExam/node_modules/detox/src/devices/drivers/android/AndroidDriver.js:156:12)    at processTicksAndRejections (internal/process/task_queues.js:97:5)    at ChildProcess.<anonymous> (/Users/brunosoko/Documents/appExam/node_modules/detox/src/devices/drivers/android/AndroidDriver.js:274:7) {  name: 'DetoxRuntimeError'}detox[40909] INFO:  Example: should show login screen after tap on Sign in button

I do not know if it's a bug or something that I am doing wrong.

Here's my package.json

"detox": {"specs": "","configurations": {"ios.sim.debug": {"binaryPath": "/Users/brunosoko/Library/Developer/Xcode/DerivedData/AppExam-cwpqhbjlywwwihfaazprzmynvoym/Build/Products/Debug-iphonesimulator/appExam.app","type": "ios.simulator","name": "iPhone 11"      },"android.emu.debug": {"binaryPath": "/Users/brunosoko/Documents/AppExam/android/app/build/outputs/apk/debug/app-debug.apk","type": "android.emulator","name": "Pixel_3_API_R_2"      }    },"test-runner": "jest"  },

A feature of my React Native App consists of making Perspective Corrections to Document Photos.

It takes 4 points, crops the image, perspective corrects it, and then applys CIFilter to adjust the colours and export as Base64 String.

We were trying to run this on an iPhone 11 Simulator

As of now, we have been getting this error

attempt to insert nil object from objects[0]

Assumption: It is probably happening because it can't read the image from file storage / the file is being read as nil

Here is the source code

#import "CustomCropManager.h"#import <React/RCTLog.h>@implementation CustomCropManagerRCT_EXPORT_MODULE();RCT_EXPORT_METHOD(crop:(NSDictionary *)points imageUri:(NSString *)imageUri callback:(RCTResponseSenderBlock)callback){    NSLog(@"[myLOG] PARSING");    NSString *parsedImageUri = [imageUri stringByReplacingOccurrencesOfString:@"file://" withString:@""];    NSLog(@"[myLOG] parsedImageUri");    NSURL *fileURL = [NSURL fileURLWithPath:parsedImageUri];    NSLog(@"[myLOG] fileURL");    CIImage *ciImage = [CIImage imageWithContentsOfURL:fileURL];    NSLog(@"[myLOG] ciImage");    CGPoint newLeft = CGPointMake([points[@"topLeft"][@"x"] floatValue], [points[@"topLeft"][@"y"] floatValue]);    CGPoint newRight = CGPointMake([points[@"topRight"][@"x"] floatValue], [points[@"topRight"][@"y"] floatValue]);    CGPoint newBottomLeft = CGPointMake([points[@"bottomLeft"][@"x"] floatValue], [points[@"bottomLeft"][@"y"] floatValue]);    CGPoint newBottomRight = CGPointMake([points[@"bottomRight"][@"x"] floatValue], [points[@"bottomRight"][@"y"] floatValue]);    NSLog(@"[myLOG] CGPOINTS");    newLeft = [self cartesianForPoint:newLeft height:[points[@"height"] floatValue] ];    newRight = [self cartesianForPoint:newRight height:[points[@"height"] floatValue] ];    newBottomLeft = [self cartesianForPoint:newBottomLeft height:[points[@"height"] floatValue] ];    newBottomRight = [self cartesianForPoint:newBottomRight height:[points[@"height"] floatValue] ];    NSLog(@"[myLOG] new");    NSMutableDictionary *rectangleCoordinates = [[NSMutableDictionary alloc] init];    rectangleCoordinates[@"inputTopLeft"] = [CIVector vectorWithCGPoint:newLeft];    rectangleCoordinates[@"inputTopRight"] = [CIVector vectorWithCGPoint:newRight];    rectangleCoordinates[@"inputBottomLeft"] = [CIVector vectorWithCGPoint:newBottomLeft];    rectangleCoordinates[@"inputBottomRight"] = [CIVector vectorWithCGPoint:newBottomRight];    NSLog(@"[myLOG] rectangleCoordinates");    ciImage = [ciImage imageByApplyingFilter:@"CIPerspectiveCorrection" withInputParameters:rectangleCoordinates];    NSLog(@"[myLOG] ciImage");     // custom code     CIFilter* colorControlsFilter = [CIFilter filterWithName:@"CIColorControls"];     [colorControlsFilter setValue:ciImage forKey:@"inputImage"];     [colorControlsFilter setValue:[NSNumber numberWithFloat:1.0] forKey:@"inputSaturation"];[colorControlsFilter setValue:[NSNumber numberWithFloat:0.2] forKey:@"inputBrightness"];[colorControlsFilter setValue:[NSNumber numberWithFloat:1.0] forKey:@"inputContrast"];    ciImage = [colorControlsFilter valueForKey:@"outputImage"];    // custom code    NSLog(@"[myLOG] ciImage ssss");    CIContext *context = [CIContext contextWithOptions:nil];    CGImageRef cgimage = [context createCGImage:ciImage fromRect:[ciImage extent]];    UIImage *image = [UIImage imageWithCGImage:cgimage];    NSLog(@"[myLOG] image");    NSData *imageToEncode = UIImageJPEGRepresentation(image, 0.8);    NSLog(@"[myLOG] calling...");    callback(@[[NSNull null], @{@"image": [imageToEncode base64EncodedStringWithOptions:NSDataBase64Encoding64CharacterLineLength]}]);}- (CGPoint)cartesianForPoint:(CGPoint)point height:(float)height {    return CGPointMake(point.x, height - point.y);}@end

I made a custom Image swiper withe ScrollView in React Native, but it looks bad when images with rounded corners move. Is there any way to round the corners of the ScrollView?Those are my ScrollView styles:

style={{     flexDirection: 'row', alignSelf: 'center',     width: this.state.imageWidth,     borderRadius: 20,}}

The performance of zoom out(two fingers pan in) particularly is very poor.Kindly let me know if there are some optimisations needed or workaround.

Also, what are some recommended charting libraries available for react native with good customisation options and good performance?

All kinds of suggestions are appreciated.

Reproducible code:

import React from 'react';import {  StyleSheet,  View,} from 'react-native';import {  VictoryLine,  VictoryChart,  VictoryZoomContainer,} from 'victory-native';const App: () => React$Node = () => {  return (<View style={styles.container}><VictoryChart        containerComponent={<VictoryZoomContainer            zoomDimension="x"            // minimumZoom={{x: 1, y: 0.01}}          />        }><VictoryLine          data={data1.frst}          style={{data: {stroke: 'red'}}}          interpolation="natural"        /></VictoryChart></View>  );};const data1 = {  frst: [    {x: 'Mon', y: 6},    {x: 'Tue', y: 2},    {x: 'Wed', y: 3},    {x: 'Thu', y: 2},    {x: 'Fri', y: 5},    {x: 'Sat', y: 1},    {x: 'Sun', y: 6},    {x: 'Mon2', y: 6},    {x: 'Tue2', y: 2},    {x: 'Wed2', y: 3},    {x: 'Thu2', y: 2},    {x: 'Fri2', y: 5},    {x: 'Sat2', y: 1},    {x: 'Sun2', y: 6},    {x: 'Mon3', y: 6},    {x: 'Tue3', y: 2},    {x: 'Wed3', y: 3},    {x: 'Thu3', y: 2},    {x: 'Fri3', y: 5},    {x: 'Sat3', y: 1},    {x: 'Sun3', y: 6},  ],};const styles = StyleSheet.create({  container: {    flex: 1,    // padding: 10,    justifyContent: 'center',  }});export default App;

I am trying to go from one screen to the next in my react-native application but nothing is happening when the button is selected. I am using a Stack Navigation and from all other research I have done it seems as though my pages are setup correctly please let me know if you see any problems.

Root Stack

    import React from 'react'    import {createSwitchNavigator} from 'react-navigation'    import AuthNavigator from './stacks/AuthNavigator'    /**     * This document handles manging the switch navigatiors for the supplied stacks     * This means that each navigator mentioned in this file contains other navigators in their files     */      const RootStack = createSwitchNavigator(          {              Auth: AuthNavigator          },          {              initialRouteName: 'Auth'          }      )      export default RootStack

AuthNavigator.JS

import React from 'react'    import {createStackNavigator} from 'react-navigation-stack'    import LoginSignUpView from '../../../src/page/account/LoginSignUpView'    import SignUpView from '../../../src/page/account/SignUpView'    const AuthNavigator = createStackNavigator(        {"LoginSignUpView": LoginSignUpView,"SignUpView": SignUpView,        }        , {             initialRouteName: "LoginSignUpView"        }    );

LoginSignupView (With Button Not Working)

  import React, {Component} from 'react'    import {View, ScrollView, Text, Image} from 'react-native'    import LaunchOptions from '../../components/applaunch/LaunchOptions'    import LaunchButtonStyle from '/Users/Documents/Mobile Applications/src/styles/Launch/LaunchButtonsStyle.styles.js'    import LaunchButton from '../../components/applaunch/LaunchButton'    import ImageStylesStyles from '../../styles/common/ImageStyles.styles'    /**     * This page allows a user to have the option to login or sign up to the application      * This page is the main controller of the Login/SignUp View ... All components should be placed here.      * User will look at this view      */     class LoginSignUpView extends Component {         // NEED TO CHANGE NAVIGATION BAR COLOR -- CHECKOUT HOW BOOKIT IS DOING THIS         static navigationOptions = {            title: 'The Plug ',            headerStyle: {backgroundColor: 'black'},             headerTitleStyle: {color: 'white', fontFamily: 'Impact', fontSize: 30} ,          };         render(){             return(<ScrollView style= {{backgroundColor: 'black'}}><View><Image                        source = {require('../../Images/FontSearch.png')}                        style = {ImageStylesStyles.logoDefaultStyle}                        /><LaunchOptions                        text={'Create Account'}//-----------------------BUTTON NOT WORKING HERE VVVVV                        onPress={() => this.props.navigation.navigate("SignUpView")}                        buttonStyle={LaunchButtonStyle.largeRoundBtn}                        textStyle={LaunchButtonStyle.textStyle}                        /></View><View style={{                  borderBottomColor: 'white',                  borderBottomWidth: 1,marginTop: 40                    }}                /> <View><LaunchButton                    text={"Already have an account? Login"}                    onPress={"props.OnPress"}                    textStyle={LaunchButtonStyle.smallLgnSignupBtnTextStyle}                    /></View></ScrollView>             )         }     }     export default LoginSignUpView

LaunchOptions:

import React from 'react'import {View, Text, ScrollView} from 'react-native'import launchTextStyle from '/Users/Documents/Mobile Applications/ThePlugNetwork/src/styles/loginSignUpTextStyle.styles.js'import Button from '/Users/Documents/Mobile Applications/src/components/common/Button.js'/** * Application Launch View for user to select to login or signup *  * @param {*} props  */ const LaunchOptions = (props) => {      return(<ScrollView><View><Text style={launchTextStyle.bigTextTop}>Stay</Text><Text style={launchTextStyle.bigText}>Connected</Text><Text style={launchTextStyle.mediumText}>With The Latest</Text><Text style={launchTextStyle.smallText}>Government Updates</Text></View><View><Button                     onPress={props.OnPress}                     buttonStyle={props.buttonStyle}                     textStyle={props.textStyle}>                                              {props.text}</Button> </View></ScrollView>     ) } export default LaunchOptions

Web Audio API allows us to play synthesized sound. What if you're working with React Native? For example, consider a mobile app that is a piano. How do I make the sound?

I am not looking for a library that helps to play or record audio files.

Ideally, I want https://tonejs.github.io/ for iOS/Android