https://github.com/jmstout/react-native-viewport-units

Incredibly simple utility for (sort of) using viewport units with React Native.
https://github.com/jmstout/react-native-viewport-units

Last synced: about 1 month ago
JSON representation

Incredibly simple utility for (sort of) using viewport units with React Native.

• Host: GitHub
• URL: https://github.com/jmstout/react-native-viewport-units
• Owner: jmstout
• License: mit
• Created: 2015-04-05T04:36:55.000Z (almost 10 years ago)
• Default Branch: master
• Last Pushed: 2015-11-18T18:43:41.000Z (about 9 years ago)
• Last Synced: 2024-10-29T15:40:11.686Z (2 months ago)
• Language: JavaScript
• Size: 138 KB
• Stars: 158
• Watchers: 4
• Forks: 25
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-react-native - react-native-viewport-units ★107 - Incredibly simple utility for (sort of) using viewport units with React Native. (Components / UI)
• awesome-reactnative-ui - react-native-viewport-units
• awesome-react-native - react-native-viewport-units ★107 - Incredibly simple utility for (sort of) using viewport units with React Native. (Components / UI)
• awesome-reactnative-ui - react-native-viewport-units
• awesome-react-native - react-native-viewport-units ★107 - Incredibly simple utility for (sort of) using viewport units with React Native. (Components / UI)
• awesome-react-native - react-native-viewport-units ★107 - Incredibly simple utility for (sort of) using viewport units with React Native. (Components / UI)
• awesome-react-native-ui - react-native-viewport-units ★50 - Incredibly simple utility for (sort of) using viewport units with React Native. (Components / UI)

README

        
# react-native-viewport-units

Incredibly simple utility for (sort of) using viewport units with [React Native](https://github.com/facebook/react-native).

## Install

```sh

$ npm install react-native-viewport-units --save

```

## Usage

```javascript

var {vw, vh, vmin, vmax} = require('react-native-viewport-units');

```

Notice the required operator/syntax: __x * vw__

```javascript

```

```javascript

var styles = StyleSheet.create({

  lookingGood: {

    width: 15*vmin,

    height: 10*vmax,

    padding: 2*vw,

    margin: 4*vh,

  }

});

```

## Roadmap

I would like to add support for orientation changes and reflowing components that use viewport units. I am, however, waiting until something official lands. Keeping a close eye on [418](https://github.com/facebook/react-native/pull/418).

## License

MIT © [Jeff Stout](http://jmstout.com)