https://github.com/heyman333/react-native-iphone-se-helper

📂 utils for developing Iphone SE size
https://github.com/heyman333/react-native-iphone-se-helper

Last synced: about 1 month ago
JSON representation

📂 utils for developing Iphone SE size

• Host: GitHub
• URL: https://github.com/heyman333/react-native-iphone-se-helper
• Owner: heyman333
• License: mit
• Created: 2019-02-12T02:09:50.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2019-03-07T09:28:16.000Z (over 5 years ago)
• Last Synced: 2024-07-04T19:38:49.333Z (3 months ago)
• Language: JavaScript
• Homepage:
• Size: 5.86 KB
• Stars: 8
• Watchers: 1
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-react-native - react-native-iphone-se-helper ★0 - utils for developing iphone SE size. (Components / Utils & Infra)
• awesome-react-native - react-native-iphone-se-helper ★0 - utils for developing iphone SE size. (Components / Utils & Infra)
• awesome-react-native - react-native-iphone-se-helper ★0 - utils for developing iphone SE size. (Components / Utils & Infra)

README

        
# react-native-iphone-se-helper

This package was created with strong motivation for [react-native-iphone-x-helper](https://github.com/ptelad/react-native-iphone-x-helper) (author: [ptelad](https://github.com/ptelad))

## install 

```bash

yarn add react-native-iphone-se-helper

#or 

npm install react-native-iphone-se-helper --save

```

## API

### isIphoneSE(): boolean 

returns whether the device is a iPhons SE or others

### concernSESize(originalSize: number, seSize: number): number

determines the size by dividing whether it is SE or not

## Example

```js

import { isIphoneSE, concernSESize } from "react-native-iphone-se-helper";

const styles = StyleSheet.create({

  container: {

    flex: 1,

    justifyContent: "center",

    alignItems: "center",

    backgroundColor: "#F5FCFF"

  },

  welcome: {

    fontSize: concernSESize(20, 11),

    textAlign: "center",

    margin: isIphoneSE() ? 5 : 10

  },

  instructions: {

    textAlign: "center",

    color: "#333333",

    marginBottom: 5

  }

});

```

## License

MIT