I am new to react native. I want to build an offline react native app for storing user data (Basic user details, user personal documents, images, etc). I already gone through some documents about react-native-sqlite-storage and I would like to integrate it. But not sure,
I have created a React Native app using third party which creates News posts.I have the entire code for this.How to get the full path (Mobile app URI) of a content/news post.
For example if I am posting a News and I need the full Path for that particular News for Deep-Linking. Like we get the path in the website https://www.example.com/post/1 , similarly what will the path in mobile app & how do I check in the code?
Below is the snippet for creating an instance of the panResponder:
constructor( props ) { super( props ); this.position = new Animated.ValueXY(); this.panResponder = PanResponder.create( { onStartShouldSetPanResponder: ( ) => true, onPanResponderMove: ( event, gesture ) => { this.position.setValue( { x: 0, y: gesture.dy } ); }, onPanResponderRelease: ( event, gesture ) => { if ( gesture.dy > SWIPE_THRESHOLD ) { this.forceSwipe( 'up' ); } else if ( gesture.dy < -SWIPE_THRESHOLD ) { this.forceSwipe( 'down' ); } else { this.resetPosition(); } }, onMoveShouldSetPanResponderCapture: ( evt, gestureState ) => gestureState.dx !== 0 && gestureState.dy !== 0, } ); } getCardStyle() { return { ...this.position.getLayout(), }; }Below is the code snippet of my Component:
<Animated.View key={ item.id } style={ [ this.getCardStyle(), styles.cardStyle ] } { ...this.panResponder.panHandlers }><Card shouldPanRespond={ this.shouldPanRespond } item={ item } /></Animated.View>Code snippet for card component:
<TouchableOpacity activeOpacity={ 1 } style={ cardStyle } onPress={ this.onPress }><ScrollView contentContainerStyle={ cardStyle }><Image resizeMode="cover" style={ imageStyle } source={ { uri: img_url } } /><View style={ titleWrapStyle }><Text style={ textStyle }>{ title }</Text></View></ScrollView></TouchableOpacity>I am building cards that are absolutely positioned one behind another. These cards can then be swiped up or down using the panResponder. But, on tapping the screen I am supposed to show a detail page on the same screen.
Now, I can detect the tap, but whenever the user taps/clicks, I want to disable the panResponder so that the card cannot be swiped and the user can scroll through the content. Once, the user scrolls to the end, I want re-enable swiping i.e I want to enable panning.
I know that onStartShouldSetResponder: () => false disables panResponder but how do we disable it after an instance is created. I couldn't find much about it else where.
I want to localize the usage descriptions in the ios.infoPlist key of the app.json file. For example:
{"ios": {"infoPlist": {"NSCameraUsageDescription": "This app uses the camera to do something","NSPhotoLibraryUsageDescription": "This app accesses the library to do something" } }I know that, if my project was ejected, I could go into the ios files and add InfoPlist.strings.
But in an Expo managed workflow, how can this be done?
getting error while installing pods:
checking for a BSD-compatible install... /usr/bin/install -cchecking whether build environment is sane... yeschecking for arm-apple-darwin-strip... nochecking for strip... stripchecking for a thread-safe mkdir -p... ./install-sh -c -dchecking for gawk... gawkchecking whether make sets $(MAKE)... yeschecking whether make supports nested variables... yeschecking for arm-apple-darwin-gcc... /Applications/Xcode 11.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/bin/cc -arch armv7 -isysroot /Applications/Xcode 11.app/Contents/Developer/Platforms/iPhoneOS.platform/Developer/SDKs/iPhoneOS13.2.sdkchecking whether the C compiler works... no/Users/kjunejha/Library/Caches/CocoaPods/Pods/External/glog/2263bd123499e5b93b5efe24871be317-1f3da/missing: Unknown `--is-lightweight' optionTry `/Users/kjunejha/Library/Caches/CocoaPods/Pods/External/glog/2263bd123499e5b93b5efe24871be317-1f3da/missing --help' for more informationconfigure: WARNING: 'missing' script is too old or missingconfigure: error: in `/Users/kjunejha/Library/Caches/CocoaPods/Pods/External/glog/2263bd123499e5b93b5efe24871be317-1f3da':**configure: error: C compiler cannot create executables**See `config.log' for more details** Here is my podfile : **
platform :ios, '10.0' require_relative '../node_modules/react-native-unimodules/cocoapods' require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules' target 'RNGuide' do rnPrefix = "../node_modules/react-native" # React Native and its dependencies pod 'FBLazyVector', :path => "#{rnPrefix}/Libraries/FBLazyVector" pod 'FBReactNativeSpec', :path => "#{rnPrefix}/Libraries/FBReactNativeSpec" pod 'RCTRequired', :path => "#{rnPrefix}/Libraries/RCTRequired" pod 'RCTTypeSafety', :path => "#{rnPrefix}/Libraries/TypeSafety" pod 'React', :path => "#{rnPrefix}/" pod 'React-Core', :path => "#{rnPrefix}/" pod 'React-CoreModules', :path => "#{rnPrefix}/React/CoreModules" pod 'React-RCTActionSheet', :path => "#{rnPrefix}/Libraries/ActionSheetIOS" pod 'React-RCTAnimation', :path => "#{rnPrefix}/Libraries/NativeAnimation" pod 'React-RCTBlob', :path => "#{rnPrefix}/Libraries/Blob" pod 'React-RCTImage', :path => "#{rnPrefix}/Libraries/Image" pod 'React-RCTLinking', :path => "#{rnPrefix}/Libraries/LinkingIOS" pod 'React-RCTNetwork', :path => "#{rnPrefix}/Libraries/Network" pod 'React-RCTSettings', :path => "#{rnPrefix}/Libraries/Settings" pod 'React-RCTText', :path => "#{rnPrefix}/Libraries/Text" pod 'React-RCTVibration', :path => "#{rnPrefix}/Libraries/Vibration" pod 'React-Core/RCTWebSocket', :path => "#{rnPrefix}/" pod 'React-Core/DevSupport', :path => "#{rnPrefix}/" pod 'React-cxxreact', :path => "#{rnPrefix}/ReactCommon/cxxreact" pod 'React-jsi', :path => "#{rnPrefix}/ReactCommon/jsi" pod 'React-jsiexecutor', :path => "#{rnPrefix}/ReactCommon/jsiexecutor" pod 'React-jsinspector', :path => "#{rnPrefix}/ReactCommon/jsinspector" pod 'ReactCommon/callinvoker', :path => "#{rnPrefix}/ReactCommon" pod 'ReactCommon/turbomodule/core', :path => "#{rnPrefix}/ReactCommon" pod 'Yoga', :path => "#{rnPrefix}/ReactCommon/yoga" pod 'DoubleConversion', :podspec => "#{rnPrefix}/third-party-podspecs/DoubleConversion.podspec" pod 'glog', :podspec => "#{rnPrefix}/third-party-podspecs/glog.podspec" pod 'Folly', :podspec => "#{rnPrefix}/third-party-podspecs/Folly.podspec" # Other native modules # Automatically detect installed unimodules use_unimodules! # react-native-cli autolinking use_native_modules! endI am running on Mac OS Mojave -10.14.6 with Xcode 11.3.1
How to convert String into the array in React Native. for example:-
var myString = 'this, is my, string';separate string with "," and output must be
myArray = [this, is my, string]; on myArray[0] value is "this", on myArray[1] value is " is my", on myArray[2] value is " string"I'm using the following code to download a file (can be a PDF or a DOC) and then opening it using Linking.
const { dirs } = RNFetchBlob.fs;let config = { fileCache : true, appendExt : extension, addAndroidDownloads : { useDownloadManager : false, notification : false, title : 'File', description : 'A file.', path: `${dirs.DownloadDir}/file.${extension}`, },};RNFetchBlob.config(config) .fetch( method, remoteUrl, APIHelpers.getDefaultHeaders() ) .then((res) => { let status = res.info().status; if (status == 200) { Linking.canOpenURL(res.path()) .then((supported) => { if (!supported) { alert('Can\'t handle url: '+ res.path()); } else { Linking.openURL(res.path()) .catch((err) => alert('An error occurred while opening the file. '+ err)); } }) .catch((err) => alert('The file cannot be opened. '+ err)); } else { alert('File was not found.') } }) .catch((errorMessage, statusCode) => { alert('There was some error while downloading the file. '+ errorMessage); });However, I'm getting the following error:
An error occurred while opening the file. Error: Unable to open URL:file:///Users/abhishekpokhriyal/Library/Developer/CoreSimulator/Devices/3E2A9C16-0222-40A6-8C1C-EC174B6EE9E8/data/Containers/Data/Application/A37B9D69-583D-4DC8-94B2-0F4AF8272310/Documents/RNFetchBlob_tmp/RNFetchBlobTmp_o259xexg7axbwq3fh6f4.pdf
I need to implement the solution for both iOS and Android.
In my scenario, I am having separate class for example page1, page2 and page3. Here, I need to call Page1 button click to Page 2 without navigation the transition like sudden appear popup screen. How to achieve this?
Below code I am using,
<TouchableOpacity onPress={() => { // Here I need to call Page 2 }}>I am currently trying to integrate an image capture logic into my react native app, where I am using the native TrueDepth Sensor on iOS.
I have read through a bunch of tutorials bridging native modules and UI components individually. I do have a code example on accessing the true depth data, I just dont know how to bridge a UIViewController to React native. As it is a combination of a native module and a UIView, I did not find any proper solutions.
Hoping someone might have experience with this and could help me out
In my code, I am having two screens with two different class files. Here, I need to do screen one button click to show screen two. Screen two need to show like a overlay screen and if screen two button click then it should dissolve and back to screen one. how to achieve this?
sample screen enter image description here
below code I am using for click to call another page
<TouchableOpacity onPress={() => { this.setState({ isVisible: false }); this.props.navigation.navigate('screen2'); }}>Screen two below code
render () { const Screentwo = this.renderCarousel('test'); return (<SafeAreaView style={styles.safeArea}><View style={styles.container}><StatusBar translucent={true} backgroundColor={'rgba(0, 0, 0, 0.3)'} barStyle={'light-content'} /><ScrollView style={styles.scrollview} scrollEventThrottle={200} directionalLockEnabled={true}></ScrollView></View></SafeAreaView> ); }Is there any Possible way to prevent ios app to prevent screenshot like Netflix do.Need help.
I am stuck today at ios image uri path
It is giving me path like this.and it is uploading to server as it is so i can't load these images in my view. Please help me anyone
assets-library://asset/asset.PNG?id=CE542E92-B1FF-42DC-BD89-D61BB70EB4BF&ext=PNG
But i want the path something like this
file:///Users/USERNAME/Library/Developer/CoreSimulator/Devices/########-####-####-####-############/data/Containers/Data/Application/########-####-####-####-############/Documents/########-####-####-####-############.png
Here is the link of a similar unanswered question - After Image Uploading, image uri is null for iOS alone in React Native
I'm following this guide on adding OneSignal to React Native, and there is one section where is says:
Open NotificationService.m or NotificationService.swift and replace the whole file contents with the code below:
<provides code to add>
If you are using Swift, make sure to create a separate Objective-C Bridging Header for your OneSignalNotificationExtensionService and add the following import:
#import "RCTOneSignalExtensionService.h"Then you need to tell your Xcode project settings what your bridging header is named, like this.
I added the code they provided to NotificationService.swift because that's the only one of the two files that exists in my project. So I assume I'm "using swift" as they put it. The problem is that when they say to create a separate Objective-C Bridging Header, I don't know how to do that. All I've been able to find online is that when you import Objective-C code into your swift project, Xcode should automatically prompt you to create a bridging header. Xcode hasn't done that for me.
Does anyone know how I can create an Objective-C bridging header?
I was working on a project that need some files to be downloaded into storage and later works offline . I am using Expo's Filesystem api to download the file and then saving the file in Expo FileSystem.documentDirectory
let directory = FileSystem.documentDirectory +'media/';await FileSystem.downloadAsync(imageurl, directory +'filename.jpg' ) .then(({ uri }) => { console.log(uri,'uri of image') });The problem is when i was updating app in itunesconnect the data is not persisting.
I'm creating an app in React Native in which I want to download a video in the application, but that video should not appear in Gallary of the device. It should download in the application's folder. How should I do that any idea?
I can't set the color of the status bar on iOS and Android on React Native with Expo.I just managed to hide it.
Code :
import * as React from 'react';import { WebView } from 'react-native-webview';import { StatusBar } from 'react-native'export default class App extends React.Component { render() { return <><StatusBar hidden={true} /><WebView source={{ uri: 'https://foo.co' }} style={{ marginTop: 33 }} /></> }}I already tried :
<StatusBar hidden={false} barStyle="light-content" />and :
<StatusBar barStyle = "dark-content" hidden = {true} backgroundColor = "#00BCD4" translucent = {true}/>I am really confused about how this StatusBar works.
Thank you in advance!
I am stuck as I am unable to make ios build from expo. I am getting
Authentication with Apple Developer Portal failed!Cannot find module '@expo/traveling-fastlane-linux'this error when I am trying to run expo build:ios from my ubuntu. I also tried installing @expo/traveling-fastlane-linux module but no progress.
Following are expo diagnostics
Expo CLI 3.17.23 environment info:System: OS: Linux 4.15 Ubuntu 16.04.6 LTS (Xenial Xerus) Shell: 4.3.48 - /bin/bashBinaries: Node: 10.18.0 - /usr/bin/node npm: 6.9.0 - /usr/local/bin/npmnpmPackages: expo: ^37.0.7 => 37.0.7 react: ~16.9.0 => 16.9.0 react-native: https://github.com/expo/react-native/archive/sdk- 37.0.1.tar.gz => 0.61.4 react-navigation: ^2.12.0 => 2.18.3 npmGlobalPackages: expo-cli: 3.17.23This is very annoying and I didn't find any suitable solution yet. Please help. Thank you in advance.
Edit : Added expo diagnostics
I have this react native project that im working with multiple computers, in my MacBook everything works fine, when I run "pod install" after running "npm install" the pods project is created successfully, in the other hand when I do the same in my desktop I get this following error:
Ive tried installing pods for other projects and everything works fine, the problem is with this project in particular.
I want to disable/enable all notifications applications in my device (iOS & Android), or make automatically my device on do not disturb mode, is that possible ?
Getting these errors on initializing a new react native app:
Property 'passwordRules' not found on object of type 'UIView *'
Use of undeclared identifier 'UITextInputPasswordRules'
> react-native init sampleapp> cd sampleapp> xed ./ios> (Click Run button)react-native-cli: 2.0.1react-native: 0.62.2xcode: 9.4.1macos: 10.13.4node: 12.14.1npm: 6.13.7cocoapods: 1.9.1