/ Miscellaneous

Easy to use & awesome helpers for React Native

Easy to use & awesome helpers for React Native

react-native-helpers

Easy to use & awesome helpers for React Native.

Installation

Add the dependency:

React Native:

npm i @freakycoder/react-native-helpers

// Expo Version
"@freakycoder/react-native-helpers": "WrathChaos/@freakycoder/react-native-helpers#expo"

Peer Dependencies

IMPORTANT! You need install them.
"react": ">= 16.x.x",
"react-native": ">= 0.55.x",
"@react-native-community/status-bar": "^1.x.x"

DeviceInfo Usage

import {
  Screen,
  ScreenWidth,
  ScreenHeight,
  isIOS,
  isAndroid
} from "react-native-helpers";

<View>
  <Container title="Device OS" subtitle={isIOS ? "iOS" : "Android"} />
  <Container title="Screen Height" subtitle={ScreenHeight} />
  <Container title="Screen Width" subtitle={ScreenWidth} />
</View>;

Noth (iPhoneX & StatusBar) Usage

import {
  isIPhoneXFamily,
  hasNotch,
  isIPhoneX,
  isIPhoneXr,
  isIPhoneXs,
  isIPhoneXsMax,
  getStatusBarHeight
} from "react-native-helpers";

<View>
  <Container
    title="hasNotch?"
    subtitle={hasNotch() ? "iPhone X Family" : "iPhone Family"}
  />
  <Container
    title="isIPhoneXsMax?"
    subtitle={isIPhoneXsMax(Screen) ? "iPhone XsMax" : "NOT iPhone XsMax"}
  />
  <Container title="getStatusBarHeight?" subtitle={getStatusBarHeight()} />
</View>;

Normalize Text Usage

Method to normalize size of fonts across devices

import normalizeText from "./lib/src/helpers/normalize/normalizeText";

fontSize: normalizeText(24),

Credits

NormalizeText is completely coming from react-native-elements. All credits goes to @xiaoneng and RN Elements team. Thank you so much guys.

ToDos

  • [x] LICENSE
  • [ ] Write an article about the lib on Medium

Author

FreakyCoder, [email protected]

GitHub