Skip to main content

Questions tagged [react-native]

React Native is a JavaScript library used to build native mobile apps using React. The focus of React Native is on developer efficiency across all the platforms you care about - learn once, write anywhere.

Filter by
Sorted by
Tagged with
121 votes
12 answers
259k views

how to delete installed library form react native project

I have installed a third party library in my project but it is not working , so I want to delete that library from my project , How can I do that ?
rajat44's user avatar
  • 5,091
121 votes
11 answers
113k views

React Native global styles

I'm new with React and I understand the benefits of the component based, inline styles. But I'm wondering if there is a decent way to have some sort of global style. For instance, I'd like to use the ...
Patm's user avatar
  • 2,065
121 votes
8 answers
172k views

What is the quickest way to convert a React app to React Native? [closed]

This may be a naive question, but I couldn't find too much information on this topic. I have a fully functional react-redux application and I would now like to port it to iOS and Android. I have no ...
tbogatchev's user avatar
  • 1,581
120 votes
22 answers
333k views

Image resizing in React Native

I am trying to resize an image (smaller to fit screen) in my react native app but am unable to do it as it is too big. Here is the code: 'use strict'; var React = require('react-native'); var { ...
rahul2001's user avatar
  • 1,657
120 votes
4 answers
58k views

When to use TouchableNativeFeedback, TouchableHighlight or TouchableOpacity?

In React Native, there are at least three ways to make a button: TouchableNativeFeedback, TouchableHighlight and TouchableOpacity. There is also TouchableWithoutFeedback, which the documentation ...
damusnet's user avatar
  • 4,388
119 votes
7 answers
190k views

How to set <Text> text to upper case in react native

How to set <Text> some text </Text> as upper case in react native? <Text style={{}}> Test </Text> Need to show that Test as TEST.
Thivya's user avatar
  • 3,032
118 votes
22 answers
107k views

React Native ios build : Can't find node

I have a prototype ready to go and the project is jammed with build: error: Can't find 'node' binary to build React Native bundle If you have non-standard nodejs installation, select your project ...
Seeliang's user avatar
  • 2,771
118 votes
10 answers
217k views

Error: Could not initialize class com.android.sdklib.repository.AndroidSdkHandler

I've setup the environment for react native on Windows. But when I run the command react-native run-android I get the following errors - * What went wrong: A problem occurred configuring project ':...
Paul Santosh's user avatar
  • 1,181
118 votes
14 answers
208k views

How to set image width to be 100% and height to be auto in react native?

I am trying to display list of images in a scrollview. Width should be 100%, while height should be automatic, keeping aspect ratio. The searches I did pointed to various solutions which give ...
Prabhakar Bhat's user avatar
117 votes
36 answers
168k views

React Native : Error: Duplicate resources - Android

I was trying to create a release apk file from Android but when I create a release apk with PNG image I'm getting Duplicate Resource error. Initially I thought this is happening because I made a ...
Jeffrey's user avatar
  • 4,610
117 votes
5 answers
155k views

How to use border radius only for 1 corner (react-native)?

How to use border radius in React Native only for 1 corner? I have a modal window As you can see bottom corners not rounded, it happens when I used backgroundColor for buttons. I was trying to set ...
Maksim's user avatar
  • 2,436
116 votes
8 answers
91k views

Is there a way in which I can ignore touch events on Text in React Native?

I want to implement floating labels, for this I have a Text Component Above a TextInput. I want to ignore all the touch events on the Text so that the TextInput under it gets all the events. Is there ...
Mayank Patel's user avatar
  • 2,837
116 votes
23 answers
363k views

React Native: JAVA_HOME is not set and no 'java' command could be found in your PATH

I've followed step by step the official Getting Started. I started from a clean linux install and installed everything required as per the "Building Projects with Native Code" tab. I have also read ...
Mister Smith's user avatar
  • 27.9k
116 votes
16 answers
226k views

Resetting the navigation stack for the home screen (React Navigation and React Native)

I've got a problem with the navigation of React Navigation and React Native. It is about resetting navigation and returning to the home screen. I've build a StackNavigator inside of a DrawerNavigator,...
Daniel's user avatar
  • 2,069
116 votes
13 answers
81k views

iOS Launch screen in React Native

I'm working with a React Native app and I'm trying to set a customize launch screen but I'm not able to. React Native creates a LaunchScreen.xib by default, so I've created a LaunchImage inside Images....
JV Lobo's user avatar
  • 6,176
115 votes
27 answers
237k views

Error: Unable to resolve module `react-native-gesture-handler`

I try to use navigate in react-native.. I added : npm install --save react-navigation but it gives me an error like this : error: bundling failed: Error: Unable to resolve module react-native-...
rnn's user avatar
  • 2,513
114 votes
17 answers
122k views

React Native Android Build Error MainActivity.java:29: error: cannot find symbol

I'm getting this error when trying to compile my React Native android app. The Android app can't resolve BuildConfig.DEBUG. :app:processDebugJavaRes UP-TO-DATE :app:compileDebugJavaWithJavac /Users/...
Overload119's user avatar
  • 5,364
113 votes
4 answers
52k views

React Native Animated, Complete Event

What's the best practice to trigger an event when Animated.spring finishes? Animated.spring(this.state.pan, { toValue: 0 }).start() I've searched quite a bit and haven't found a single way to do ...
August Bjornberg's user avatar
112 votes
6 answers
139k views

Simulate display: inline in React Native

React Native doesn't support the CSS display property, and by default all elements use the behavior of display: flex (no inline-flex either). Most non-flex layouts can be simulated with flex ...
Brent Traut's user avatar
  • 5,734
112 votes
10 answers
236k views

useDispatch() Error: Could not find react-redux context value; please ensure the component is wrapped in a <Provider>

I am trygin to use React-Redux library and I am getting the error on the title. I wrapped my components with Provider but I still get the error, only if I implement the useDispatch() hook. The app ...
MIPB's user avatar
  • 2,291
111 votes
9 answers
205k views

React Native: Getting the position of an element

I am styling an Image component with flexbox to be in the center of the screen which works pretty well. Now I want a second Image component to be displayed directly on the top of the first one. The ...
Johannes Stein's user avatar
111 votes
14 answers
215k views

error: package com.android.annotations does not exist

I have the following class import com.android.annotations.NonNullByDefault; @NonNullByDefault public final class Log { ... } and here is my build.gradle file (some parts omitted) apply plugin: ...
Adam's user avatar
  • 2,097
111 votes
11 answers
97k views

How to prevent layout from overlapping with iOS status bar

I am working on tutorial for React Native navigation. I found out that all layout starts loading from top of screen instead of below of the status bar. This causes most layouts to overlap with the ...
Cliff's user avatar
  • 1,538
110 votes
30 answers
123k views

Error: EMFILE: too many open files - React Native CLI

I try to run a react-native-cli project using react-native start, and the metro bundler fails, saying the following: events.js 187 throw er; //Unhandled 'error' event Error: EMFILE: too many open ...
Amir's user avatar
  • 1,820
110 votes
32 answers
255k views

npm install Error: rollbackFailedOptional

When I try npm install new packages it shows me this error: rollbackFailedOptional: verb npm-session 585aaecfe5f9a82 node --version 8.4.0 npm --version 5.3.0
Bipul Prasai's user avatar
  • 1,101
110 votes
11 answers
117k views

React Native error: "Could not determine java version from '9.0.1'."

I'm working on MacOS and just starting with react-native. One of the first steps to get started is to run: react-native run-android or react-native run-ios. But I'm getting this error: react-native ...
Xar's user avatar
  • 7,804
109 votes
18 answers
181k views

React native ERROR Packager can't listen on port 8081

When I run command react-native start, it shows Packager can't listen on port 8081. I know the issue is about software using my port 8081 . I use Resource Monitor to see the port, but I can't find ...
Morton's user avatar
  • 5,650
109 votes
10 answers
134k views

How to detect when keyboard is opened or closed in React Native

How to detect if user close the keyboard in react native, I want to call a function when user closed the keyboard. and if you can answer to detect keyboard is open too it will be appreciated, thanks. ...
RajnishCoder's user avatar
  • 3,635
109 votes
14 answers
59k views

Xcode throws 'atomic_notify_one<unsigned long>' is unavailable

I installed Xcode 12 on my Mac, tried building my react native app that runs perfectly on android, and get 'atomic_notify_one<unsigned long>' is unavailable. This is the most information I get ...
Marvelous Ikechi's user avatar
109 votes
20 answers
216k views

How can I regenerate ios folder in React Native project?

So a while ago I deleted the /ios directory in my react native app (let's call it X). I've been developing and testing using the android emulator but now I'd like to make sure it works on ios with ...
Tam Borine's user avatar
  • 1,534
108 votes
14 answers
202k views

How to set iOS status bar background color in React Native?

Is there a single place in the react native iOS native code that I could modify to set iOS statusbar backgroundColor? RCTRootView.m ? The react native StatusBar component only support backgroundColor ...
Ed of the Mountain's user avatar
108 votes
17 answers
57k views

Xcode 15: Unable to boot the Simulator

I was able to run iOS simulator fine with Xcode 14 and my Mac recently updated the latest version of Xcode which is 15 then I'm no longer able to boot a device from its new simulator. I did try many ...
tmhao2005's user avatar
  • 16.9k
108 votes
12 answers
131k views

How to get a versionName in react-native app on Android?

I've made a timestamped versionName in build.gradle like 20150707.1125. I want to show the version of the package in react-native app in about window. How I could get versionName in code?
usego's user avatar
  • 1,083
108 votes
23 answers
193k views

How to re-render flatlist?

Unlike ListView we can update this.state.datasource. Is there any method or example to update FlatList or re-render it? My goal is to update the text value when user press button ... renderEntries({ ...
shalonteoh's user avatar
  • 2,064
108 votes
16 answers
56k views

'event2/event-config.h' file not found

I am trying to build a react-native app in iOS but unfortunately coming across the following issue (referring to libevent/Flipper): 'event2/event-config.h' file not found I have react-native v0.63.4 ...
UsmanJ's user avatar
  • 1,299
108 votes
14 answers
208k views

Make an item stick to the bottom using flex in react-native

Suppose this is the layout: <View style={styles.container}> <View style={styles.titleWrapper}> ... ... </View> <View style={styles.inputWrapper}> ...
Karl's user avatar
  • 1,739
108 votes
15 answers
146k views

React Native FlatList with columns, Last item width

I'm using a FlatList to show a list of items in two columns <FlatList style={{margin:5}} data={this.state.items} numColumns={2} keyExtractor={(item, index) => item.id } renderItem={(...
Escobar5's user avatar
  • 4,052
107 votes
15 answers
123k views

Renaming a React Native project?

Are there instructions for what needs to be changed in order to rename a React Native project? I have an app called something along the lines of MyAppIOS and I want to rename it to simply MyApp (now ...
Some Guy's user avatar
  • 13.3k
107 votes
5 answers
154k views

Change React-Native TextInput's placeholder color

I'm creating an Android app using React Native in which there's a form. The placeholder doesn't even appear for the TextInput fields so I thought of changing the placeholder color but I don't know how ...
Etherealm's user avatar
  • 2,434
107 votes
14 answers
257k views

How can I put an icon inside a TextInput in React Native?

I am thinking of having something like this https://android-arsenal.com/details/1/3941 where you have icon that you press to show password as plaintext, not as dots. However, I was unable to find any ...
Zygro's user avatar
  • 7,059
107 votes
12 answers
213k views

In React Native, how do I put a view on top of another view, with part of it lying outside the bounds of the view behind?

I'm trying to make a layout as per below with React Native. How do I specify the position of B relative to A? With iOS Interface Builder and autoconstraints, this can very explicitly be done and is ...
fatuhoku's user avatar
  • 4,873
107 votes
16 answers
159k views

React Native iOS and Android folders not present

I'm new to react native, and I've been having some trouble understanding the folder structure of the app which should supposedly be present in the project folder on creation. Basically, when creating ...
Simon Eliasson's user avatar
107 votes
3 answers
66k views

React Native DEV and PROD variables

How do I know if my React Native app is running in production or development? Is there some sort of way within JavaScript to tell? Is there a global that is passed in?
Ryan McDermott's user avatar
107 votes
8 answers
164k views

How can I run background tasks in React Native?

I've built a little iOS app in React Native that does location tracking, sending the lat/lng regularly to a server of the user's choosing. However this only works when the app is in the foreground. ...
liamzebedee's user avatar
  • 14.3k
107 votes
8 answers
198k views

How to use global variables in React Native?

In React Native I want to use global variables when I am moving between different screens Can anyone help me how to achieve it?
Dev's user avatar
  • 1,127
106 votes
7 answers
86k views

React Native: vertical centering when using ScrollView

I'm using React Native and I'm having trouble retaining vertical centering of elements as soon as I introduce a ScrollView. To demonstrate, I created 3 apps with React Native Playground. All ...
Johnny Oshika's user avatar