JSPM – @freakycoder/react-native-helpers@0.1.3

Package Exports

@freakycoder/react-native-helpers

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@freakycoder/react-native-helpers) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

React Native Helpers

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",

DeviceInfo Usage

import {
  Screen,
  ScreenWidth,
  ScreenHeight,
  isIOS,
  isAndroid
} from "@freakycoder/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>;

Notch (iPhoneX & StatusBar) Usage

import {
  isIPhoneXFamily,
  hasNotch,
  isIPhoneX,
  isIPhoneXr,
  isIPhoneXs,
  isIPhoneXsMax,
  getStatusBarHeight
} from "@freakycoder/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 "@freakycoder/react-native-helpers";

fontSize: normalizeText(24),

Native Number Format Usage

Method to format the number of your texted number. You can change each options.

import { numberFormat } from "@freakycoder/react-native-helpers";

<Text>{numberFormat(50319341)</Text> // Output: 50.319.341
<Text>
  {numberFormat(1093495, "en", {
    style: "currency",
    currency: "GBP"
  })}
</Text>// Output: £ 50.319.341

Credits

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

Roadmap

LICENSE
Write an article about the lib on Medium

Author

FreakyCoder, kurayogun@gmail.com

License

React Native Helpers Library is available under the MIT license. See the LICENSE file for more info.