I need to upgrade my React-native app from 0.61.0 to 0.62.0. The best safety way to do it manually with React Native Upgrade Helper https://react-native-community.github.io/upgrade-helper. But during this way a lot of changes need to do in ios/MyProject.xcodeproj/project.pbxproj file in Xcode. But I'm not so familiar with it. Cann somebodt recommend me please how to make changes in project.pbxproj in Xcode for upgrade of RN version?
↧
How to change manually project.pbxproj file in Xcode during React-native upgrade?
↧
Push Notifications Configuration Error - React Native
I am trying to create push notifications in my react native project both in iOS and android.
I have followed both the configuration instructions for react-native-push-notification and push-notification-ios, however when I run my app I get the following error.
After doing some online research I can't seem to find a fix for this problem.
Here is my code
import PushNotificationIOS from '@react-native-community/push-notification-ios';import PushNotification from "react-native-push-notification";const configure = () => { PushNotification.configure({ onRegister: function(token) { //process token }, onNotification: function(notification) { // process the notification // required on iOS only notification.finish(PushNotificationIOS.FetchResult.NoData); }, permissions: { alert: true, badge: true, sound: true }, popInitialNotification: true, requestPermissions: true, });}; export { configure, };↧
↧
Using :modular_headers with RealmJS
I am using both RealmJS and RealmSwift in my React Native project. I've previously been able to do this, but after upgrading to RealmJS 6.0.0, I am getting the error that I have multiple duplicate symbols:
// lots and lots of errors ...duplicate symbol 'realm::_impl::WeakRealmNotifier::~WeakRealmNotifier()' in: /Users/ericwiener/Library/Developer/Xcode/DerivedData/MyApp-dquwvaaenvelplfebdxfllgbnecd/Build/Products/Release-iphonesimulator/Realm/libRealm.a(weak_realm_notifier.o) /Users/ericwiener/Library/Developer/Xcode/DerivedData/MyApp-dquwvaaenvelplfebdxfllgbnecd/Build/Products/Release-iphonesimulator/RealmJS/libRealmJS.a(weak_realm_notifier.o)ld: 796 duplicate symbols for architecture i386I believe the issue is coming from the fact that I needed to install the Realm pod myself in order to use the RealmSwift pod, but RealmJS bundles both RealmJS and Realm together.
Here is where I include Realm in my Podfile:
# realmpod 'RealmSwift', :modular_headers => truepod 'Realm', :modular_headers => trueDoes anyone know a way to use both RealmSwift and RealmJS together for v6.0.0? This has been working perfectly for me before this upgrade.
Edit:
Also wanted to include that I've already tried clearing derived data, the build cache, and deleting Pods folder and reinstalling.
↧
TypeError: null is not an object (evaluating '_reactNativeSpotLib.default.show')
I'm getting this error while creating a package in react-native iOS side. TypeError: null is not an object (evaluating '_reactNativeSpotLib.default.show').
I'm creating this package for a simple alert demo and trying to call on button click and getting this error.
Anyone can help me out of this?
↧
React Native: Expo app could not open my project
I am starting on a react native project but I have a problem with Expo opening my project on my iOS device. My devices are connected to the same wifi network. It takes very long to load and the message 'This is taking much longer than it should. You might want to check your internet connectivity' appears. After awhile more, an error occurs and I experienced 3 different types of error, with different errors occurring each time I try to reopen my project.
1st error: 'There was a problem running the requested app.'
2nd error: 'There was a problem loading the requested app. It looks like you may be using a LAN URL. Make sure your device is on the same network as the server or try using a tunnel.'
I tried using tunnel but it does not resolve the problem.
3rd error: A red screen appears with the following error:
Could not connect to development server.
Ensure the following:- Node server is running and available on the same network - run 'npm start' from react-native root- Node server URL is correctly set in AppDelegate- WiFi is enabled and connected to the same network as the Node Server
ABI37_0_0facebook::ABI37_0_0React::JSIExecutor::defaultTimeoutInvoker(std::__1::function const&, std::__1::function, std::__1::allocator > ()>)ABI37_0_0facebook::ABI37_0_0React::JSIExecutor::defaultTimeoutInvoker(std::__1::function const&, std::__1::function, std::__1::allocator > ()>)5A83D0CF-8FB9-3727-8A32-012D20A47EC85A83D0CF-8FB9-3727-8A32-012D20A47EC85A83D0CF-8FB9-3727-8A32-012D20A47EC8409609CD-8410-38E1-BA5D-BDED609D2018409609CD-8410-38E1-BA5D-BDED609D2018CFRunLoopRunSpecificGSEventRunModalUIApplicationMainExponent876FB49A-BFBA-37BF-AD37-6FFC90F7F981
Here is what I found when I opened the AppDelegate file in my project directory:
/** * Copyright (c) Facebook, Inc. and its affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */#import "AppDelegate.h"#import <React/RCTBridge.h>#import <React/RCTBundleURLProvider.h>#import <React/RCTRootView.h>@implementation AppDelegate- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions{ RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions]; RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge moduleName:@"HelloWorld" 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}@endI have tried uninstalling and reinstalling node and expo, disabling firewall, initializing a new project and try to open it but all methods didn't work. Anybody knows what is the issue here? Thanks in advance!
↧
↧
ScrollView rounded corners
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,}}↧
How to building React Native App using WebRtc
Thank you for your help in advance.
I want to make a new WebRtc mobile application for video calling using react native, i checked many articles but not getting exact information how to start. Can any person please help me and guide me the path to create an application.
.\gradlew /cleanFAILURE: Build failed with an exception.
Where:Build file 'C:\Jig\New folder\react-native-demoapp-master\react-native-demoapp-master\node_modules\react-native-webrtc\android\build.gradle' line: 30
What went wrong:A problem occurred evaluating project ':WebRTCModule'.
Could not find method implementation() for arguments [com.facebook.react:react-native:+] on project ':WebRTCModule'.
Try:Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.
BUILD FAILED
Total time: 2.903 secs
↧
React Native running app on device without server
Its unbelievable how bad the documentation is for React Native, they just put as little as possible for everything. I've already managed to run my app using option 1 but option 2 is even more unclear: https://facebook.github.io/react-native/docs/running-on-device-ios.html
I don't know there's no example of the terminal command react-native bundle in full so I know what is actually required there. For example --entry-file <path> what path? The whole path from my hard drive root to this folder, or just the file itself? --bundle-output....? What the hell do I need to put for that? I don't know why they need to make it so damn unclear.
I'm surprised there's no other resources online that give the instructions more clearly. I guess that's why there aren't so many React Native apps on the app store.
↧
React Native: How to select the next TextInput after pressing the "next" keyboard button?
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!
↧
↧
Android equivalence of iOS ActionSheet
What is the Android equivalence of the UIActionSheet in the iOS SDK? I am working on a React-Native project and need to maintain the use of native controls where possible. I have not come across an npm package or other that makes use of the respective plartform 'actionsheet'. They all seem to use native actionsheet in iOS, and a javascript mock of the iOS actionsheet for Android (which makes it non-native on Android). If I can know what android shows where iOS shows an actionsheet then I can make use of the RN Android component for android and actionsheet for iOS. I hope this is a clear question.
↧
iOS build fails due to RNFirebase's collision with use_frameworks! in Podfile
I'm trying to implement a third party Native SDK into my iOS app but it fails on RNFirebase(v5) if I enable use_frameworks! to dynamically load it as a framework.
I get such errors: React/RCTViewManager.h' file not found
Couldn't upload screenshot here due to stackoverflow's reputation points but see it here on imgur.
I know that there is another version(v6) of RNFirebase library and has breaking changes to mitigate but I'm not sure if it'll have similar problem.
Help is greatly appreciated.
↧
3D Animations on View with React Native
I want to implement a flip effect in my React Native app, similar like described here:
https://www.codementor.io/reactjs/tutorial/building-a-flipper-using-react-js-and-less-css
My question is. Can I achieve it somehow with the help of some library like 'Animations'https://facebook.github.io/react-native/docs/animations.html or I have to play with 'plain' CSS styles.
What is the 'good practive' for such animations in React Native?
class CardBack extends Component { render() { return (<TouchableOpacity onPress={this.flip}><View style={styles.scrumCardBorder}><View style={styles.cardBack}></View></View></TouchableOpacity> ); } flip() { this.setState({flipped: !this.state.flipped}) }}class CardFront extends Component { render() { return (<TouchableOpacity><View style={styles.scrumCardBorder}><View style={styles.cardFront}><Text style={styles.cardValue}>5</Text></View></View></TouchableOpacity> ); }}↧
Trying to open viber app from my react native app. (iOS)
I am trying to open viber app from my react-native app but its not working. I am getting below error.
Error: Unable to open URL: viber://contact?number=xxxxxxxxxxxx. Add viber to LSApplicationQueriesSchemes in your Info.plist.I have listed viber in my Info.plist
<key>LSApplicationQueriesSchemes</key><string>viber://</string>This is my code trying to open viber.
Linking .canOpenURL('viber://contact?number=xxxxxxxx') .then(res => { console.log("Viber response->",res) if(res) { Linking.openURL('viber://contact?number=xxxxxxxxx') } }) .catch(err => { console.log("Viber Error:", err) })↧
↧
Unable to call swift function from objective-c in react-native
I'm fairly new to objective-c and swift so forgive me if this sounds dumb. Basically what I'm trying to do is *expose** a swift function to both react-native(so it can be used in JS) and to be used in objective-c. The issue I'm having is this dreaded "Duplicate interface definition for class...". I have researched and tried everything it seems but can not get rid of this error. I'm starting to wonder if is possible to do this. It seems so simple yet I just can't figure it out!
Here is my code:
AppDelegate.m
#import "MyApp-Swift.h"#import "MyApp-Bridging-Header.h"MyApp-Swift.h
#import "React/RCTEventEmitter.h"@interface Counter : RCTEventEmitter- (void)start;- (void)stop;@endMyApp.swift
import Foundationimport UIKit@objc(Counter)class Counter: RCTEventEmitter { @objc func start(){ } @objc func end(){ }}MyApp-Bridging-Header.h
#import <Foundation/Foundation.h>#import "React/RCTBridgeModule.h"#import "React/RCTEventEmitter.h"@interface RCT_EXTERN_MODULE(Counter, RCTEventEmitter)RCT_EXTERN_METHOD(start);RCT_EXTERN_METHOD(end);@endInside AppDelegate.m didFinishLaunchingWithOptions() function
Counter* CounterInstance = [[Counter alloc] init];[CounterInstance start];If I remove the code from MyApp-Swift.h then I get the error "No visible @interface for..." BUT fixes the "Duplicate interface error" in MyApp-Bridging-Header.h. It seems like it contradicts each other!? How are you supposed to call a swift function from objective-c while also exposing the same function to JS?
↧
Pod install not working in react-native mac os catalina 10.15
Error: System/Library/Frameworks/Ruby.framework/Versions/2.3/usr/bin/ruby: bad interpreter: No such file or directory
in mac os catalina
↧
Is is possible on iPad OS to detect if the keyboard is in floating mode?
We're running into a specific bug on iOS/iPadOS which seems to be triggered when the iPad is showing the floating (iphone-like) keyboard on screen (instead of the anchored one)
Our issue is specific to React Native and the KeyboardAvoidingView component. When the component renders and the keyboard is floating, the KeyboardAvoidingView completely mis-calculated the height required for the keyboard and hides about 95% of the screen height instead.
The KeyboardAvoidingView itself doesn't seem to have a way to detect whether or not the floating keyboard is on.
Is there a particular API that can be tapped into to detect this keyboard mode so we can turn off the KeyboardAvoidingView for it?
The Keyboard events (keyboardWillShow, keyboardDidShow, etc) don't seem to return any specific clues.
↧
How to get/set the iOS "preferred language" from a RN app?
We are developing a React Native app supporting three languages. For various reasons, we must have specific language selection logic in the app and a language selector within the app.
In iOS 13 there is a new "Preferred language" selector in the system settings for the app. We would want the in-app language selector to change the preferred language, and conversely that the user could also change their language in the system settings.
How can I read/write the iOS "Preferred language" in a React Native app?
↧
↧
How to implement a popup/banner in the mobile app that displays a warning if the installed version of the app is outdated?
I am facing a jira ticket that introduces a banner (or a popup, doesn't matter) that displays a warning message if the installed version is outdated.
We keep the app's version in the config file locally. I thought that comparing it to the one in the store would do the job.
I have done a research and found possible solutions:
For iOS, there is a handy api https://itunes.apple.com/lookup?bundleId=${bundleId}. It does the job and pretty reliable
For Android, the only option I know so far is to scrap the app's web page in the Play Market and extract the current version. This one is not very reliable.
So, I was wondering, what other options do I have?
Thanks in advance!
↧
The method or property Expo.Notifications.dismissNotification is not available on ios
Error:
The method or property Expo.Notifications.dismissNotification is not available on ios
Environment info:
SDK Version: 37.0.0Platforms(Android/iOS/web/all): iOS 13.3expo-cli 3.18.0iPhone 11 ProexpoAppVersion 1.12.0
Repro steps:
Call Notifications.dismissNotification on a notification received via Notifications.addListener
↧
React Native IOS Stop Screen Recording
i'm creating an app for a premium video streaming. What i need it to stop video when detecting screen recording or display a blank page when user start to record our screen. We did it android using flag_secure. There is any package or a way to make it for IOS.
↧