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

React Native : BLE, Discover & Broadcast (advertise data)

$
0
0

I'm very new to BLE APIs and capabilities. I want to achieve a "simple" thing. Let's say I'm developing the APP-X. I want to be able to scan other phone around me, with APP-X installed (exactly like this app here https://www.tracetogether.gov.sg/ ). I want to scan and filter the wanted devices via a "simple" metadata (advertising data ? specific for my app) within the signal emitted by the concerned phones. I'm stuck because Idk how to "emit" (broadcast) that custom signal.

Can you please help me find a way to do this in RN ?

I have already check those libs:

Many thanks


Unrecognized module map file Release-iphonesimulator/YogaKit/YogaKit.modulemap' not found

$
0
0

I have created a new react-native project and I am trying to build the iOS code but it is failing with below error:

fatal error: module map file

'/Users/ritz/Library/Developer/Xcode/DerivedData/thoughtrail-blthhaitoghgvzenyxayuwazwzfm/Build/Products/Release-iphonesimulator/YogaKit/YogaKit.modulemap' not found

react-native versions:react-native-cli: 2.0.1react-native: 0.62.2

stack trace from Xcode:

CompileC /Users/ritz/Library/Developer/Xcode/DerivedData/thoughtrail-blthhaitoghgvzenyxayuwazwzfm/Build/Intermediates.noindex/thoughtrail.build/Release-iphonesimulator/thoughtrail.build/Objects-normal/x86_64/thoughtrail_vers.o /Users/ritz/Library/Developer/Xcode/DerivedData/thoughtrail-blthhaitoghgvzenyxayuwazwzfm/Build/Intermediates.noindex/thoughtrail.build/Release-iphonesimulator/thoughtrail.build/DerivedSources/thoughtrail_vers.c normal x86_64 c com.apple.compilers.llvm.clang.1_0.compiler (in target 'thoughtrail' from project 'thoughtrail')    cd /Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios    export LANG=en_US.US-ASCII    /Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/bin/clang -x c -target x86_64-apple-ios9.0-simulator -fmessage-length=0 -fdiagnostics-show-note-include-stack -fmacro-backtrace-limit=0 -std=gnu99 -fmodules -gmodules -fmodules-cache-path=/Users/ritz/Library/Developer/Xcode/DerivedData/ModuleCache.noindex -fmodules-prune-interval=86400 -fmodules-prune-after=345600 -fbuild-session-file=/Users/ritz/Library/Developer/Xcode/DerivedData/ModuleCache.noindex/Session.modulevalidation -fmodules-validate-once-per-build-session -Wnon-modular-include-in-framework-module -Werror=non-modular-include-in-framework-module -Wno-trigraphs -fpascal-strings -Os -fno-common -Wno-missing-field-initializers -Wno-missing-prototypes -Werror=return-type -Wunreachable-code -Werror=deprecated-objc-isa-usage -Werror=objc-root-class -Wno-missing-braces -Wparentheses -Wswitch -Wunused-function -Wno-unused-label -Wno-unused-parameter -Wunused-variable -Wunused-value -Wempty-body -Wuninitialized -Wconditional-uninitialized -Wno-unknown-pragmas -Wno-shadow -Wno-four-char-constants -Wno-conversion -Wconstant-conversion -Wint-conversion -Wbool-conversion -Wenum-conversion -Wno-float-conversion -Wnon-literal-null-conversion -Wobjc-literal-conversion -Wshorten-64-to-32 -Wpointer-sign -Wno-newline-eof -DCOCOAPODS=1 -isysroot /Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs/iPhoneSimulator13.4.sdk -fasm-blocks -fstrict-aliasing -Wdeprecated-declarations -g -fvisibility=hidden -Wno-sign-conversion -Winfinite-recursion -Wcomma -Wblock-capture-autoreleasing -Wstrict-prototypes -Wno-semicolon-before-method-body -iquote /Users/ritz/Library/Developer/Xcode/DerivedData/thoughtrail-blthhaitoghgvzenyxayuwazwzfm/Build/Intermediates.noindex/thoughtrail.build/Release-iphonesimulator/thoughtrail.build/thoughtrail-generated-files.hmap -I/Users/ritz/Library/Developer/Xcode/DerivedData/thoughtrail-blthhaitoghgvzenyxayuwazwzfm/Build/Intermediates.noindex/thoughtrail.build/Release-iphonesimulator/thoughtrail.build/thoughtrail-own-target-headers.hmap -I/Users/ritz/Library/Developer/Xcode/DerivedData/thoughtrail-blthhaitoghgvzenyxayuwazwzfm/Build/Intermediates.noindex/thoughtrail.build/Release-iphonesimulator/thoughtrail.build/thoughtrail-all-target-headers.hmap -iquote /Users/ritz/Library/Developer/Xcode/DerivedData/thoughtrail-blthhaitoghgvzenyxayuwazwzfm/Build/Intermediates.noindex/thoughtrail.build/Release-iphonesimulator/thoughtrail.build/thoughtrail-project-headers.hmap -I/Users/ritz/Library/Developer/Xcode/DerivedData/thoughtrail-blthhaitoghgvzenyxayuwazwzfm/Build/Products/Release-iphonesimulator/include -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/CocoaAsyncSocket -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/CocoaLibEvent -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/DoubleConversion -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/FBLazyVector -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/FBReactNativeSpec -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/Flipper -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/Flipper-DoubleConversion -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/Flipper-Folly -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/Flipper-Glog -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/Flipper-PeerTalk -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/Flipper-RSocket -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/FlipperKit -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/OpenSSL-Universal -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/RCTRequired -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/RCTTypeSafety -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/React-Core -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/React-RCTText -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/React-cxxreact -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/React-jsi -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/React-jsiexecutor -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/React-jsinspector -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/ReactCommon -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/Yoga -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/YogaKit -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/glog -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/react-native-webview -I/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Private/React-Core -I/Users/ritz/Library/Developer/Xcode/DerivedData/thoughtrail-blthhaitoghgvzenyxayuwazwzfm/Build/Intermediates.noindex/thoughtrail.build/Release-iphonesimulator/thoughtrail.build/DerivedSources-normal/x86_64 -I/Users/ritz/Library/Developer/Xcode/DerivedData/thoughtrail-blthhaitoghgvzenyxayuwazwzfm/Build/Intermediates.noindex/thoughtrail.build/Release-iphonesimulator/thoughtrail.build/DerivedSources/x86_64 -I/Users/ritz/Library/Developer/Xcode/DerivedData/thoughtrail-blthhaitoghgvzenyxayuwazwzfm/Build/Intermediates.noindex/thoughtrail.build/Release-iphonesimulator/thoughtrail.build/DerivedSources -F/Users/ritz/Library/Developer/Xcode/DerivedData/thoughtrail-blthhaitoghgvzenyxayuwazwzfm/Build/Products/Release-iphonesimulator -fmodule-map-file=/Users/ritz/Library/Developer/Xcode/DerivedData/thoughtrail-blthhaitoghgvzenyxayuwazwzfm/Build/Products/Release-iphonesimulator/YogaKit/YogaKit.modulemap -fmodule-map-file=/Users/ritz/Documents/workspace/threesixnine/thoughtrail/source/mobile/thoughtrail/ios/Pods/Headers/Public/yoga/Yoga.modulemap -MMD -MT dependencies -MF /Users/ritz/Library/Developer/Xcode/DerivedData/thoughtrail-blthhaitoghgvzenyxayuwazwzfm/Build/Intermediates.noindex/thoughtrail.build/Release-iphonesimulator/thoughtrail.build/Objects-normal/x86_64/thoughtrail_vers.d --serialize-diagnostics /Users/ritz/Library/Developer/Xcode/DerivedData/thoughtrail-blthhaitoghgvzenyxayuwazwzfm/Build/Intermediates.noindex/thoughtrail.build/Release-iphonesimulator/thoughtrail.build/Objects-normal/x86_64/thoughtrail_vers.dia -c /Users/ritz/Library/Developer/Xcode/DerivedData/thoughtrail-blthhaitoghgvzenyxayuwazwzfm/Build/Intermediates.noindex/thoughtrail.build/Release-iphonesimulator/thoughtrail.build/DerivedSources/thoughtrail_vers.c -o /Users/ritz/Library/Developer/Xcode/DerivedData/thoughtrail-blthhaitoghgvzenyxayuwazwzfm/Build/Intermediates.noindex/thoughtrail.build/Release-iphonesimulator/thoughtrail.build/Objects-normal/x86_64/thoughtrail_vers.o

Kindly advise.

How can i copy bundle file to document directory in react native

$
0
0

I have json file in my bundle. I want to copy file to document directory.

   var path = RNFS.DocumentDirectoryPath +'/data.json'; RNFS.copyFile(`${RNFS.MainBundlePath}/assests/resource/data.json`, path)    .then(() => {        console.log('FILE COPIED');    })    .catch((err) => {        console.log(err.message);    });The file “data.json” couldn’t be opened because there is no such file.

Run into error while executing react-native run-ios

$
0
0

Hi I have created a project using react-native and when I run the command

react-native run-ios

the build fails in the terminal with the following error:

**The following build commands failed:**CompileC /var/root/Library/Developer/Xcode/DerivedData/albums-gnnqffkyfazehwcywcchxrdqkvpd/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/React-RCTText.build/Objects-normal/x86_64/RCTBaseTextInputView.o /ReactNative/albums/node_modules/react-native/Libraries/Text/TextInput/RCTBaseTextInputView.m normal x86_64 objective-c com.apple.compilers.llvm.clang.1_0.compiler(1 failure)

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

Loading bundled static assets in React Native WebView

$
0
0

I have a React Native project where I'm trying to bundle some pre-generated HTML, JS, and CSS with the application, and have a WebView render the web assets using the react-native-community/react-native-webview library. I can load the index.html file just fine, but it won't load the other assets because it seems to be pointing to the wrong path. I've tried using baseUrl but it doesn't seem to work.

My React Native code looks like this:

<WebView  source={{ uri: './assets/index.html' }}  allowFileAccessFromFileURLs={true}  allowUniversalAccessFromFileURLs={true}  originWhitelist={["*"]}  mixedContentMode='always'/>

And then as part of the build process, my assets directory has this structure:

ios|- assets  |- index.html  |- js    |- main.js  |- css    |- main.css

I have this as part of the Copy Bundle Resources step in Xcode, so the assets directory is included with the ios app bundle.

Inside index.html is this code:

<html><head><link rel="stylesheet" href="/css/main.css"></head><body>    Hello World!<script type="text/javascript" src="/js/main.js"></script></body></html>

Going back to the original question, when I run this application, I can see the "Hello world!" so that tells me the HTML is loading, but the CSS and the JS files don't load because as far as I can tell it's trying to load from file:///assets/js/main.js instead of being relative to the app bundle location. Is there any way I can get this to work as desired?

I'd really, really like to avoid having to change the script src from /js/main.js if at all possible. The actual application I'm building auto-generates these files from a separate react project I have.


I have a sample minimal project that demonstrates this issue here:https://github.com/jabbawookiees/psyduck

You can just clone this project then run the following if you want to try fixing it:

yarn installcd ios && pod install && cd ..yarn run react-native run-ios

Best way to structure an app which stores user data

$
0
0

I'm having trouble with an app that I'm making in that I'm unsure of the best way to structure the different components/screens. Specifically, I have a user login feature and currently, I would like to all my different screens to be able to access the data of that user (e.g. their name, email address). I tried using AsyncStorage, however, the problem with this is that my components render before I can retrieve the user details from AsyncStorage, so my home page looks like this:

enter image description here

I.e. the user's name is not displaying after "Good afternoon ...". Additionally, I'm unsure of how ideal using AsyncStorage is for performance, so I'm considering refactoring my app. I use firebase to store my user details and am certain that consistently retrieving the data using the firebase library is bad for performance.

What is the best way to structure my app for this user purpose? I've read about Redux, Context etc. Also, every screen I have is written as a React component, and then in my App.js I make my bottomTabNavigators and stackNavigation using these components, then output them in an App Container. Is this the best way to do it for my purposes? Any advice would be appreciated. Thanks in advance!

Console.error: no permission handler detected.(React Native)

$
0
0

I am coding a simple react native app and am getting a console error when I run the app. It says that there is no permission handler detected and tells me to go through some steps. But I do not know how to do these steps, and if they don't work, I don't know how to solve the problem.

Here is the error:

enter image description here

Here is the podfile:

platform :ios, '9.0'require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'def add_flipper_pods!(versions = {})  versions['Flipper'] ||= '~> 0.33.1'  versions['DoubleConversion'] ||= '1.1.7'  versions['Flipper-Folly'] ||= '~> 2.1'  versions['Flipper-Glog'] ||= '0.3.6'  versions['Flipper-PeerTalk'] ||= '~> 0.0.4'  versions['Flipper-RSocket'] ||= '~> 1.0'  pod 'FlipperKit', versions['Flipper'], :configuration => 'Debug'  pod 'FlipperKit/FlipperKitLayoutPlugin', versions['Flipper'], :configuration => 'Debug'  pod 'FlipperKit/SKIOSNetworkPlugin', versions['Flipper'], :configuration => 'Debug'  pod 'FlipperKit/FlipperKitUserDefaultsPlugin', versions['Flipper'], :configuration => 'Debug'  pod 'FlipperKit/FlipperKitReactPlugin', versions['Flipper'], :configuration => 'Debug'  # List all transitive dependencies for FlipperKit pods  # to avoid them being linked in Release builds  pod 'Flipper', versions['Flipper'], :configuration => 'Debug'  pod 'Flipper-DoubleConversion', versions['DoubleConversion'], :configuration => 'Debug'  pod 'Flipper-Folly', versions['Flipper-Folly'], :configuration => 'Debug'  pod 'Flipper-Glog', versions['Flipper-Glog'], :configuration => 'Debug'  pod 'Flipper-PeerTalk', versions['Flipper-PeerTalk'], :configuration => 'Debug'  pod 'Flipper-RSocket', versions['Flipper-RSocket'], :configuration => 'Debug'  pod 'FlipperKit/Core', versions['Flipper'], :configuration => 'Debug'  pod 'FlipperKit/CppBridge', versions['Flipper'], :configuration => 'Debug'  pod 'FlipperKit/FBCxxFollyDynamicConvert', versions['Flipper'], :configuration => 'Debug'  pod 'FlipperKit/FBDefines', versions['Flipper'], :configuration => 'Debug'  pod 'FlipperKit/FKPortForwarding', versions['Flipper'], :configuration => 'Debug'  pod 'FlipperKit/FlipperKitHighlightOverlay', versions['Flipper'], :configuration => 'Debug'  pod 'FlipperKit/FlipperKitLayoutTextSearchable', versions['Flipper'], :configuration => 'Debug'  pod 'FlipperKit/FlipperKitNetworkPlugin', versions['Flipper'], :configuration => 'Debug'end# Post Install processing for Flipperdef flipper_post_install(installer)  installer.pods_project.targets.each do |target|    if target.name == 'YogaKit'      target.build_configurations.each do |config|        config.build_settings['SWIFT_VERSION'] = '4.1'      end    end  endendtarget 'LocalMainStreet' do  # Pods for LocalMainStreet  pod 'FBLazyVector', :path => "../node_modules/react-native/Libraries/FBLazyVector"  pod 'FBReactNativeSpec', :path => "../node_modules/react-native/Libraries/FBReactNativeSpec"  pod 'RCTRequired', :path => "../node_modules/react-native/Libraries/RCTRequired"  pod 'RCTTypeSafety', :path => "../node_modules/react-native/Libraries/TypeSafety"  pod 'React', :path => '../node_modules/react-native/'  pod 'React-Core', :path => '../node_modules/react-native/'  pod 'React-CoreModules', :path => '../node_modules/react-native/React/CoreModules'  pod 'React-Core/DevSupport', :path => '../node_modules/react-native/'  pod 'React-RCTActionSheet', :path => '../node_modules/react-native/Libraries/ActionSheetIOS'  pod 'React-RCTAnimation', :path => '../node_modules/react-native/Libraries/NativeAnimation'  pod 'React-RCTBlob', :path => '../node_modules/react-native/Libraries/Blob'  pod 'React-RCTImage', :path => '../node_modules/react-native/Libraries/Image'  pod 'React-RCTLinking', :path => '../node_modules/react-native/Libraries/LinkingIOS'  pod 'React-RCTNetwork', :path => '../node_modules/react-native/Libraries/Network'  pod 'React-RCTSettings', :path => '../node_modules/react-native/Libraries/Settings'  pod 'React-RCTText', :path => '../node_modules/react-native/Libraries/Text'  pod 'React-RCTVibration', :path => '../node_modules/react-native/Libraries/Vibration'  pod 'React-Core/RCTWebSocket', :path => '../node_modules/react-native/'  pod 'React-cxxreact', :path => '../node_modules/react-native/ReactCommon/cxxreact'  pod 'React-jsi', :path => '../node_modules/react-native/ReactCommon/jsi'  pod 'React-jsiexecutor', :path => '../node_modules/react-native/ReactCommon/jsiexecutor'  pod 'React-jsinspector', :path => '../node_modules/react-native/ReactCommon/jsinspector'  pod 'ReactCommon/callinvoker', :path => "../node_modules/react-native/ReactCommon"  pod 'ReactCommon/turbomodule/core', :path => "../node_modules/react-native/ReactCommon"  pod 'Yoga', :path => '../node_modules/react-native/ReactCommon/yoga', :modular_headers => true  pod 'DoubleConversion', :podspec => '../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec'  pod 'glog', :podspec => '../node_modules/react-native/third-party-podspecs/glog.podspec'  pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec'  pod 'RNGestureHandler', :path => '../node_modules/react-native-gesture-handler'  target 'LocalMainStreetTests' do    inherit! :complete    # Pods for testing  end  use_native_modules!  # Enables Flipper.  #  # Note that if you have use_frameworks! enabled, Flipper will not work and  # you should disable these next few lines.  add_flipper_pods!  post_install do |installer|    flipper_post_install(installer)  endendtarget 'LocalMainStreet-tvOS' do  # Pods for LocalMainStreet-tvOS  target 'LocalMainStreet-tvOSTests' do    inherit! :search_paths    # Pods for testing  endend

Please help. Thanks.


React Native "RNCSafeAreaView" was not found in the UIManager

$
0
0

enter image description here

I am running a react-native application on Mac. but I am getting "RNCSafeAreaView" was not found in the UIManager.

How to truncate 'back' button for headerTitle in react-navigation?

$
0
0

I'm using react-navigation with StackNavigator. Is there a way to avoid the overlapping of the back button label and the headerTitle by truncating the back button label?

const MainNavigationOptions = {    headerStyle: {        backgroundColor: colors.CiPrimary    },    headerTitleStyle: {        color: 'white',        height: 50,        width: 140    },    headerTintColor: 'white',    headerTitle:<Text>LONG TEXT FOR TESTING</Text>}

Illustration of issue:

Overlapping of back button and header title

Notification not receiving in iOS for react native project

$
0
0

I have a react native project. I am able to receive the FCM token successfully but when trying to send a notification, the app doesn't receive the notification.
The steps I followed are as below:

  1. Created a project in Firebase Console.
  2. Added the Firebase .plist in the projectName through Xcode.
  3. ran npm install --save react-native-firebase
  4. Added in podfile: pod ‘Firebase/Core’
  5. ran pod install
  6. Update AppDelegate.m with #import <Firebase.h> and [FIRApp configure];
  7. Added the APNS in the Firebase Dashboard for iOS App Cloud Messaging.
  8. Updated the capabilities with Push Notification and Background Modes > Remote notification
  9. In info.plist FIRAnalyticsDebugEnabled, FirebaseAppDelegateProxyEnabled, FirebaseScreenReportingEnabled is set to No

using const fcmToken = await firebase.messaging().getToken(); I am able to get token.

Below is the code for the notification listener.

async createNotificationListeners() {    /*     * Triggered when a particular notification has been received in foreground     * */    this.notificationListener = firebase.notifications().onNotification((notification) => {        const {            title,            body        } = notification;        this.custom_data = notification.data;        const localNotification = new firebase.notifications.Notification({                show_in_foreground: true,            })            .setSound('default')            .setNotificationId(notification.notificationId)            .setTitle(notification.title)            .setBody(notification.body)        firebase.notifications()            .displayNotification(localNotification)            .catch(err => Alert.alert(err));    });    /*     * If your app is in foreground and background, you can listen for when a notification is clicked / tapped / opened as follows:     * */    this.notificationOpenedListener = firebase.notifications().onNotificationOpened((notificationOpen) => {        if ("title" in notificationOpen.notification.data) {            const {                title,                body,                secret_key,                user_id,                realm_id,                user_os,                user_location            } = notificationOpen.notification.data;            this.props.navigation.navigate('Verify', {                title: title,                body: body,                secret_key: secret_key,                user_id: user_id,                realm_id: realm_id,                user_os: user_os,                user_location: user_location            });        } else {            const {                title,                body,                secret_key,                user_id,                realm_id,                user_os,                user_location            } = this.custom_data;            this.props.navigation.navigate('Verify', {                title: title,                body: body,                secret_key: secret_key,                user_id: user_id,                realm_id: realm_id,                user_os: user_os,                user_location: user_location            });        }    });    /*     * If your app is closed, you can check if it was opened by a notification being clicked / tapped / opened as follows:     * */    const notificationOpen = await firebase.notifications().getInitialNotification();    if (notificationOpen) {        const {            title,            body,            secret_key,            user_id,            realm_id,            user_os,            user_location        } = notificationOpen.notification.data;        this.props.navigation.navigate('FCM', {            title: title,            body: body,            secret_key: secret_key,            user_id: user_id,            realm_id: realm_id,            user_os: user_os,            user_location: user_location        });    }    /*     * Triggered for data only payload in foreground     * */    this.messageListener = firebase.messaging().onMessage((message) => {        console.log("JSON.stringify:", JSON.stringify(message));    });}

Please do let me know if more details required.

EDIT

I have updated the code. Now I am able to get firebase.messaging().onMessage() code working and receive a trigger in the foreground. Still unable to get the notification when the app is in the background. Below is the change which I have made.

const fcmToken = await firebase.messaging().getToken();firebase.messaging().ios.registerForRemoteNotifications().then((flag)=>{        console.log("registered", flag);      }).catch((err)=>{        console.log("message", err);      });

AppDelegate.m

#import "AppDelegate.h"#import <React/RCTBridge.h>#import <React/RCTBundleURLProvider.h>#import <React/RCTRootView.h>#import <Firebase.h>#import "RNFirebaseNotifications.h"#import "RNFirebaseMessaging.h"@implementation AppDelegate- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions{  [FIRApp configure];  [[UNUserNotificationCenter currentNotificationCenter] setDelegate:self];  [RNFirebaseNotifications configure];  //[FIRApp configure];  [Fabric with:@[[Crashlytics class]]];  RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions];  RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge                                                   moduleName:@"CymmAuth"                                            initialProperties:nil];  rootView.backgroundColor = [[UIColor alloc] initWithRed:1.0f green:1.0f blue:1.0f alpha:1];  self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];  UIViewController *rootViewController = [UIViewController new];  rootViewController.view = rootView;  self.window.rootViewController = rootViewController;  [self.window makeKeyAndVisible];  return YES;}- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge{#if DEBUG  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];#else  return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];#endif}- (void)application:(UIApplication *)application didReceiveRemoteNotification:(nonnull NSDictionary *)userInfofetchCompletionHandler:(nonnull void (^)(UIBackgroundFetchResult))completionHandler{  [[RNFirebaseNotifications instance] didReceiveRemoteNotification:userInfo fetchCompletionHandler:completionHandler];}- (void)application:(UIApplication *)application didRegisterUserNotificationSettings:(UIUserNotificationSettings *)notificationSettings {  [[RNFirebaseMessaging instance] didRegisterUserNotificationSettings:notificationSettings];}-(void) userNotificationCenter:(UNUserNotificationCenter *)center didReceiveNotificationResponse:(UNNotificationResponse *)response withCompletionHandler:(void (^)(void))completionHandler {  [[RNFirebaseMessaging instance] didReceiveRemoteNotification:response.notification.request.content.userInfo];  completionHandler();}@end

Do let me know if I am missing anything. firebase.notifications().onNotification() doesn't get triggered

How to use QR Code to open AppStore or deep link an app?

$
0
0

I'm currently developing an app that uses QR code to identify products. Here are the use cases:

  1. If user hasn't installed the app, scanning the QR code should take them to AppStore / PlayStore to download the app.
  2. If the app is installed, the user can use the app's scanner. In this case it'll extract the info (JSON format) from the QR code.

I'm not sure if QR code can achieve this. I know the first requirement needs a link to the AppStore. The 2nd requirement is just plain old JSON data. I don't know how to combine them into one QR code. Is this possible?

Thanks!

React Native App using Google OAuth shows "This app isn't verified" for some users

$
0
0

We're in the process of publishing our app but coming across an issue with Google OAuth consent screen displaying "This app isn't verified" (we're currently testing on iOS). However it only appears for SOME users. I'm sure all users are using the same build from TestFlight.

The was developed using React Native and uses @react-native-community/google-signin:v3.0.2 for Google OAuth. What could be the reason for this issue to only be happening for some users and not others? It's really difficult to troubleshoot if I'm unable to reproduce on my device. Are there any cache or settings that need to be reset in order for this to appear again? Any leads would be appreciated.

Thank you

Can I offer an optional free trial for iOS auto-renewal subscriptions?

$
0
0

For example, I have one account for my app and two app store accounts.

can use the free trial for two month with both App Store accounts. (If you have more accounts, you will be able to use more periods than examples)Is this just a problem with SandBox?

If not Is there a way to store this on my server and then branch it?

If the value of is_using_free_trial stored in my app is false, I want to be able to use the free trial, and when it is true, I would like to make the payment immediately without the free trial.

Can this be done in the App Store?I implement it via ReactNative and I couldn't find any relevant options at react-native-iap

react native stream ios screen to local server

$
0
0

I am building a React Native application to be able to stream my phone content to a local NodeJS server.

On android, it works great with MediaProjectionManager but on iOS this is more complicated.

I tried to do it with RPScreenRecorder, this is my code

#import "ScreenShare.h"@implementation ScreenShareRCT_EXPORT_MODULE();- (NSString *) imageFromSampleBuffer:(CMSampleBufferRef) sampleBuffer{  CVImageBufferRef imageBuffer = CMSampleBufferGetImageBuffer(sampleBuffer);  CIImage *ciImage = [CIImage imageWithCVPixelBuffer:imageBuffer];  CIContext *temporaryContext = [CIContext contextWithOptions:nil];  CGImageRef videoImage = [temporaryContext                           createCGImage:ciImage                           fromRect:CGRectMake(0, 0,                                               CVPixelBufferGetWidth(imageBuffer),                                               CVPixelBufferGetHeight(imageBuffer))];  UIImage *image = [[UIImage alloc] initWithCGImage:videoImage];  NSString *base64String = [UIImagePNGRepresentation(image) base64EncodedStringWithOptions:NSDataBase64Encoding64CharacterLineLength];  CGImageRelease(videoImage);  return (base64String);}- (NSArray<NSString *> *)supportedEvents{  return @[@"ImageCaptured"];}RCT_REMAP_METHOD(start,                 startWithResolver:(RCTPromiseResolveBlock)resolve                 rejecter:(RCTPromiseRejectBlock)reject){  NSMutableDictionary *result = [[NSMutableDictionary alloc] init];  [result setObject:@true forKey:@"success"];  if (@available(iOS 11.0, *)) {    if([RPScreenRecorder.sharedRecorder isRecording]) {      return resolve(result);    }    [RPScreenRecorder.sharedRecorder startCaptureWithHandler:^(CMSampleBufferRef  _Nonnull sampleBuffer, RPSampleBufferType bufferType, NSError * _Nullable error) {      dispatch_sync(dispatch_get_main_queue(), ^{        if(bufferType == RPSampleBufferTypeVideo) {          NSString *strEncoded = [self imageFromSampleBuffer:sampleBuffer];          [self sendEventWithName:@"ImageCaptured" body:@{@"image": strEncoded}];        }      });    } completionHandler:^(NSError * _Nullable error) {      if(error == NULL) return resolve(result);      // The user declined application recording      if([error code] == -5801) {        return reject(@"401", [error localizedDescription], error);      }      reject([NSString stringWithFormat:@"%ld", [error code]], [error localizedDescription], error);    }];  } else {    NSError * error = [NSError errorWithDomain:@"com.xxx.ConnectApp" code:426 userInfo:nil];    reject([NSString stringWithFormat:@"%ld", [error code]], @"Failed to start screen capture", error);  };}RCT_REMAP_METHOD(stop,                 stopWithResolver:(RCTPromiseResolveBlock)resolve                 rejecter:(RCTPromiseRejectBlock)reject){  NSMutableDictionary *result = [[NSMutableDictionary alloc] init];  [result setObject:@true forKey:@"success"];  if (@available(iOS 11.0, *)) {    [RPScreenRecorder.sharedRecorder stopCaptureWithHandler:^(NSError * _Nullable error) {      if(error == NULL) return resolve(result);      reject([NSString stringWithFormat:@"%ld", [error code]], [error localizedDescription], error);    }];  } else {    NSError * error = [NSError errorWithDomain:@"com.xxx.ConnectApp" code:426 userInfo:nil];    reject([NSString stringWithFormat:@"%ld", [error code]], @"Failed to stop screen capture", error);  }}@end

The video quality is not really good and it stops when I am outside the app. The goal of the app is to be able to stream outside the app and not the app.

I investigate another solution to create an airplay server on my NodeJS local server but I can not found any documentation, the only documentation or module I get are old and did not work.


how to disable rotation in React Native?

$
0
0

I would like to support only portrait view. How can I make a React Native app not to autorotate?I tried searching documentation and Github issues, but I didn't find anything helpful.

React navigation not showing the right screen

$
0
0

I have created a navigation setup for my application that should start off with a welcome screen on the welcome screen you find two buttons, one for registering and the other for logging in.

When the user registers or logs in he get sent to other screens. I have created a stack navigator between the log in and register screen and put them in a loginFlow constant and another between the welcome screen and the loginFlow constant and the navigation between these screens works, but for some reason the welcome screen doesn't get shown first instead I get the sign up screen (register screen).

Why is that the case and how can i make the welcomeScreen get shown first

import React from "react";import { View } from "react-native";import WeclomeScreen from "./app/screens/WelcomeScreen";import MainScreen from "./app/screens/MainScreen";import AccountScreen from "./app/screens/AccountScreen";import { Provider as AuthProvider } from "./app/context/AuthContext";import { createMaterialBottomTabNavigator } from "react-navigation-material-bottom-tabs";import SignupScreen from "./app/screens/SignupScreen";import { createAppContainer, createSwitchNavigator } from "react-navigation";import { createStackNavigator } from "react-navigation-stack";import ResultShowScreen from "./app/screens/ResultShowScreen";import ResolveAuthScreen from "./app/screens/ResolveAuthScreen";import SigninScreen from "./app/screens/SigninScreen";import ArticleSaveScreen from "./app/screens/ArticleSaveScreen";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: createStackNavigator({    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>  );};

NSInvalidArgumentException on iOS device

$
0
0

NSInvalidArgumentException on iOS device

I'm getting this error when I try to run my expo app on my iPhone. I have a lot of files and not sure what is this and where is it coming from. If anyone knows, please help me. As soon as I run the app, the app crashes.

Cancel ApplePay and GooglePay dialog

$
0
0

I'm trying to test an App and I want to click on the cancel button or any other button on the (Apple|Google)Pay dialog and I can't find a way to do that !

enter image description here

React Native broadcast and discover nearby devices

$
0
0

First off: This is more of a logical question than a code-specific question.

I am trying to create a view similar to the iOS AirDrop view where users can see other users. This means, every user needs to broadcast/advertise their custom username, which can be seen by all other nearby users that scan the area.

I have tried using react-native-ble-plx, since I read on the Apple developer forum that iPhones can act as BLE (bluetooth low energy) peripherals. (Also, I read that newer Android devices support this as well)

I've tried the following:

import ble, { BleManager, Characteristic } from 'react-native-ble-plx';// ...const bleManager = new BleManager();bleManager.startDeviceScan(null, null, async (e, d) => {    if (e) console.log(`BT Error: ${JSON.stringify(e)}`);    if (d && d.id && d.isConnectable) {        console.log(`Connecting to: ${d.id} ('${d.name}')...`);        const device = await d.connect();        const services = await device.services();        console.log('services: ', services.join(', '));        const characteristic = await device.writeCharacteristicWithResponseForService(BLE_SERVICE_UUID, BLE_SERVICE_UUID, '123');        console.log(`Characteristics: ${JSON.stringify(characteristic)}`);    }});

But I haven't found a way to broadcast a value which others can read, is that even possible with BLE?

I've also looked into beacons (specifically react-native-beacons-manager), but I'm not sure if that is what I want since an Android/iOS phone is not a 'beacon'..

So my question is: Are there technologies/libraries that allow broadcasting of a message (my custom username) which others can see? Ideally I want to communicate between them, like exchanging a token, but that's not a requirement.

I'd appreciate any help or pointings into the right direction here, thanks!

Viewing all 16562 articles
Browse latest View live