I'm trying to overlay a text strip above image view in react native. The ones you see on offers card. Attaching a screenshot below:
So far I've only managed something like this:
But this is very trivial. The right edge of the rectangle has to be slanted as well!
Is there any library/component that could do it ? I've searched all over but couldn't find one.Would really appreciate any sort of help!Thanks in advance :)
I want to open the DevMenu on my iPad (6. generation, iOS 14.5.1) with my Laptop (Windows)when I run npm start (or react-native start, doesnt matter) it will start the development server and the iPad connects to it and downloads the bundle. The logs will show in the console on the laptop as well...
But as soon as I press "r" or "d" to reload or open DevMenu, I get the ever-occuring error message:
warn No apps connected. Sending "devMenu" to all React Native apps failed. Make sure your app is running in the simulator or on a phone connected via USB.info Opening developer menu...My iPad is on the same network and I can ping it through console. Additionally its connected with USB but I dont think this makes any difference. Also tested on an iPhone 8 (iOS 14.5.1)
PS: I also configured the bundler with the right ip and port
Thanks in advance!
I'm having a problem after updating my version of React-native to "0.64.1".
I deleted node_modules and ran a yarn to install the dependencies. I gave an cd ios and ran a pod install, after that the following error was returned:
I did some processes that I found and also looked at github issues, but nothing solved.
Does anyone have any idea what this error might be?
I have ejected project of the expo.
After changing info.plist, now I am able to get my app in the list of "open with app list" and actually able to open that file with my expo(React native app).
App.js
Linking.getInitialURL().then((url) => { if (url) { console.log(url); }}).catch(err => console.error('An error occurred', err));this code is giving me this URL.
file:///private/var/mobile/Containers/Data/Application/7E55EB55-7C49-4C0C-B4CB-63AC4F49689E/Documents/Inbox/matters-3.csvSo, that means now I have URL of the email attachment, but How am I able to get the data of that csv string in my app?
So I am assuming, when I click open with my app. The URL that is passed into my app from the system is actually a copy of the document that is placed somewhere in our app’s directory.
But when I trying to access this file with Expo.FileSystem. readAsStringAsync it's giving me an error says, the file is not readable.
is there anything to do with storage permission?
Need Help....?
I am trying to run the release build directly from the terminal and I did not found an option to do that.
From XCode what is required to do is:
Product -> Scheme -> Edit Scheme (cmd +<), make sure you're in the Run tab from the side, and set the Build Configuration dropdown to release.
There is any option available from the react-native-cli to do the same? Something like react-native run-ios -configuration Release?
My objective is to generate a build that does not require the server being running to provide to the QA team for instance.
I am using this code and it works fine in simulator as I am getting a location and can get pdf file from there
async createPDF() { let options = { html: '<h1>PDF TEST</h1>', fileName: 'test', directory: 'Documents', }; let file = await RNHTMLtoPDF.convert(options) // console.log(file.filePath); alert(file.filePath); }But the above code problem in the real iOS mobile as it is saving the pdf file somewhere. I don’t know where but I am not able to see that file in my mobile. So can anyone tell me how can I save my file in the downloads or documents in the iOS . So that I can see the downloaded file.
Problem:I want to hide the url that is shown in the WebViews when logging in using ADB2C in iOS.
Platform: React Native
library: react-native-msal
Things I tried: I tried changing the parameters
ios_webviewType?: Ios_MSALWebviewType;andios_presentationStyle?: Ios_ModalPresentationStyle;
But did not find a way to hide the URL.(Even though wkwebiew hid the url, Google does not support it)
Expected Result: The WebViews should open for selection of account without any url in the top.
Please let me know if any more information is needed. Thank you.
I am trying to add google sign in library to my pod file I don't know what I am doing wrong.
Any suggestions please? Here is the code
require_relative '../node_modules/react-native/scripts/react_native_pods'require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'platform :ios, '10.0'target 'googleLog' do config = use_native_modules! pod 'GoogleSignIn', '~> 5.0.2' use_react_native!( :path => config[:reactNativePath], # to enable hermes on iOS, change `false` to `true` and then install pods :hermes_enabled => false ) target 'googleLogTests' do inherit! :complete # Pods for testing end # Enables Flipper. # # Note that if you have use_frameworks! enabled, Flipper will not work and # you should disable the next line. use_flipper!() post_install do |installer| react_native_post_install(installer) endend<TextInput // ... returnKeyType = {"next"} returnKeyType='go' />this code
is not leading the 'go'/'next' to next input fieldHow to Add "next" and "previous" arrows to the keyboard in iOS. And Set the "return"/"next" button on the keyboard to take the user to the next field in react native.
I have a container with 3 snap points which also contains a scrollView where I display more information. For some reason, this scrollview only works on iOS and not on Android. However, on Android the scrolling works when I do a sort of vertical pinch to zoom move on the screen. On iOS everything works absolutely seamlessly.
Here the repo for the reanimated-bottom-sheet:https://github.com/osdnk/react-native-reanimated-bottom-sheet
I already tried playing around with the props provided on the repository page of the Bottom Sheet library as well as attempted using these props as mentioned in other StackOverflow questions which sadly didn´t do the trick for me. On Android only either the scrolling worked or the snap points. Never the two (Only the two-finger pinching).
Can't scroll Flatlist inside react-native-reanimated-bottom-sheet
enabledInnerScrolling={true}enabledContentGestureInteraction={false}Help is much appreciated since it´s the final project of our WebDev course and we don´t have too much time left >.<Here is the code snippet.
const bs = React.createRef(); return (<View style={styles.container}><BottomSheet ref={bs} snapPoints={['85%', '39%', '17%']} initialSnap={1} renderContent={renderContent} enabledInnerScrolling={true} /><TouchableWithoutFeedback onPress={() => bs.current.snapTo(0)}><Image style={styles.background} source={require('../assets/images/TEST-flower-02.jpg')} /></TouchableWithoutFeedback></View> );```I use react-native-perspective-image-cropper package to crop image dynamically, and it’s work absolutely fine. But sometime when the cropping area overlay are outside of the image and I try to crop the image then it add the white background to replace the outside of the image area.
in Android it not add any white background but in IOS I face this issue.
I'm trying to create an 'Apple Development' Provisioning Profile but xCode doesn't accept and shows the following error message:
Signing certificate is invalid.Signing certificate "Apple Development: Fabio Pereira dos Santos (USER ID)", serial number "<DVTSigningCertificateSerialNumber: 0x7fb59e1a2af0>", is not valid for code signing. It may have been revoked or expired.
But, the certificate is valid and was not revoked.
I also tried to create a new one of type 'iOS Distribution' but also shows the error message:No signing certificate "iOS Distribution" foundNo "iOS Distribution" signing certificate matching team ID "TEAM ID" with a private key was found.
I tried another thing like 'Automatic Signing (Recommended by Apple Documentation)', xCode tries to create the certificate and the profile but also gives an error:
Status field:
Automatic signing failedXcode failed to provision this target. Please file a bug report at https://feedbackassistant.apple.com and include the Update Signing report from the Report navigator. (I did this)
and a second error below this:Signing certificate is invalid.Signing certificate "Apple Development: Fabio Pereira dos Santos (USER ID)", serial number "<DVTSigningCertificateSerialNumber: 0x7fb59e1a2af0>", is not valid for code signing. It may have been revoked or expired.
Please heeeeeelp.
I have build a hook that allows me to send a method with params to it to request data from my API. I am requesting a JSON with some data that should be displayed in Flatlist on my device. However, when I receive the data and the state is updated, the flatlist stays still on Android showing an empty screen (iOS is working fine).
My hook to get data from API:
export default useApi = (apiParams, checkForError = false) => { const [data, setData] = useState([]); const [loading, setLoading] = useState(false); //used a setter const updateData = async (newData) => { setData(newData); }; //used for requesting data from api const request = async () => { setLoading(true); //getFunction returns json.data const response = await getFunctionData(apiParams); //check for error to display error message checkForError && errorMessage(response); setLoading(false); setData(response); return response; }; return { data, loading, request, updateData };};My screen which displays flatlist:
//shows a list of data in JSON format const getSalesReportApi = useApi(params) ); //requesting data useEffect(() => { getSalesReportApi.request(); }, [REFRESHING PARAMS]); ///part of view which returns flatlist's data {getSalesReportApi.loading ? (<ActivityIndicator loader="blue" visible={getSalesReportApi.loading} style={styles.animation} /> ) : (<View style={{ opacity: opacityView }}> {getSalesReportApi.data.length > 0 ? (<FlatList refreshControl={<RefreshControlComponent onRefresh={() => getSalesReportApi.request() } /> } data={getSalesReportApi.data} renderItem={renderItem} keyExtractor={(item) => item.MSID} /> ) : (<NoDataCard /> )}</View> )}data returns correctly and updates on IOS after loading is finished (turns to false). However, after activity indicator animation finishes on Android, the screen stays empty. What I am doing wrong?
I have seen libraries that generate a singular thumbnail from a url video, but what i want is to generate multiple thumbnails.Eg. if the video length is 1 min, i want a thumbnail every 10 seconds.
I have valid universal link for ios's deep linking. The universal link is used as redirect_uri of plaid client in react-native app. When I open the universal link in safari, it opens the correct content in the app. However, it causes "AccessDenied" exception with Plaid SDK. Anyone can help me resolve the issue?
I make an issue when I use react-native-reanimated v2.It still working on debug mode. But crash on release mode with error as below:
2021-05-22 11:02:16.277410+0700 Deskimo[7924:2172727] [javascript] TypeError: Cannot read property 'memoizedProps' of undefined
This error is located at:in Unknownin Nin RCTScrollContentViewin RCTScrollViewin Bin ScrollViewin uin RCTViewin Unknownin RCTViewin Unknownin fin sin Unknownin Unknownin Unknownin RCTViewin Unknownin RCTViewin Unknownin RCTViewin Unknownin Unknownin RCTViewin Unknownin _in Unknownin PanGestureHandlerin Unknownin RCTViewin Unknownin _in Unknownin RCTViewin Unknownin kin Unknownin RNSScreenin _in Unknownin pin Unknownin RNSScreenContainerin Sin Unknownin Din hin Unknownin RCTViewin Unknownin win Unknownin Unknownin Unknownin Unknownin Unknownin Unknownin Unknownin RNCSafeAreaProviderin Unknownin bin uin cin RCTViewin Unknownin RCTViewin Unknownin C, js engine: hermes
react: 17.0.1
react-native: 0.64.1
react-native-reanimated: 2.1.0
Thank you everyone!
I am getting this error when I am trying to run my React Native app in iOS:
[!] CocoaPods could not find compatible versions for pod "Firebase/Auth": In Podfile: Firebase/Auth RNFBAuth (from `../node_modules/@react-native-firebase/auth`) was resolved to 10.5.1, which depends on Firebase/Auth (~> 7.4.0)CocoaPods could not find compatible versions for pod "Firebase/CoreOnly": In Podfile: Firebase/Crash was resolved to 5.0.0, which depends on Firebase/Core (= 5.0.0) was resolved to 5.0.0, which depends on Firebase/CoreOnly (= 5.0.0) RNFBApp (from `../node_modules/@react-native-firebase/app`) was resolved to 10.5.0, which depends on Firebase/CoreOnly (~> 7.4.0) RNFBDatabase (from `../node_modules/@react-native-firebase/database`) was resolved to 10.5.1, which depends on Firebase/Database (~> 7.4.0) was resolved to 7.4.0, which depends on Firebase/CoreOnly (= 7.4.0)CocoaPods could not find compatible versions for pod "Firebase/Database": In Podfile: Firebase/Database RNFBDatabase (from `../node_modules/@react-native-firebase/database`) was resolved to 10.5.1, which depends on Firebase/Database (~> 7.4.0)CocoaPods could not find compatible versions for pod "Firebase/Firestore": In Podfile: Firebase/Firestore RNFBFirestore (from `../node_modules/@react-native-firebase/firestore`) was resolved to 10.5.1, which depends on Firebase/Firestore (~> 7.4.0)CocoaPods could not find compatible versions for pod "Firebase/Messaging": In Podfile: Firebase/Messaging RNFBMessaging (from `../node_modules/@react-native-firebase/messaging`) was resolved to 10.5.1, which depends on Firebase/Messaging (~> 7.4.0)CocoaPods could not find compatible versions for pod "Firebase/Storage": In Podfile: Firebase/Storage RNFBStorage (from `../node_modules/@react-native-firebase/storage`) was resolved to 10.5.1, which depends on Firebase/Storage (~> 7.4.0)CocoaPods could not find compatible versions for pod "FirebaseCore": In Podfile: Firebase/Crash was resolved to 3.9.0, which depends on Firebase/Core (= 3.9.0) was resolved to 3.9.0, which depends on FirebaseCore (= 3.4.4) RNFBDatabase (from `../node_modules/@react-native-firebase/database`) was resolved to 10.5.1, which depends on Firebase/Database (~> 7.4.0) was resolved to 7.4.0, which depends on Firebase/CoreOnly (= 7.4.0) was resolved to 7.4.0, which depends on FirebaseCore (= 7.4.0) RNFBDatabase (from `../node_modules/@react-native-firebase/database`) was resolved to 10.5.1, which depends on Firebase/Database (~> 7.4.0) was resolved to 7.4.0, which depends on FirebaseDatabase (~> 7.4.0) was resolved to 7.4.0, which depends on FirebaseCore (~> 7.0)CocoaPods could not find compatible versions for pod "FirebaseInstanceID": In Podfile: Firebase/Crash was resolved to 3.2.0, which depends on FirebaseCrash (= 1.0.4) was resolved to 1.0.4, which depends on FirebaseInstanceID (~> 1.0) RNFBMessaging (from `../node_modules/@react-native-firebase/messaging`) was resolved to 10.5.1, which depends on Firebase/Messaging (~> 7.4.0) was resolved to 7.4.0, which depends on FirebaseMessaging (~> 7.4.0) was resolved to 7.4.0, which depends on FirebaseInstanceID (~> 7.0)My package.json is:
{"name": "prueba3000","version": "1.1.0","private": true,"scripts": {"android": "react-native run-android","ios": "react-native run-ios","start": "react-native start","test": "jest","eslint": "eslint **/*.tsx **/*.ts","build-testing": "cd android && ./gradlew assembleRelease","build-android": "cd android && ./gradlew bundleRelease","clean": "cd android && ./gradlew clean","postinstall": "npx jetify" },"dependencies": {"@fortawesome/fontawesome-svg-core": "^1.2.28","@fortawesome/free-solid-svg-icons": "^5.13.0","@fortawesome/react-native-fontawesome": "^0.2.3","@react-native-community/async-storage": "^1.9.0","@react-native-community/clipboard": "^1.5.1","@react-native-community/datetimepicker": "^3.0.8","@react-native-community/geolocation": "^2.0.2","@react-native-community/hooks": "^2.6.0","@react-native-community/image-editor": "^2.3.0","@react-native-community/masked-view": "^0.1.7","@react-native-community/slider": "^3.0.3","@react-native-firebase/app": "^10.5.0","@react-native-firebase/auth": "^10.5.1","@react-native-firebase/database": "^10.5.1","@react-native-firebase/firestore": "^10.5.1","@react-native-firebase/messaging": "^10.5.1","@react-native-firebase/storage": "^10.5.1","@react-navigation/native": "^5.1.3","@react-navigation/stack": "^5.2.6","@types/bcrypt": "^3.0.0","bcrypt": "^5.0.0","json2formdata": "^1.0.4","lottie-ios": "^3.1.3","lottie-react-native": "^3.3.2","moment": "^2.24.0","object-to-formdata": "^4.1.0","react": "17.0.1","react-native": "^0.63.4","react-native-camera": "^3.31.0","react-native-countdown-component": "^2.7.1","react-native-device-info": "^7.3.1","react-native-document-picker": "^4.1.0","react-native-fs": "^2.16.6","react-native-gesture-handler": "^1.9.0","react-native-gifted-chat": "^0.16.3","react-native-linear-gradient": "^2.5.6","react-native-modal-datetime-picker": "^9.1.0","react-native-progress": "^4.1.2","react-native-reanimated": "^2.0.0-alpha.9.2","react-native-safe-area-context": "^3.1.9","react-native-screens": "^2.4.0","react-native-splash-screen": "^3.2.0","react-native-svg": "^12.0.3","react-native-video": "^5.1.0-alpha8","react-native-video-controls": "^2.6.0","rn-fetch-blob": "^0.12.0","sprintf-js": "^1.1.2","tipsi-stripe": "^7.5.3" },"devDependencies": {"@babel/core": "^7.12.9","@babel/plugin-proposal-optional-chaining": "^7.9.0","@babel/runtime": "^7.8.7","@react-native-community/eslint-config": "^2.0.0","@svgr/cli": "^5.2.0","@types/jest": "^26.0.16","@types/react": "^17.0.0","@types/react-native": "^0.63.37","@types/react-test-renderer": "^17.0.0","@typescript-eslint/eslint-plugin": "^4.9.0","@typescript-eslint/parser": "^4.9.0","babel-eslint": "^10.1.0","babel-jest": "^26.6.3","eslint": "^7.15.0","eslint-config-airbnb": "^18.1.0","eslint-plugin-import": "^2.20.1","eslint-plugin-jsx-a11y": "^6.2.3","eslint-plugin-react": "^7.19.0","faker": "^5.1.0","jest": "^26.6.3","jest-transform-stub": "^2.0.0","jetifier": "^1.6.6","metro-react-native-babel-preset": "^0.64.0","react-test-renderer": "17.0.1","typescript": "^4.1.2" },"jest": {"preset": "react-native" },"type": "module"}In my Podfile, I have this: platform :ios, '10.1' And I have tried also with 10.0 and 9.0.
I have run:pod installnpx pod installpod install --repo-update and pod update Firebase/core.
When running pod update Firebase/core I got this error: [!] No `Podfile.lock' found in the project directory, run `pod install'.. But I can't do pod install.
If anyone could give a gint of how solve this, I would really appreciate that. Thanks!
I'm using react-native-image-picker (^0.28.0) along with rn-fetch-blob (^0.10.15).It works so far when using a Simulator, but when I use it on real iPhone, the image isn't uploading, it fails to upload with the following error that is being catched by the promise.
"Error: Could not connect to the server."
(Yes, server is up and running)
If you see this, you might think it's a backend issue but other requests work fine on real device, this one is the only having problems. The image request being sent is this one:
{data: "RNFetchBlob-file:///var/mobile/Containers/Data/Application/843A96A1-0000-40D3-B50F-95D69B94B87A/tmp/5D22283B-2014-4E9E-AC3E-AE677D91A366.jpg"filename: "IMG_6834.jpg"name: "pictures"type: "image/jpeg"}The only difference with the simulator device and my iPhone is the data path. Where on simulator is like "RNFetchBlob-file:///Users/marian-mac/Library/Developer/CoreSimulator/Devices/....etc"
Any idea why should be different from the simulator on this? It seems to be sending the same request.
Some extra info, when I preview the image in an Image component, it shows well too. So it seems the path is correct on the real iPhone.
This is the method to upload image
uploadPicture: function(data, token) { return RNFetchBlob.fetch('POST', Constants.baseUrl +'/picture', { Authorization: "Bearer "+ token,'Content-Type': 'multipart/form-data;boundary=***BOUNDARY***' }, data); },And this is how I build the picture request array, this.state.images contains the image-picker data.
this.state.images.forEach((image) => { reqData.push({ data: image.imageFile, filename: image.fileName.split('.')[0] +'.jpg', name: 'pictures', type: image.type }) });I'm starting to get some weird gaps on my screens in my React Native application.
I have simplified a screen so you see the issue here:
<View style={{flex: 1, backgroundColor: main.colours.gray_lightest,}}><SafeAreaView style={{flex:1, backgroundColor: main.colours.red_light,}}><View style={{flex: 1, backgroundColor: main.colours.gray_lightest,}}></View></SafeAreaView></View>
When I enter the background-mode and reopen the app (quickly swipe gesture on iPhone 12) the issue has disappeared. See example:
I am searching for a solution to find the rotation/spin count of the phone using its sensors, if the phone is rotated like a coin or dice. I thought to calculate the total rotated angle and divide it by 360 deg to calculate the rotation count.
Rotation count = Total rotated angle/360 degI think that there are packages like react-native-sensors and expo-sensor that can help to find the Total rotated angle in React Native. It has access to sensors like Gyroscope, Accelerometer and Magnetometer.
Can we find the Total rotated angle using Gyroscope sensor ?
Is there any other way to find the phone rotated count in React Native?