when i click on button it will call the paynow function, in payNow function one popUp is open and automatically it closed with out showing anything, I don't know how to resolve this issue

I am developing a react-native app. I'm trying to make a UI element similar to the one on Maps in iOS, in which you can slide a panel from the bottom. The behavior of the list is quite complicated as:

• You can't scroll down the list until the panel is fully open.
• Trying to scroll it down makes the panel go up, and then if you continue the sliding movement on the screen the list starts scrolling.

And of course:

• You can't slide the panel down until the list is at the beginning.
• If you try to slide the panel down and the list isn't fully scrolled up, you end up scrolling the list to the beginning and then pulling the panel down.

The list scrolling up or down and the panel moving up or down has to be made in one movement. The user doesn't have to pull his finger out of the screen to make the second action. This is the actual hard part. Furthermore, it has to work on iOS and Android.

An example GIF of the iOS panel and the expected behavior.

The perfect module would be something like this, but the list is still scrollable even when it has reached the top: https://github.com/donaldmorton/react-native-bottom-drawer

I tried with this module without success: https://github.com/simonhoss/react-native-touch-through-view

Something like that in react-native would be perfect: How can I mimic the bottom sheet from the Maps app?

I already checked this post: React Native slide out panel and scrollview

Any kind of help is welcomed, thank you!

I get a problem to archive react native in xcode, I try look for example but fail all.

This is the error message in xcode :

How to solve this problem, please anyone help me.

Thanks

I am Implementing React native Project to read DICOM data in both android and iOS. I didn't found any source code and SDK to integrate in My React Native project in order to use in Both platform. can anyone please tell me, how to achieve? Thanks in advance.

I am using React 16.8.6 and react-native 0.59.6. iOS.

While typing react-native --version or anything prefix with react-native, it is showing the following error.

internal/fs/utils.js:220
    throw err;
    ^

Error: EPERM: operation not permitted, chmod '/usr/local/lib/node_modules/react-native/node_modules/@react-native-community/cli/build/commands/server/external/xsel'
    at Object.chmodSync (fs.js:1104:3)
    at Object.<anonymous> (/usr/local/lib/node_modules/react-native/node_modules/@react-native-community/cli/build/commands/server/copyToClipBoard.js:50:15)
    at Module._compile (internal/modules/cjs/loader.js:956:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:973:10)
    at Module.load (internal/modules/cjs/loader.js:812:32)
    at Function.Module._load (internal/modules/cjs/loader.js:724:14)
    at Module.require (internal/modules/cjs/loader.js:849:19)
    at require (internal/modules/cjs/helpers.js:74:18)
    at Object.<anonymous> (/usr/local/lib/node_modules/react-native/node_modules/@react-native-community/cli/build/commands/server/middleware/copyToClipBoardMiddleware.js:8:47)
    at Module._compile (internal/modules/cjs/loader.js:956:30) {
  errno: -1,
  syscall: 'chmod',
  code: 'EPERM',
  path: '/usr/local/lib/node_modules/react-native/node_modules/@react-native-community/cli/build/commands/server/external/xsel'
}

I cleaned the project. Restarted it.

Deleted npm package and reinstalled it.

Tried npm install -g react-native-cli.

I have react-native-community/cli version 1.12.0 in package.lock.json dependancies.

I don't have any clue about what to do. I am not able to do link any libraries and other stuffs which requires react-native keyword.

Moreover, If I run it with sudo like sudo react-native --version, it is giving like below mentioned.

warn Your project is using deprecated "rnpm" config that will stop working from next release. Please use a "react-native.config.js" file to configure the React Native CLI. Migration guide: https://github.com/react-native-community/cli/blob/master/docs/configuration.md
warn The following packages use deprecated "rnpm" config that will stop working from next release:
  - react-native-google-signin: https://github.com/react-native-community/react-native-google-signin
  - react-native-video: https://github.com/react-native-community/react-native-video#readme
Please notify their maintainers about it. You can find more details at https://github.com/react-native-community/cli/blob/master/docs/configuration.md#migration-guide.
3.0.4

Please suggest some guidance regarding the same.

Thanks.

I have inited 2 projects with react-native cli: the latest one and the version 0.44.3. When I run react-native run-ios both failed.

I have tried to delete /build in file ios. It didn't work. I can open the simulator successfully. But I can not run the application. I also concerned that I have installed command tool successfully.

Here's my error info:

I want to know why.

Update at 21th July: Plus: I run

brew tap AdoptOpenJDK/openjdk
brew cask install adoptopenjdk8

and the version 0.44.3 can run normally. But when I init a latest version, the error info is still the same as pictures up.

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

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

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

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

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

I was able to find a solution with:

 onShouldStartLoadWithRequest={request => {
   if (Platform.OS === "android") {
        const url = request.url;
             console.log(request);
             if (url !== uri) {
               Linking.openURL(url);
             }
              // return false;
             }
   }}

but then this somehow cancels out the iOS solution. So this is not working:

<WebViewAutoHeight
                key={s.Body.substr(10)}
                source={{
                  //prettier-ignore
                  html: `<body style="font-family: -apple-system, Roboto, sans-serif; background-color: ${lightTheme.grey2} !important; color: ${v2Colors.charcoalDarkest}; font-size: ${moderateScale(14, 0.2)}px;">${s.Body}</body>`
                }}
                // onShouldStartLoadWithRequest={request => {
                //   if (Platform.OS === "android") {
                //     const url = request.url;
                //     console.log(request);
                //     if (url !== uri) {
                //       Linking.openURL(url);
                //     }
                //     // return false;
                //   }
                // }}
                onNavigationStateChange={event => {
                  if (Platform.OS === "ios") {
                    if (event.url !== uri) {
                      Linking.openURL(event.url);
                    }
                  }
                }}
              />

I tried a ternary operator, but I got syntax errors all over the place. I need some help in getting these working on their respective platforms.

I tried to see if I could just use onShouldStartLoadWithRequest for both platforms, but iOS does not seem to recognize this property, because when I tested it, the articles on iOS do not show up at all in the WebView I just get a blank screen.

I'm having some problems with xcode, with disappearing linked libraries, etc.

After some research, it seems that my project.pbxproj file has been completely changed in between two commits, and I'm trying to restore an older version. However, and it has been some time now, my project.pbxproj is always flagged by git as modified. I've always figured it was XCode modifying the file at the same time I was modifying some things in the GUI. However, for the first time, git is keeping me from merging, or reverting, due to changes to this file. I can't gitignore it as it contains vital information necessary to build my project.

It gets weirder, though, as the file is indeed always in a modified state. I just tried booting my mac with absolutely no app open, no IDE, not xcode, and just opening a terminal, to clone my project in a newly created folder. After cloning, if I just cd into the folder and git status, the file is flagged as modified.

Is this behavior normal? Have people experienced issues with this file and git? Can i revert my project.pbxproj to an older state, and is it safe to do so? Are there some git configurations that I can use to better handle this file?

My project isn't native, I'm using the react-native framework

I've added some code to the AppDelegate.m file in my React Native app. I hoped this code would be run in the XCode console when I clicked "Build", but it doesn't. However, I did come across this

When I look at the logs from the "Debug" here on 2019-11-21, I do see the output of the code I want to see. I don't know how this Debug was run though. Does anyone know how I can run it again?

Can I know what to just open native camera application using react native. I don't want using to come back to my application even though user have clicked multiple photos. I would only want user to come back if S/he wants to close the camera app.

I am using some code in a React Native component that is a simple fetch passing a parameter to OMDB API. This could be a CORS issue since if I run it in the format below going directly to omdbapi.com it fails always with Network request Failed. This request however works in the Android emulator on the same network.

   // The fetchData function makes an AJAX call to the OMDB API.
   fetchData(movieinput) {
     console.log("In fetch");
       // We pass the movie the user entered in into the URL for the API call.
       fetch('http://www.omdbapi.com/?t='+movieinput+'&y=&plot=short&r=json')
           .then((response) => response.json())
           .then((responseData) => {
               // After the data is recieved, we set this.state.movie to the result of the API call.
               this.setState({
                   movie: responseData,
               });
           })
           .done();
   }

If however I run the same code going to a local URL that wraps the remote request into a localhost request, it works correctly.

   fetchData(movieinput) {
     console.log("In fetch");
       // We pass the movie the user entered in into the URL for the API call.
       fetch('http://localhost:3000/movie/'+movieinput)
           .then((response) => response.json())
           .then((responseData) => {
               // After the data is recieved, we set this.state.movie to the result of the API call.
               this.setState({
                   movie: JSON.parse(responseData),
               });
           })
           .done();
   }

Any ideas?

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?

I'd like for users to be able to share a link (e.g. app.com/SKFLA - this is primarily because deep links on their own aren't clickable) via Facebook etc. When clicked, this redirects to a deep link app://SKFLA. If the app is installed, this opens the app - this is all working fine so far. But if the app isn't installed, I'd like to open the app store on the relevant page. Is this achievable? Thanks!

I'm using expo react native and I want to do something similar to whatsapp (check if contacts downloaded the app so I can give them some permissions, and if a contact doesn't have the app I can invite him).

The problem is that I don't know how to start. Where should I read the contacts? Should I return them to server-side or read them from phone ? What are key words or concept I should read about and follow to take the right path doing this ?

I am new to react native and need your help. I am new to react native I am trying to integrate blink sdk with my react native app. I have exposed a native method to react native js using RCT_EXPORT_METHOD(). JS button click is invoking this native method. Now from this native method I want to open camera using:

/* Allocate and present the scanning view controller */

    UIViewController<PPScanningViewController>* scanningViewController = [coordinator cameraViewControllerWithDelegate:self];

   scanningViewController.autorotate = YES;
   scanningViewController.supportedOrientations = UIInterfaceOrientationMaskAll;

Now there are two problems:

1. If I run it just like that, it gives me red screen saying "invoke the method on main thread".

2. Now to run it on main thread, I added -(dispatch_queue_t)methodQueue { return dispatch_get_main_queue(); }

Still it is not running and saying not present in view hierarchy. Please help.

I defined two TextInput fields as follows:

<TextInput 
   style = {styles.titleInput}
   returnKeyType = {"next"}
   autoFocus = {true}
   placeholder = "Title" />
<TextInput
   style = {styles.descriptionInput}          
   multiline = {true}
   maxLength = {200}
   placeholder = "Description" />

But after pressing the "next" button on my keyboard, my react-native app isn't jumping to the second TextInput field. How can I achieve that?

Thanks!

Following the react-native documentation installed all the node dependencies and pods the simulator launches when the react-native run-iOS command is used and the app won't launch! while trying to launch the app on a physical device it shows an error!

error pic

Bundle identifier is missing. AwesomeProject doesn't have a bundle identifier. Add a value for PRODUCT_BUNDLE_IDENTIFIER in the build settings editor.

I am new to react-native and have found an error that makes absolutely no sense to me.

I am trying to include a calendar library: https://github.com/wix/react-native-calendars

I have included the dependency for that library in my package.json file and run npm install

The project was running fine and as expected. I have simply added one line of code to the project:

import { Calendar, CalendarList, Agenda } from 'react-native-calendars';

Nothing else. However now I am getting a red error message when the app loads on device and this is what my console is saying:

error: bundling failed: Error: While trying to resolve module xdate from file /Users/Alex/Documents/workspace/mobile/node_modules/react-native-calendars/src/index.js, the package /Users/Alex/Documents/workspace/mobile/node_modules/xdate/package.json was successfully found. However, this package itself specifies a main module field that could not be resolved (/Users/Alex/Documents/workspace/mobile/node_modules/xdate/src/xdate.js. Indeed, none of these files exist:

* /Users/Alex/Documents/workspace/mobile/node_modules/xdate/src/xdate.js(.native||.ios.js|.native.js|.js|.ios.json|.native.json|.json)

* /Users/Alex/Documents/workspace/mobile/node_modules/xdate/src/xdate.js/index(.native||.ios.js|.native.js|.js|.ios.json|.native.json|.json) at ResolutionRequest.resolveDependency (/Users/Alex/Documents/workspace/mobile/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:103:15) at DependencyGraph.resolveDependency (/Users/Alex/Documents/workspace/mobile/node_modules/metro/src/node-haste/DependencyGraph.js:272:4579) at dependencies.map.relativePath (/Users/Alex/Documents/workspace/mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:376:19) at Array.map () at resolveDependencies (/Users/Alex/Documents/workspace/mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:374:16) at /Users/Alex/Documents/workspace/mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:212:33 at Generator.next () at step (/Users/Alex/Documents/workspace/mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:297:313) at /Users/Alex/Documents/workspace/mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:297:473 at

However I have checked in the directory and in fact /Users/Alex/Documents/workspace/mobile/node_modules/xdate/src/xdate.js does exist. However I do not see any of this part: (.native||.ios.js|.native.js|.js|.ios.json|.native.json|.json)`

As to how /Users/Alex/Documents/workspace/mobile/node_modules/xdate/src/xdate.js/index can exist, that doesn't make sense because xdate.js is not a directory.

Any help?

I want to build something like this with React Native:

(image source https://developer.apple.com/design/human-interface-guidelines/ios/views/tables/) How can this be done in React Native? Do I need 3rd party libraries for that or is it possible with the "core" React Native?

Crash Report

libsystem_kernel.dylib`__pthread_kill:

0x7fff523bc7f0 <+0>:  movl   $0x2000148, %eax          ; imm = 0x2000148 
0x7fff523bc7f5 <+5>:  movq   %rcx, %r10
0x7fff523bc7f8 <+8>:  syscall 

-> 0x7fff523bc7fa <+10>: jae 0x7fff523bc804 ; <+20> 0x7fff523bc7fc <+12>: movq %rax, %rdi 0x7fff523bc7ff <+15>: jmp 0x7fff523b6a89 ; cerror_nocancel 0x7fff523bc804 <+20>: retq
0x7fff523bc805 <+21>: nop
0x7fff523bc806 <+22>: nop
0x7fff523bc807 <+23>: nop

Problem only in IOS and it runs successfully on debug mode but problem is only when we changed it to Release