Menu
When using React Native to define some styling dimensions do not have any units:
welcome: {
fontSize: 20,
margin: 10,
}
I assume the reason is because it's cross platform code, and iOS and Android use different units.
The docs are not very helpful since all the examples use rem units and there's no mention about units anywhere.
So what units are being used for each platform?
Edit: the other answer doesn't say what units are being used in Android. I'm presuming it's dp but it isn't specified anywhere.
499
React Native uses density-independent pixels, or dp, as it's default unit. This will size elements so that they are roughly the same physical size on different devices.
You can get the application window's width and height using the following code: const windowWidth = Dimensions. get('window').
From what I know, the javascript styling that we use in react js or react native uses pixels. Pixel ratio is only needed to support different size of mobile device screens.
The units are logical pixels for iOS. See SO question here, which was answered by a contributor to React Native.
For Android, the units are in DIP which is kinda similar to logical points in iOS (There is a nice write up on the subject). If you look at the source code here, you'll see that they convert the supplied value toPixelFromDIP.
179
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
