# rn-responsive-lite

> Installation is done using the [`npm install` command](https://docs.npmjs.com/getting-started/installing-npm-packages-locally):

Latest version **1.1.4** (published 2020-10-03) · ISC license · 0 weekly downloads

## Install

```sh
npm install rn-responsive-lite
pnpm add rn-responsive-lite
yarn add rn-responsive-lite
bun add rn-responsive-lite
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.1.4 |
| Published | 2020-10-03 |
| First published | 2020-10-02 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 3.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Souradeep Das |
| Maintainers | ditinexhosting, codecrackers |

## Links

- npm: https://www.npmjs.com/package/rn-responsive-lite
- npm.io page: https://npm.io/package/rn-responsive-lite

## Recent versions

- 1.1.4 (latest) — 2020-10-03
- 1.1.3 — 2020-10-02
- 1.1.2 — 2020-10-02
- 1.1.1 — 2020-10-02
- 1.1.0 — 2020-10-02
- 1.0.1 — 2020-10-02
- 1.0.0 — 2020-10-02

## README

## Installation

Installation is done using the
[`npm install` command](https://docs.npmjs.com/getting-started/installing-npm-packages-locally):

```bash
npm install rn-responsive-lite
```
## Pre-usage Setup
- Import rnrsp in your main root file.But not in index.js(any root file after index.js)
```js
import {rnrsp} from 'rn-responsive-lite';
```
- Initialize all the required variables. 
```js
const {height, width} = Dimensions.get('window')
rnrsp.init(height,width);
```

Refer to the below demo snippet of main file. Here my main component is named as *Main* and file *Main.js*.
```js
import React, { Component } from 'react';
import { Dimensions } from 'react-native';
const {height, width} = Dimensions.get('window')

/*
 * Initialize all states or global variables you need
 */
rnrsp.init(height,width);

export default class Main extends Component {
  constructor(props) {
    super(props);
    this.state = {
    };
  }

  componentDidMount(){
  }

  componentWillUnmount() {
  }

  render() {
    return (
      <Text style={{height: rnrsp.height(50)}}>My clild components here.</Text>
    );
  }
}

```
## Usage
- Responsive Height.
```js
rnrsp.height(value)
```
- Responsive Width.
```js
rnrsp.width(value)
```
- Responsive Height Percentage.
```js
rnrsp.heightp(value)
```
- Responsive Width Percentage.
```js
rnrsp.widthp(value)
```
- Responsive Fontsize.
```js
rnrsp.fontsize(value)
```
- Responsive Elements like square circle whose height and width is equal.
```js
rnrsp.allround(value)
```


## License
[ISC]

---
_Source: https://npm.io/package/rn-responsive-lite · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._