I see that percentage values in styles are now supported in ReactNative. I am have started working on a project that uses react-native v0.55.4, with percentages in its styles. However, when I bring up the debug tools, click "inspect" and click on a component that uses a percentage I get the following error:
JSON value '6.4%; of type NSString cannot be converted to NSNumber
This also causes an equivalent error when using values like auto for width.
I've been trying to work out how fix this, but I can't work out where I need to put the fix. Does anyone have any ideas?
Note: I'm using iOS Simulator v10
Related
I would like to create a box to select the date as in the attached photo.
What do you recommend to create something similar in react native with expo?
I tried using MUI's Mobile DatePicker API, but it doesn't work, errors occur.
Update:
I created this box to select the date, but when I go to press it gives me an error.
The error is the following:
https://www.npmjs.com/package/#react-native-community/datetimepicker
Works with Expo. Static version set at 3.x.x (something version 3). So you won't have the full functionality that is described on their docs, but you'll have enough.
expo install #react-native-community/datetimepicker
instead of npm to ensure you get the compatible version.
This library can be a bit difficult to work with. The main suggestion I have for you is to create a custom component on your own that looks like your design. Then wrap it with a TouchableOpacity and onPress set the DateTimePicker to show its modal. Grab the value you need from the onChange result, and pass it to your local state. Dont try anything fancy after that because as I mentioned earlier, the library is difficult to work with and really fights hard against any customization. It works well though and will certainly solve your problem.
I've looked it up on reactnative.dev, and the Text component is supposed to have an 'onTextLayout' prop.
I'm running the React Native version 0.62.2, and the documentation on their site says it applies for 0.62. However, when I try to use the prop in a Text component, I am shown this message:
I need to use this prop to detect when the text starts overflowing into two lines. If anyone has another solution of how I can accomplish this without onTextLayout, that would also be very helpful.
It appears it's not working on react-native-web
http://necolas.github.io/react-native-web/docs/?path=/docs/components-text--children
Just test your app on android/iOS and you will be fine
I usually develop my app on an Android device. Now for some unknown reason, my app gets this error on startup when it loads some screen. I have tried to find the root of the problem, but I keep getting this error even if the screen it navigates to is completely empty.
I'm using expo so I don't have any debugger in use that can help my figure out what's wrong.
I need to detect the css value source for a component, currently, I get this in react-native-debugger:
I can't find the style source that caused the padding value to be 14 as above.
Any idea how to debug this?
I am from a web design background, I usually use Chrome to find the source css file, but in react-native I am just starting to learn.
I'm having an issue where I get the above error, but only when on my hardware ios device, or emulator debugging is turned off. IF it is on, it works fine in the ios 6 simulator.
Any ideas?
I found the answer.
Interestingly, React-Native seems to use a different version of Javascript when the debugger is on. I was trying to use a ES5 function for formatting text as currency, and it worked fine as long as the debugger (and browser) are on. However, turning this off forces react-native to use their specific javascript core which did not support that javascript function.
I fixed it by using a different function. The error should be more specifc to explain you are doing something illegal.