All helpers in one; iPhone series support, dimensions helper, hasNotch helper, normalize text helper and text helpers for React Native with very easy use

!expo-compatible
!Platform - Android and iOS

Installation

Add the dependency:

$3

``bash
npm i @freakycoder/react-native-helpers
`

DeviceInfo Usage

`tsx
import {
Screen,
ScreenWidth,
ScreenHeight,
isIOS,
isAndroid,
isTablet
} from "@freakycoder/react-native-helpers";






;
`

Notch & DynamicIsland Usage

`ts
import {
getStatusBarHeight,
hasNotch,
hasNotchOnly,
hasDynamicIsland,
getStatusBarHeight,
} from "@freakycoder/react-native-helpers";


title="hasNotch?"
subtitle={hasNotch() ? "Has Notch" : "NOT notch"}
/>
title="hasDynamicIsland?"
subtitle={
hasDynamicIsland(Screen) ? "Has Dynamic Island" : "NOT Dynamic Island"
}
/>

;
`

Open Applications or Stores by Linking

`ts
import { openAppInPlayStore, openAppInAppStore, openExternalApp } from "@freakycoder/react-native-helpers";

openAppInPlayStore('com.example.android');
openAppInAppStore('123456789');
openExternalApp('com.example.android', '123456789');
`

Normalize Text Usage

Method to normalize size of fonts across devices

`ts
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.

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

{numberFormat(50319341) // Output: 50.319.341

{numberFormat(1093495, "en", {
style: "currency",
currency: "GBP"
})}
// Output: £ 50.319.341
``

Configuration - Props

DeviceInfo Props

| Property | Type | Description |
|-------------------|:-------:|----------------------------------------------------------------------------------------------------------------------------|
| isIOS | boolean | returns if it is an iOS device or not |
| isAndroid | boolean | returns if it is an Android device or not |
| isTablet | boolean | returns if it is a tablet or phone |
| ScreenWidth | number | get the device's screen width |
| ScreenHeight | number | get the device's screen height |
| ScreenScale | number | get the device's screen scale ratio |
| ScreenFontScale | number | get the device's screen font scale ratio (depends on the user's device font scale setting) |
| WindowWidth | number | get the device's window width |
| WindowHeight | number | get the device's window height |
| WindowScale | number | get the device's window scale ratio |
| WindowFontScale | number | get the device's window font scale ratio (depends on the user's device font scale setting) |
| PlatformVersion | number | returns the platform version |
| ScreenMin | number | get the device's screen width/height which are minimum depend on the landscape or portrait mode |
| ScreenMax | number | get the device's screen width/height which are maximum depend on the landscape or portrait mode |
| vh | number | get the device's height but as a viewport unit |
| vw | number | get the device's width but as a viewport unit |
| vmin | number | get the device's screen width/height as a viewport unit which are minimum depend on the landscape or portrait mode |
| vmax | number | get the device's screen width/height as a viewport unit which are maximum depend on the landscape or portrait mode |
| getDeviceLanguage | string | get the device's language (en_US) |

DeviceInfo Props

getStatusBarHeight, hasNotch, hasNotchOnly, hasDynamicIsland

| Property | Type | Description |
|--------------------|:--------:|-------------------------------------------------------------------------------------------|
| hasNotch | function | returns if the device has notch (returns true for dynamic island!) |
| hasNotchOnly | function | returns if the device has notch only, it does not detect if the device has dynamic island |
| hasDynamicIsland | function | returns if the device has dynamic island |
| getStatusBarHeight | number | returns status bar height of the device |

Utils Props

| Property | Type | Description |
|--------------------|:------------------------------------:|--------------------------------------------------------|
| openAppInPlayStore | function(appPackageName) | opens the app on android or Google Play |
| openAppInAppStore | function(appStoreId) | opens the app on ios or App Store |
| openExternalApp | function(appPackageName, appStoreId) | opens the app on ios or android - handles the platform |

Normalize Text Props

| Property | Type | Description |
|-----------|:----------------:|----------------------------------|
| normalize | function(number) | returns the normalized font size |

Custom Text Props

| Property | Type | Description |
|--------------|:--------------------------------:|-------------------------------------------------------------|
| numberFormat | function(value, locale, options) | returns the number formatted font with its given parameters |

$3

- [x] ~~LICENSE~~
- [x] ~~Typescript~~
- [x] ~~iPhone Series Support~~
- [x] ~~Dynamic Island~~
- [ ] Separate the style helpers from device
- [ ] More custom text helpers
- [ ] 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.