So I started a react native app using create-react-native-app and it created a lot of boilerplate code. Android is in JAVA which I am fine with. But the iOS is in Objective-C and I am more familiar with Swift. Is there anything I can do about that? I know most of my code is going to be in JavaScript anyways, but just wondering anyways.

I have created a React Native application for iOS and Android. It is using some custom fonts. Please check the size of the folders :

1. Font folder - 18mb

2. Assets folder - 1mb

3. coding files - 118kb

This is in my package.json file.

But my complete app is showing on the app store is around 65.5mb and after download it's size is showing around 77.5 MB.

Can anyone suggest me what should I do to reduce my iOS application size? These libraries are necessary for different functionalities of my application. Please help me to reduce the size of the app. There are multiple tutorials available to reduce android application size but how can I reduce my iOS application size.

Also, I have tried to minimize the size of the .otf file but not find any tool or website that works for a mobile app.

Thank you.

I am receiving notification using Firebase but now I want to add action buttons in ios push notification.

For displaying a notification in foreground I am using below code,

const localNotification = new firebase.notifications.Notification()      .setTitle(title)      .setBody(body);    firebase      .notifications()      .displayNotification(localNotification)      .catch(err => console.log('displayNotification error', err));

react-native-firebase v5.0 is used.

I need a library for react native in which user can capture a video and then select start and end point from video frames between which user wants to clip the video and need preview of that start and end point video.

I had tried React-native-video-processing library it is working for android but in ios it is not working and gives errors related to Swift Version conflict in Xcode.

So is there any suggestions for react native library for above video clipping feature which is compatible with Android and iOS both?

I have a doubt and I am not able to solve the problem of having buttons to perform an action (accept or reject) within a push-notification in iOS with react-native-firebase. For Android I can do it but for iOS I can't find a way to register the action. Next I show how is the code I have.

const notificationListener = () => {  firebase.notifications().onNotification((notification) => {    const localNotification = new firebase.notifications.Notification({        sound: 'default',        show_in_foreground: true,      })      .setSound('default')      .setBody(notification.body)      .setData(notification.data)      .setTitle(notification.title)      .setSubtitle(notification.subtitle)      .setNotificationId(notification.notificationId);    if (Platform.OS === 'android') {            localNotification        .android.setBigText(notification.body)        .android.setSmallIcon('ic_noti_logo_hnc')        .android.setLargeIcon('ic_launcher')        .android.setVisibility(firebase.notifications.Android.Visibility.Public)        .android.setChannelId(CHANNEL_NOTIFICATIONS.CHANNEL_ID)        .android.setPriority(firebase.notifications.Android.Priority.High);      if (isEqual(localNotification.data.set_delay_time, "true")){        // Build an action        const acceptAction = new firebase.notifications.Android.Action('accept_action', 'default', 'Accept');        const rejectAction = new firebase.notifications.Android.Action('reject_action', 'default', 'Reject');        localNotification          .android.addAction(acceptAction)          .android.addAction(rejectAction);      }    } else if (Platform.OS === 'ios') {      localNotification        .ios.setBadge(notification.ios.badge);    }    firebase.notifications().displayNotification(localNotification)      .catch(err => console.error(err));  });};

What I intend to do is something similar to what you find with Android but the only thing I found the most is IOSNotification.alertAction.

Could someone guide me with this? From already thank you very much!

Nico.

Recently I am facing a weird problem on IOS with React Native when using XMLHttpRequest to convert path uri to Blob. It gives a random network request error. So sometimes it works and sometimes not on the same network. The error only happens on physical IOS devices (Android works fine) and not on the IOS emulator on my computer.

I am using React Native: 0.61.5 and iOS 13. The code worked on IOS 12 devices.

Code:

export function urlToBlob(url) {  return new Promise((resolve, reject) => {    const xhr = new XMLHttpRequest();    xhr.onerror = function() {      reject(new Error('uriToBlob failed'));    };    xhr.onreadystatechange = () => {      if (xhr.readyState === 4) {        resolve(xhr.response);      }    };    xhr.open('GET', url);    xhr.responseType = 'blob'; // convert type    xhr.send();  });}   

I also tried react native fetch which gives the same problems.

Info.pl list

<key>NSAllowsArbitraryLoads</key><true/><key>NSExceptionDomains</key><dict><key>localhost</key><dict><key>NSExceptionAllowsInsecureHTTPLoads</key><true/></dict></dict></dict>

I don't know if it is possible, but a solution might be to work around fetch and convert the path uri to blob without a http request.

I'm trying to use react-native-track-player library in my project for both ios and android and I faced a problem.

All my files(remote URLs) are .m4a and they're playing just fine on android but the library raises an error on ios: {“error”: “Cannot Open”, “type”: “playback-error”}

When I replace .m4a file with .mp3 it works on ios but I would like to use .m4a.

Does anyone know why it does not work on iOS but works on android with .m4a? And how to force it to work on ios without converting m4a to mp3?

P.S. This library suits my needs very well so I want to keep it

My idea is create Report Viewer application for both Android and IOS, (could be good on ReactNative also)

1. BaseApp: open ReportApp via URL_Scheme to register BaseApp URL_Scheme
2. ReportApp: send request to get json_spec to BaseApp
3. ReportApp: read api from spec, and send request back to BaseApp get and display data (table, chart,...)

I find some technologies, that I think it could solve my problem:

1. Inter Process Communication
2. Android Intent
3. Android Content Provider
4. Or, May I use custom REST server on my app

Anyone can give me the best way. Could you please give some docs or resources. Thank so much!

I'm working on react native 0.59.2 on ios, everything's fine when running the debug mode, but when i pack the release package and run it on iphone, it's crashed just after open the app, and only clue i got blow which is printed in xcode console

* Terminating app due to uncaught exception 'RCTFatalException: Unhandled JS Exception: undefined is not an object (evaluating 'k.Image.propTypes.style')', reason: 'Unhandled JS Exception: undefined is not an object (evaluating 'k.Image.propTypes.style'), stack:@1235:4438h@2:1670@1228:100h@2:1670@366:189h@2:1670@11:54h@2:1670d@2:868global code@3004:4'* First throw call stack:(0x19d6e4164 0x19d3f8c1c 0x102753924 0x1027500bc 0x19d6ead14 0x19d5b3de8 0x19d5b4a10 0x102766244 0x1027a3468 0x1027a31c8 0x19d382ec4 0x19d38433c 0x19d38a85c 0x19d38b290 0x19d394928 0x19d3eb714 0x19d3f19c8)libc++abi.dylib: terminating with uncaught exception of type NSException

I searched whole project with key word Image.propTypes.style and Image.propTypes but nothing is showed,

here is my package.json

{"name": "cancle","version": "0.0.1","private": true,"scripts": {"start": "node node_modules/react-native/local-cli/cli.js start -- --reset-cache","mock": "node --harmony ./mock/server.js","test": "jest","link": "react-native link",

},"dependencies": {"@react-native-community/async-storage": "^1.11.0","@remobile/react-native-qrcode-local-image": "^1.0.4","code-push-cli": "^2.1.9","color": "^3.0.0","immutable": "^3.8.2","jcore-react-native": "^1.8.0","jpush-react-native": "^2.2.5","native-base": "^2.4.5","node-forge": "^0.7.5","prop-types": "^15.7.2","react": "16.8.3","react-immutable-render-mixin": "^0.9.7","react-native": "0.59.2","react-native-camera": "^1.1.4","react-native-code-push": "^5.3.2","react-native-contacts": "^5.0.4","react-native-deprecated-custom-components": "^0.1.2","react-native-device-info": "^0.21.5","react-native-extended-stylesheet": "^0.8.1","react-native-fast-image-dafy": "^5.0.12","react-native-fs": "^2.10.14","react-native-htmlview": "^0.13.0","react-native-image-picker": "^0.26.7","react-native-image-progress": "^1.1.1","react-native-input-scroll-view": "^1.6.7","react-native-permissions": "^1.1.1","react-native-qrcode-scanner": "^1.0.1","react-native-qrcode-svg": "^5.0.7","react-native-render-html": "^4.2.0","react-native-router-flux": "^4.0.0-beta.31","react-native-scrollable-tab-view": "^1.0.0","react-native-sf-drawer": "^1.0.2","react-native-shadow": "^1.2.2","react-native-shadow-cards": "^1.0.2","react-native-snap-carousel": "^3.7.2","react-native-storage": "^0.2.2","react-native-svg": "^6.5.3","react-native-swiper": "^1.5.13","react-native-view-shot": "^2.4.0","react-native-webview": "^5.12.1","react-redux": "^5.0.7","recyclerlistview": "^1.3.4","redux": "^4.0.0","redux-logger": "^3.0.6","redux-persist": "^5.9.1","redux-saga": "^0.16.0","rn-fetch-blob": "^0.10.13","teaset": "^0.6.0" },"devDependencies": {"@babel/core": "^7.10.2","@babel/plugin-proposal-decorators": "^7.10.1","@babel/runtime": "^7.10.2","babel-jest": "^26.0.1","babel-preset-react-app": "^9.1.2","fs.promised": "^3.0.0","jest": "^26.0.1","koa": "^2.5.1","koa-body": "^2.5.0","koa-compose": "^4.0.0","koa-route": "^3.2.0","koa-router": "^7.4.0","koa-static": "^4.0.2","metro-react-native-babel-preset": "^0.59.0","react-test-renderer": "16.8.3","redux-devtools-extension": "^2.13.5","remote-redux-devtools": "^0.5.12","remote-redux-devtools-on-debugger": "^0.8.3" },"jest": {"preset": "react-native" },"main": "index.js","license": "MIT"}

please anyone gives some advices thanks a lot!!

In Xcode, I get the following error during archiving

Showing All Messages: Directory not found for option '-L/Users/<user>/Library/Developer/Xcode/DerivedData/Mobile-ffdrrqgiyphlinerkjxrqqqeocrs/Build/Intermediates.noindex/ArchiveIntermediates/Mobile/BuildProductsPath/Release-iphoneos/React'ld: library not found for -lRNFirebaseclang: error: linker command failed with exit code 1 (use -v to see invocation)

I get this error when I try to archive it.

When I try to build it using the command $ react-native run-iosin the terminal (with $ react-native start to run metro bundler), I get:

error Failed to build iOS project. We ran "xcodebuild" command but it exited with error code 65. To debug build logs further, consider building your app with Xcode.app, by opening Mobile.xcworkspace

** BUILD FAILED **The following build commands failed:    Ld build/Mobile/Build/Products/Debug-iphonesimulator/Mobile.app/UmappedMobile normal x86_64(1 failure)

Podfile:

# Uncomment the next line to define a global platform for your projectplatform :ios, '10.3'target 'Mobile' do  # Uncomment the next line if you're using Swift or would like to use dynamic frameworks  # use_frameworks!  libPath = '..'  nodeModules = "#{libPath}/node_modules"  rn_path = "#{nodeModules}/react-native"  # Pods for Mobile  pod 'yoga', path: "#{rn_path}/ReactCommon/yoga"  pod 'React', path: rn_path, subspecs: ['Core','CxxBridge','DevSupport','RCTActionSheet','RCTAnimation','RCTGeolocation','RCTImage','RCTLinkingIOS','RCTNetwork','RCTSettings','RCTText','RCTVibration','RCTWebSocket',  ]  pod 'RNFBApp', :path => '../node_modules/@react-native-firebase/app'  pod 'RNFBDatabase', :path => '../node_modules/@react-native-firebase/database'  pod 'RNFBAuth', :path => '../node_modules/@react-native-firebase/auth'  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"  post_install do |installer|    installer.pods_project.targets.each do |target|      if target.name == "React"        target.remove_from_project      end    end  endend

package.json:

"dependencies": {"@react-native-firebase/app": "^7.2.1","@react-native-firebase/auth": "^8.0.5","@react-native-firebase/database": "^7.2.2","react": "16.8.3","react-native": "0.59.10",    ...  }

I've tried clearing my node_modules and Pods folder within ios. Been trying to debug this for a while, any help is appreciated. Thanks!

I am sorry for the black marks in the image.

I have seen multiple posts suggesting an answer to this problem, Lock unlocks keychain (tried it), pod Update (tried it), clear build(tried it), signing, skip install in build settings(tried it) - None of them actually worked.

I built my iOS app in react native with Expo, after which I did expo eject to create the iOS folder for Xcode build and archiving, the build is successful every time and it even runs on the simulator and in my device(iPhone 7) but it always failed to archive by throwing this error - Uncategorised - Command PhaseScriptExecution failed with a non zero exit code..

Any help to point me in which direction should I go or what can be the possible mistake that I am doing will be of great help. Do let me know if, I should provide any more detail about this. Thank you!

Xcode Version - 11.0Mac Version - 10.15 CatalinaiPhone OS - 13.1.3

Few links I tried from -

1. "${PODS_ROOT}/SwiftLint/swiftlint" causes "Command PhaseScriptExecution failed with a nonzero exit code" with Xcode 10
2. https://github.com/apollographql/apollo-ios/issues/395
3. https://www.reddit.com/r/iOSProgramming/comments/al9box/getting_an_error_command_phasescriptexecution/

That's my first time using the Pinch Gesture Handler in React Native... I'm trying to create a zoomable camera using Expo. What i'm doing is:

const handlePinch = (nativeEvent) => {   const { scale, velocity } = nativeEvent;   let newZoom =     velocity > 0       ? zoom + scale * velocity * (Platform.OS === "ios" ? 0.01 : 25)       : zoom -         scale * Math.abs(velocity) * (Platform.OS === "ios" ? 0.02 : 50);   if (newZoom < 0) newZoom = 0;   else if (newZoom > 0.5) newZoom = 0.5;   setZoom(newZoom);};...<ExpoCamera    ...    zoom={zoom}    ...>

Working but not too smoothy... Is there any better way to do this?

The issue I'm facing is that in iOS, I wanted to disable the property of auto-reading the OTP from messages (suggestions that come in the predictive text in the keypad). But using react native, I didn't get any solution to do so. I can't use any library because we've created a custom OTP view. Here, whenever I click on autoread OTP, so only the first digit of the OTP gets read and rest of the input fields/boxes stay empty. I want the OTP string to get truncated and each digit to get entered in the respective box. And In case, if the user enters a digit or more before the OTP comes and then clicks on the autoread OTP , then it should remove the digits entered by the user and enter the 6 digit OTP.

Launch app from command line usingdetox test --configuration ios.sim.debug

Launch app in code via await device.launchApp({ permissions: { location: 'always', notifications: 'YES' } })

Go through login flow until app asks for location via react-native-permissions Permissions.request('location', { type: 'always' })(with prior check to see if location permission check already set to'always' (in which case app doesn't ask) )

See system alert pop up asking to confirm location permission

Detox cannot see system alert pop up and thus can't click on button to choose permission always for location

Should be able to tap on 'Always Allow' button in location permission system button. But can't.

See my code at: github.com/wix/Detox/issues/1330 .

I am facing an issue while I am returning after some time in the App, can anyone help me in this regard?

Please find the below crash log.

I did some research regarding this issue & I found some questions in StackOverflow and GitHub, but as I am pretty new in React Native/App development I am unable to figure out the way and steps to resolve the issue.

Crashlytics

Crash log

Date/Time:           2020-06-03 21:50:48.8370 +0400Launch Time:         2020-06-03 21:50:22.7923 +0400OS Version:          iPhone OS 13.4.1 (17E262)Release Type:        UserBaseband Version:    7.51.01Report Version:      104Exception Type:  EXC_CRASH (SIGKILL)Exception Codes: 0x0000000000000000, 0x0000000000000000Exception Note:  EXC_CORPSE_NOTIFYTermination Reason: Namespace SPRINGBOARD, Code 0x8badf00dTermination Description: SPRINGBOARD, process-exit watchdog transgression: application<com.bankonus>:5046 exhausted real (wall clock) time allowance of 5.00 seconds | ProcessVisibility: Foreground | ProcessState: Running | WatchdogEvent: process-exit | WatchdogVisibility: Foreground | WatchdogCPUStatistics: ( | "Elapsed total CPU time (seconds): 1.840 (user 1.840, system 0.000), 18% CPU", | "Elapsed application CPU time (seconds): 0.002, 0% CPU" | )Triggered by Thread:  0Thread 0 name:  Dispatch queue: com.apple.main-threadThread 0 Crashed:0   libsystem_kernel.dylib          0x0000000192f7e77c 0x192f58000 + 1575641   libdispatch.dylib               0x0000000192df50a8 0x192df3000 + 83602   libdispatch.dylib               0x0000000192df4fe8 0x192df3000 + 81683   companyName                     0x0000000104331b2c 0x1041b0000 + 15798204   companyName                     0x0000000104373990 0x1041b0000 + 18497445   companyName                     0x00000001043738f0 0x1041b0000 + 18495846   companyName                     0x0000000104371d80 0x1041b0000 + 1842560

Symbolicated crash log:

Exception Type:  EXC_CRASH (SIGABRT)Exception Codes: 0x0000000000000000, 0x0000000000000000Exception Note:  EXC_CORPSE_NOTIFYTriggered by Thread:  3Last Exception Backtrace:0   CoreFoundation                  0x193e945f0 __exceptionPreprocess + 2241   libobjc.A.dylib                 0x193bb6bcc objc_exception_throw + 552   CoreFoundation                  0x193d98ea8 -[NSObject+ 192168 (NSObject) doesNotRecognizeSelector:] + 1393   CoreFoundation                  0x193e98694 ___forwarding___ + 13154   CoreFoundation                  0x193e9a5bc _CF_forwarding_prep_0 + 915   bankonus                        0x102cbd968 0x102ba0000 + 11697686   bankonus                        0x102cbe120 0x102ba0000 + 11717447   CoreFoundation                  0x193e9a760 __invoking___ + 1438   CoreFoundation                  0x193d6bb40 -[NSInvocation invoke] + 2999   CoreFoundation                  0x193d6c718 -[NSInvocation invokeWithTarget:] + 7510  companyName                         0x102cef840 0x102ba0000 + 137427211  companyName                         0x102cf1950 0x102ba0000 + 138273612  companyName                         0x102cf16b4 0x102ba0000 + 138206813  libdispatch.dylib               0x193b599a8 _dispatch_call_block_and_release + 2314  libdispatch.dylib               0x193b5a524 _dispatch_client_callout + 1515  libdispatch.dylib               0x193b068a4 _dispatch_lane_serial_drain$VARIANT$mp + 60716  libdispatch.dylib               0x193b07294 _dispatch_lane_invoke$VARIANT$mp + 41517  libdispatch.dylib               0x193b1078c _dispatch_workloop_worker_thread + 58718  libsystem_pthread.dylib         0x193babb74 _pthread_wqthread + 27119  libsystem_pthread.dylib         0x193bae740 start_wqthread + 7

I'm new to react native i'm trying to populate flat list with images. All the images are stored inside the app. I want to set image source dynamically in every iteration. This is what I tried. Please help me.

<FlatList  data={this.state.listData}  renderItem={({ item }) => {<Image                                                                 source={    (item)=>{     switch(item.TypeX){     case '1':     return require('path 1');     case '2':     return require('path 2')   }}} />  }</FlatList>

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.

I am rendering a restaurant menu and I display it in a ScrollView.

For some reason, first time I render the screen, everything works perfectly. BUT if I leave the screen and navigate again to it, and I console.logthis.state.catTitlesXVals and this.state.catTitlesWidthsSorted they have the default values which are initialised in the state. I use these functions so I can get this effect you can see below of the categories:

I do not understand why the second time I navigate to the screen and it gets mounted, the functions I have below do not update the state correctly.

I am really lost here, any help would be much appreciated. Thank you in advance :)

 componentDidUpdate() {        // since onLayout for some (weird) reason returns the widths in an unsorted manner,        // we will sort them since we know that x has to be always in ascending order and        // we can use that as a reference        if (this.state.catTitlesXvals.length == this.state.numCategories && !this.state.catTitlesWidthsSorted) {            this.setState({ catTitlesWidthsSorted: true }, () => {                var temp = [];                var xvals = this.state.catTitlesXvals;                var i;                for (i = 0; i < this.state.catTitlesXvals.length; i++) {                    var index;                    var obj = this.state.catTitlesWidthsRef[i];                    index = xvals.indexOf(Number(Object.keys(obj)[0]));                    temp[index] = obj[xvals[index].toString()]                }                this.setState({ catTitlesWidths: temp, translateWidth: new Animated.Value(temp[0]) })            })        }    }    _onLayoutCategories = ({ nativeEvent: { layout: { x, y, width, height } } }) => {        this.setState(prevState => ({            categoryYvals: [...prevState.categoryYvals, y].sort(function (a, b) { return a - b })        }))    };    _onLayoutCatTitles = ({ nativeEvent: { layout: { x, y, width, height } } }) => {        this.setState(prevState => ({            catTitlesWidths: [...prevState.catTitlesWidths, width],            catTitlesXvals: [...prevState.catTitlesXvals, x].sort(function (a, b) { return a - b }),            catTitlesWidthsRef: [...prevState.catTitlesWidthsRef, { [x]: width }]        }))    };    handleScroll = (event) => {        var y = event.nativeEvent.contentOffset.y        for (let i = 0; i < this.state.categoryYvals.length; i++) {            if (y > this.state.categoryYvals[i] && y < this.state.categoryYvals[i + 1]) {                let translateValueX = this.state.catTitlesXvals[i];                let translateValueW = this.state.catTitlesWidths[i];                Animated.parallel([                    Animated.timing(                        this.state.translateX,                        {                            toValue: translateValueX,                            duration: 75,                        }                    ),                    Animated.timing(                        this.state.translateWidth,                        {                            toValue: translateValueW,                            duration: 50,                        }                    )                ]).start()            }        }    }render() {        return (<View style={styles.container}>                ...<ScrollView stickyHeaderIndices={[0]} ref={(node) => this.scroll = node} onScroll={this.handleScroll} scrollEventThrottle={1}><View style={{ flex: 1, backgroundColor: 'white', paddingTop: 45 }}>                        ...<ScrollView style={{ backgroundColor: 'white', borderBottomColor: 'orange', borderBottomWidth: 1 }}                            horizontal={true}                            showsHorizontalScrollIndicator={false}                            ref={(node) => this.scrollTitles = node}><View style={{ flexDirection: 'row', alignItems: 'center', height: 50 }}>                                {getCatTitles(this.props.route.params['menu'])}</View><Animated.View style={[styles.highlight, { left: this.state.translateX, width: this.state.translateWidth }]}></Animated.View></ScrollView></View>                    {DisplayMenu(this.props.route.params['menu'], this)}                    ...function DisplayMenu(MenuText, defaultThis) {    var menu = JSON.parse(MenuText);    var CategoriesNum;    CategoriesNum = menu.length;    var i;    var components = [];    for (i = 1; i < CategoriesNum + 1; i++) {        let catTitle = menu[i - 1][i.toString()]["catTitle"]        var temp =            (<View style={styles.category} key={'cat_'+ i} onLayout={defaultThis._onLayoutCategories}><Text style={styles.catTitle}>{catTitle}</Text><View style={styles.catItems}>                    {generateItemC(menu, i, defaultThis)}</View></View>);        components[i] = temp;    }    return (<View>{components}</View>    )}

By mistake, I uploaded the GoogleService-info.plist from some other project with different bundle identifier in my latest release, to my AppStore. and now many people have downloaded the application from this release, and obviously they're not receiving any remote notifications. Now when I changed the GoogleService-info.plist to the actual project file and uploaded the app to test flight, when I update the app I still don't receive any notifications but when I uninstall and reinstall the app I start getting notifications. however, there're many users who are already using the app and now they'll just update the app and not re-install.any help in this will be highly appreciated.

I am facing an issue while running iOS code from react-native

Unable to resolve build file: XCBCore.BuildFile (namedReferencesCannotBeResolved) (in target 'myProjectName')

I have tried many solution from stackover flow but nothing working.