Set of helpers and components for the react-native projects.
"I hope they help someone to write less code and to solve common problems.."
Installation:
npm i rn-units --safe
or
yarn add rn-units
Constants
Don't support dynamic updates!
Props | Type |
---|---|
screenWidth | Number |
screenHeight | Number |
isLandscape | Boolean |
isPortrait | Boolean |
isIOS | Boolean |
isAndroid | Boolean |
Methods
Props | Description |
---|---|
vw | percent of screen width width: vw(90)
|
vh | percent of screen height height: vh(10)
|
rem | responsive units for markup width: rem(20)
|
font | responsive units for font size fontSize: font(20)
|
img | converts url or filepath into img source <Image source={img('http://...')} />
|
wait | creates delay in async functions await wait(1000) // delay 1000ms
|
seconds | converts seconds to milliseconds setTimeout(foo, seconds(10)
|
minutes | converts minutes to milliseconds setTimeout(foo, minutes(10)
|
hours | converts hours to milliseconds setTimeout(foo, hours(10)
|
days | converts days to milliseconds setTimeout(foo, days(10)
|
weeks | converts weeks to milliseconds setTimeout(foo, weeks(10)
|
combineStyles | used to combine multiple styles <Image style={combineStyles(styles.logo, styles.centered)} >
|
equals | used compare items const areEqual = equals({id: 0}, {id: 0})
|
clone | used deepClone item const clonedObject = clone({ deep: { id: 0 } })
|