How is it possible to create the file using the base64 string and save it to the Downloads folder.and is there any way in react-native to open the file immediately after the download using the default pdf viewer in the device?

I have tried almost all options but not getting through. My Django server is working fine with Postman but when I try it from my React Native app, it gives an error

[Error: Request failed with status code 400]

My code is:

submitData = () => {        console.log("submitQuestionDataToServer");        let form_data = new FormData();        form_data.append('qOne_img', Platform.OS === 'android' ? photoUri : photoUri.replace('file://', ''));        form_data.append('qOne_img', Platform.OS === 'android' ? secondPhotoUri : secondPhotoUri.replace('file://', ''));        form_data.append('question_title', qTitle);        form_data.append('asked_by', "http://127.0.0.1:8000/auth/users/2/");        let url = 'http://127.0.0.1:8000/api/questions/';        axios.post(url, form_data, {          headers: {"Content-Type": "multipart/form-data","Authorization": "Bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1Nk",        }        })            .then(res => {                console.log("res *******")              console.log(res.data);            })            .catch(err => console.log(err))    }

Thanks in advance.

I want the name of the current route or screen in react-navigation which I want to use inside if condition to make some changes.

Description

i'm using react-native-lottie package in my project. But yesterday, i'm updated my macos operation system to Catalina 10.15.5 version and always throw below error when run react-native run-ios command.

Steps to Reproduce

1.Open the iTerm app.

2.runned react-native run-ios command in iTerm from react-native project directory.Expected behavior: Running my react-native application in simulator or device.

Actual behavior:

CompileSwift normal x86_64 /Users/user/Documents/React_Native/sample/node_modules/lottie-react-native/src/ios/LottieReactNative/ContainerView.swift cd /Users/user/Documents/React_Native/sample/ios/Pods /Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/bin/swift -frontend -c /Users/user/Documents/React_Native/sample/node_modules/lottie-react-native/src/ios/LottieReactNative/AnimationViewManagerModule.swift -primary-file /Users/user/Documents/React_Native/sample/node_modules/lottie-react-native/src/ios/LottieReactNative/ContainerView.swift -emit-module-path /Users/user/Documents/React_Native/sample/ios/build/sample/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/lottie-react-native.build/Objects-normal/x86_64/ContainerView~partial.swiftmodule -emit-module-doc-path /Users/user/Documents/React_Native/sample/ios/build/sample/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/lottie-react-native.build/Objects-normal/x86_64/ContainerView~partial.swiftdoc -emit-module-source-info-path /Users/user/Documents/React_Native/sample/ios/build/sample/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/lottie-react-native.build/Objects-normal/x86_64/ContainerView~partial.swiftsourceinfo -serialize-diagnostics-path /Users/user/Documents/React_Native/sample/ios/build/sample/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/lottie-react-native.build/Objects-normal/x86_64/ContainerView.dia -emit-dependencies-path /Users/user/Documents/React_Native/sample/ios/build/sample/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/lottie-react-native.build/Objects-normal/x86_64/ContainerView.d -emit-reference-dependencies-path /Users/user/Documents/React_Native/sample/ios/build/sample/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/lottie-react-native.build/Objects-normal/x86_64/ContainerView.swiftdeps -target x86_64-apple-ios9.0-simulator -enable-objc-interop -sdk /Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs/iPhoneSimulator13.5.sdk -I /Users/user/Documents/React_Native/sample/ios/build/sample/Build/Products/Debug-iphonesimulator/lottie-react-native -I /Users/user/Documents/React_Native/sample/ios/build/sample/Build/Products/Debug-iphonesimulator/lottie-ios -F /Users/user/Documents/React_Native/sample/ios/build/sample/Build/Products/Debug-iphonesimulator/lottie-react-native -enable-testing -g -import-underlying-module -module-cache-path /Users/user/Documents/React_Native/sample/ios/build/sample/ModuleCache.noindex -swift-version 4.2 -enforce-exclusivity=checked -Onone -D DEBUG -D COCOAPODS -serialize-debugging-options -Xcc -working-directory -Xcc /Users/user/Documents/React_Native/sample/ios/Pods -enable-anonymous-context-mangled-names -Xcc -fmodule-map-file=/Users/user/Documents/React_Native/sample/ios/build/sample/Build/Products/Debug-iphonesimulator/lottie-ios/Lottie.modulemap -Xcc -fmodule-map-file=/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Public/lottie_react_native/lottie-react-native.modulemap -Xcc -I/Users/user/Documents/React_Native/sample/ios/build/sample/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/lottie-react-native.build/swift-overrides.hmap -Xcc -iquote -Xcc /Users/user/Documents/React_Native/sample/ios/build/sample/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/lottie-react-native.build/lottie-react-native-generated-files.hmap -Xcc -I/Users/user/Documents/React_Native/sample/ios/build/sample/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/lottie-react-native.build/lottie-react-native-own-target-headers.hmap -Xcc -I/Users/user/Documents/React_Native/sample/ios/build/sample/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/lottie-react-native.build/lottie-react-native-all-target-headers.hmap -Xcc -iquote -Xcc /Users/user/Documents/React_Native/sample/ios/build/sample/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/lottie-react-native.build/lottie-react-native-project-headers.hmap -Xcc -I/Users/user/Documents/React_Native/sample/ios/build/sample/Build/Products/Debug-iphonesimulator/lottie-react-native/include -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Private -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Private/lottie-react-native -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Public -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Public/DoubleConversion -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Public/React-Core -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Public/React-DevSupport -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Public/React-RCTActionSheet -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Public/React-RCTAnimation -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Public/React-RCTBlob -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Public/React-RCTImage -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Public/React-RCTLinking -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Public/React-RCTNetwork -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Public/React-RCTSettings -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Public/React-RCTText -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Public/React-RCTVibration -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Public/React-RCTWebSocket -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Public/React-cxxreact -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Public/React-jsi -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Public/React-jsiexecutor -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Public/React-jsinspector -Xcc -I/Users/user/Documents/React_Native/sample/ios/Pods/Headers/Public/glog -Xcc -I/Users/user/Documents/React_Native/sample/ios/build/sample/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/lottie-react-native.build/DerivedSources-normal/x86_64 -Xcc -I/Users/user/Documents/React_Native/sample/ios/build/sample/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/lottie-react-native.build/DerivedSources/x86_64 -Xcc -I/Users/user/Documents/React_Native/sample/ios/build/sample/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/lottie-react-native.build/DerivedSources -Xcc -DPOD_CONFIGURATION_DEBUG=1 -Xcc -DDEBUG=1 -Xcc -DCOCOAPODS=1 -module-name lottie_react_native -o /Users/user/Documents/React_Native/sample/ios/build/sample/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/lottie-react-native.build/Objects-normal/x86_64/ContainerView.o -index-store-path /Users/user/Documents/React_Native/sample/ios/build/sample/Index/DataStore -index-system-modules/Users/user/Documents/React_Native/sample/node_modules/lottie-react-native/src/ios/LottieReactNative/AnimationViewManagerModule.swift:5:8: error: module compiled with Swift 5.1.2 cannot be imported by the Swift 5.2.4 compiler: /Users/user/Documents/React_Native/sample/ios/build/sample/Build/Products/Debug-iphonesimulator/lottie-ios/Lottie.swiftmodule/x86_64-apple-ios-simulator.swiftmodule

import Lottie ^

** BUILD FAILED **

The following build commands failed: CompileSwift normal x86_64 /Users/user/Documents/React_Native/sample/node_modules/lottie-react-native/src/ios/LottieReactNative/AnimationViewManagerModule.swift CompileSwift normal x86_64 /Users/user/Documents/React_Native/sample/node_modules/lottie-react-native/src/ios/LottieReactNative/ContainerView.swift CompileSwiftSources normal x86_64 com.apple.xcode.tools.swift.compiler(3 failures)

Versions

npm: 6.13.4

macOS: Catalina 10.15.5

react-native: 0.60.5

react-native-cli: 2.0.1

lottie-ios: 3.1.3

lottie-react-native: 3.3.2

I'm using replaykit (RPSystemBroadcastPickerView component) added it to my react native app. I added a broadcast extension, would like to pass the buffer to the react native app, so that I can use it for displaying my broadcast(screenshare). Any idea how to pass buffer to react native app?

I'm planning to develop an Mobile App in react-native, as i'm new to this language and i have gone through some react-native tutorial videos in udemy, i just want to know the difference between React Native CLI vs Expo CLI. If we are to develop an iOS and Android application which uses bluetooth, location and camera API's which CLI we should go with ?

I couldn't find any specific libraries (bluetooth, location and camera)from the react-native team, is it that we need to create our own library in native language(Swift or Objective C and Java or kotlin) and expose them to react native through bridging or can we use third party libraries which are already available ?

Thanks.

We are looking for options to harden our app and need the following

• Obfuscation
• Jailbreak/Root detection
• Hook detection
• Swizzle detection (iOS)

What I found were:

Android - Obfuscation by proguard - Root detection using RootBeer https://github.com/scottyab/rootbeer - Hook detection ?

iOS - Obfuscation by xcode during builds - Jailbreak detection using https://github.com/TheSwiftyCoder/JailBreak-Detection - Hook detection ? - Swizzle detection?

How is hook detection done for iOS and Android.

Also for cordova/flutter apps are there any libraries for Hook detection and general app hardening in general?

I dont have any errors but I still cant open screen that I want. Here is my FlatList item:

let categories = [         {            screenName : Player,            name : "Category 1",            img : require("../Assets/Slika.jpg"),        },

Here is TouchableOpacity with onPress

return (<View style={styles.container}><FlatList                    data={categories}                    showsHorizontalScrollIndicator={false}                    numColumns={categories.length / 5}                    showsVerticalScrollIndicator={false}                    keyExtractor={(item, index) => index.toString()}                    renderItem = {({item, index}) => {                        return (<TouchableOpacity onPress={() => item.screenName}><Surface style={styles.surface}><ImageBackground                            source={item.img}                             style={styles.img}                            blurRadius={0.5}><Icon name="music" color="#fff" size={22}/><Text style={styles.name}>{item.name}</Text></ImageBackground></Surface></TouchableOpacity>                        );                    }}                /></View>

I'm new at React-Native. I'm trying to build an app on mobile. But when I run this code I'm getting this error: React.createElement: type is invalid -- expected a string (for built-in components). My App.js:

import React from 'react';import { StyleSheet, View } from 'react-native';import { Header } from './components/Header';export default function App() {  return (<View style={styles.screen}><Header title="guess a number"/></View>  );}const styles = StyleSheet.create({  screen:{    flex: 1  }});

My Header.js:

import React from 'react';import { View, Text, StyleSheet } from 'react-native';const Header = props => {    return(<View style={styles.header}><Text style={styles.headerTitle}> {props.title}</Text></View>    );};const styles=StyleSheet.create({    header: {        width:'100%',        height:90,        paddingTop: 36,        backgroundColor:'#f7287b',        alignItems: 'center',        justifyContent: 'center'    },    headerTitle: {        color:'black',        fontSize: 18    }});export default Header;

What should i do?

error

I need to implement an accessibility feature of Voiceover(ios) or talkback(android) in React-native webview for both android and ios.

I am facing two issues:

1: I have div's and paragraphs (p tag) whose content has been read out by device. But I need to add some string as prefix or postfix in those.

Example

code is: <div> Hey Tap me to see magic </div>

Spoken content needed: 1 element of list "Hey Tap me to see magic" click to perform xyz action

.

2: Whenever action happen (i.e. on double tap of element) Device should speak:"Magic has happened"

What I have tried

I have tried using speechSynthesis of HTML% Text to Speech:var msg = new SpeechSynthesisUtterance('Hello World');window.speechSynthesis.speak(msg);

This approach is working for my 2nd issue in ios (iphone X),But No response in android devices

Thanks

i was trying to fetch some data from the server to display in the react native app. it was worked before but i don't know what happened after, i added a console.log in the catch of fetch.. it showing me error like

JSON Parse error: Unexpected identifier "Tunnel" - node_modules/promise/setimmediate/core.js:37:14 in tryCallOne - node_modules/promise/setimmediate/core.js:123:25 in - ... 8 more stack frames from framework internals

fetch(`${this.props.baseUrl}/products?page=${this.state.page}&per_page=10`,{    method:"get",    headers:{        AUTH_TOKEN: this.props.AUTH_TOKEN    }}).then(res=>res.json()).then(data=>{    if(data.success==true){        this.page++;        this.props.toggleLoading();        this.props.loadProducts(data.products);    }}).catch(err=>console.log(err)); //error here ..i dont know why that's throwing this kinda error 

I'm having error that no '/ios/main.jsbundle' present after react-native upgrade. Android works well.I discovered that 'main.jsbundle' generated in 'react-native-xcode.sh' but only for prod build.

But how it works in dev mode? Can't find place where it generates for dev mode.

There is nothing in documentation. I suppose it stored in some other place.

Also tried to test it on new empty project - 'main.jsbundle' not generated at all but app works without an error " no main.jsbundle present in /ios/".

Please help me understand where this file generated? Or maybe it some legacy code?

I'm using react-native 0.62.2, platform - iOS.

Thank you.

I dont have any errors but I still cant open screen that I want. I find out and I think I need navigation but I dont know how to implement it. Here is my FlatList item:

let categories = [         {            screenName : Player,            name : "Category 1",            img : require("../Assets/Slika.jpg"),        },

Here is TouchableOpacity with onPress

return (<View style={styles.container}><FlatList            data={categories}            showsHorizontalScrollIndicator={false}            numColumns={categories.length / 5}            showsVerticalScrollIndicator={false}            keyExtractor={(item, index) => index.toString()}            renderItem = {({item, index}) => {                return (<TouchableOpacity onPress={() => item.screenName}><Surface style={styles.surface}><ImageBackground                    source={item.img}                     style={styles.img}                    blurRadius={0.5}><Icon name="music" color="#fff" size={22}/><Text style={styles.name}>{item.name}</Text></ImageBackground></Surface></TouchableOpacity>                );            }}        /></View>

Here is some code for function I get:

import { useNavigation } from '@react-navigation/native';...export default function ClassName() {const navigation = useNavigation();function navigateTO(pageName) { navigation.navigate(pageName);}<TouchableOpacity onPress={navigateTO(item.screenName})>

I have an issue with iOS version. Document picker opens ok, show files but I cannot select any. Android works fine.

Followed all the steps of original doc.

Can anybody help me?

Thanks.

Based on this excellent question and answer, I tried to implement autofill function in my app. While the username and password sections can be auto-filled (i.e, Above the keyboard, there is a password button, and once I press the button, Face ID is activated, and I can select an option), but it does not ask when I typed a username and password and pressed the sign in button.

Any suggestion is very appreciated!

import { useForm } from 'react-hook-form';// Just in case// "@react-navigation/bottom-tabs": "^5.4.2",// "@react-navigation/native": "^5.2.6",// "@react-navigation/stack": "^5.3.1",...export default function screen({navigation, route}) { useEffect(()=> {    register("email");    register("password")    return () => {      console.log("Unmounted");    }  }, [register]);...return ( ...<View        style={[          styles.container,          styles.emailSection,          styles.paddingHorizontal,        ]}><View style={styles.textInputContainer}><TextInput            onChangeText={text => {              setValue('email', text);            }}            placeholder={'Email'}            placeholderTextColor="grey"            keyboardType="email-address"            autoCapitalize={'none'}            autoCorrect={false}            textContentType={'username'}            style={styles.textInputFont}          /></View><View style={styles.textInputContainer}><TextInput            onChangeText={text => {              setValue('password', text);            }}            placeholder={'Password'}            placeholderTextColor="grey"            keyboardType="default"            autoCapitalize={'none'}            autoCorrect={false}            secureTextEntry={true}            textContentType={'password'}            style={styles.textInputFont}          /></View><View><TouchableOpacity            onPress={              isEmailLoading ? null : handleSubmit(_onPressEmailSignIn)            }><View style={[styles.wideButtonContainer]}><Text style={styles.secondaryFont}>Sign In</Text></View></TouchableOpacity></View><View style={styles.textContainer}><TouchableOpacity            onPress={() => navigation.navigate('ForgotPassword')}><View><Text style={styles.secondaryFont}>Forgot Password</Text></View></TouchableOpacity><TouchableOpacity            onPress={() => navigation.navigate('EmailSignUp')}><View><Text style={styles.secondaryFont}>Sign Up</Text></View></TouchableOpacity></View></View>...)

- Tried on simulator (iPhone Xs (12.0) and my device (iPhone Xr (13.0))

I want to have a component like button (or react-native-action-button precisely) to be shown in each screen using React Navigation.

Does React Navigation has any option in inside Routes to implement it once and use everywhere?

Note: I don't want to import Component in each .js class and use it in render.

Reference -> Like this in app's each screen.Floating Action Button Reference

In my project, when i am using Material Top Tab 'activeTintColor' is not working in ios. Please help me..Thanks in advance.

import React from 'react'import { View, Text } from 'react-native'import { createMaterialTopTabNavigator } from '@react-navigation/material-top-tabs'import { Icon } from 'react-native-vector-icons/AntDesign'import { NavigationContainer } from '@react-navigation/native'

const Home = () => { return ( Home! )}

const Profile = () => { return ( Profile! )}const Chat = () => { return ( Chat! )}

const Notification = () => { return ( Notification! )}

const Tab = createMaterialTopTabNavigator();const TopTabNavigatorDemo = () => { return (

<Tab.Screen                name='Home'                component={Home}                options={{ tabBarLabel: 'Home' }} /><Tab.Screen name='Profile' component={Profile} options={{ tabBarLabel: 'Profile' }} /><Tab.Screen name='Chat' component={Chat} options={{ tabBarLabel: 'Chat' }} /><Tab.Screen name='Notification' component={Notification} options={{ tabBarLabel: 'Update' }} /></Tab.Navigator></NavigationContainer>)

}

export default TopTabNavigatorDemo

I want to take Screenshots with different devices. Is there like a terminal command to change the status bar manually. I know there is xcrun but how do I use it?

AAC audio recorded in Android is not playing in iOS devices. Here is the code example how we are recording the audio in Android device. When we try to play that audio in iOS device using react-native-sound, It won't play and shows error like this.

Failed to load the soundand iOS exception read as below.

Objectcode: "ENSOSSTATUSERRORDOMAIN1937337955"domain:"NSOSStatusErrorDomain"message: "The operation couldn't be completed. (OSStatus error 1937337955.)"nativeStackIOS: Array[17]userInfo: Object__proto__: Object

AudioRecorder.prepareRecordingAtPath('/path/to/audio/test.aac', {        SampleRate: 22050,        Channels: 1,        AudioQuality: "Low",        AudioEncoding: "aac",        AudioEncodingBitRate: 32000});

We are using RN 0.41 and react-native-audio 3.2.1

DId anyone face similar issue? let me know if there is any misconfiguration.

Since I made the release app for iOS (Archive, Appstore connect), when I'm running :npx react-native run-ios, it looks like it starts the release app so I can't see any changes, live reload is not working.

I don't know if it's a problem in the xcode project or due to the main.jsbundle.

I put back "debug" in the scheme configuration, but nothing works.

Someone got this issue once ?

Thank you