Skip to content
This repository was archived by the owner on Dec 29, 2022. It is now read-only.

Commit 11f3202

Browse files
committed
Add README
1 parent f681f83 commit 11f3202

File tree

1 file changed

+38
-0
lines changed

1 file changed

+38
-0
lines changed

README.md

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
# react-native-responsive-dimensions
2+
3+
Responsive height, width and responsive fontSize for react native components that automatically adjust themselves based on the screen size of the device. The dimensions can be used for any components like View, Image, Text etc.
4+
5+
Installation
6+
```sh
7+
#npm
8+
npm install --save react-native-responsive-dimensions
9+
10+
#yarn
11+
yarn add react-native-responsive-dimensions
12+
```
13+
14+
The below snippet will create styles with a container of dynamic height, width and a sample text with dynamic font-size relative to the screen size of the device the app is run.
15+
16+
```js
17+
import { StyleSheet } from 'react-native';
18+
import { responsiveHeight, responsiveWidth, responsiveFontSize } from 'react-native-responsive-dimensions';
19+
20+
const styles = StyleSheet.create({
21+
container: {
22+
justifyContent: 'center',
23+
height: responsiveHeight(50),
24+
width: responsiveWidth(50),
25+
alignItems: 'center',
26+
},
27+
sampleText: {
28+
fontSize: responsiveFontSize(2),
29+
}
30+
});
31+
```
32+
33+
This will create a container(view/image) with height that is exactly 50% of the device's screen-height and width exactly 50% of the device's screen-height and a font with fontSize that occupies exactly 2% of the screen size.
34+
35+
License
36+
----
37+
38+
MIT

0 commit comments

Comments
 (0)