npm i react-native-preload
import {
Skeleton
} from 'react-native-preload'
<Skeleton Width={70} Height={30} BorderRadius={4} />
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 |
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
<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>
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 |