1.0.1 • Published 6 years ago
react-native-preload v1.0.1
React Native Preload Documentation
Installation
npm i react-native-preload
Import
import {
Skeleton
} from 'react-native-preload'
Quick Example
<Skeleton Width={70} Height={30} BorderRadius={4} />
Skeleton Properties Detail
Define a Skeleton
screen with following properties as such:
Property | Type | Description |
---|---|---|
Width | Number | Defines the width of the skeleton to be shown |
Height | Number | Defines the height of the skeleton to be shown |
BorderRadius | Number | Defines the borderRadius of the skeleton to be shown |
Responsive Skeleton Screen
To render a responsive screen, use Dimensions
react-native library to get the width of the screen of your device like such
import { Dimensions } from 'react-native'
const SCREEN_WIDTH = Dimensions.get('window').width
const SCREEN_HEIGHT = Dimensions.get('window').height
Skeleton Screen
<View style={{ width: SCREEN_WIDTH / 5,
height: SCREEN_HEIGHT / 5.8,
backgroundColor: '#d8d8d8',
borderRadius:8, }} >
<Skeleton Width={70} Height={SCREEN_HEIGHT / 5.8} BorderRadius={8} />
</View>
Skeleton Properties Detail
Define a Skeleton
screen with following properties as such:
Property | Type | Description |
---|---|---|
Width | Number | Defines the width of the skeleton to be shown |
Height | Number | Defines the height of the skeleton to be shown |
BorderRadius | Number | Defines the borderRadius of the skeleton to be shown |