React-native-ui-skel NPM

react-native-ui-skel

Alt Text

A simple React Native component that implements a Skeleton UI. It will performance your react-native app and you will get more fps ( this library only works in a bare react-native app ).

if you are using expo, please use this lib: react-native-ui-skel-expo

Install your skel

npm i react-native-ui-skel

install react-native-linear-gradient (if you already have it, jump this step)

npm i react-native-linear-gradient

install new pods (only iOS)

npx pod-install

Usage/Examples

import { Skel } from 'react-native-ui-skel'

<View>
    <Skel 
      height={40} 
      width={300}
      styles={{ borderRadius: 4 }}
    />
</View>

Props

Name	Type	Default	Description
height	number	required	Skel height
width	number	required	Skel width
duration	number	1000 ms	Duration of the animation
styles	object	{}	The style applied to the Skel
backgroundColor	string	#EBEFF5	The color of the Skel background
backgroundAnimationColor	array	'transparent', 'rgba(0,0,0, 0.03)', 'transparent'	The color of the Skel animation (this gives UI touch)