react-native-img-placeholder-component v1.0.2

react-native-img-placeholder-component

A React native image component with placeholder

Feel free to add an issue if you have any trouble!

Installation

using npm

npm i --save react-native-img-placeholder-component

using yarn

yarn add react-native-img-placeholder-component

Usage

Simple example

import ImageWithPlaceholder from 'react-native-img-placeholder-component';
....
<ImageWithPlaceholder
    useNativeDriver
    style={{ width: 100, height: 100, borderRadius: 50  }}
    placeholder={require('../images/placeholder.png')}
    source={{ uri: 'https://randomuser.me/api/portraits/men/1.jpg' }}
    fadeDuration={800}
    resizeMode='cover'
/>

Example with child

import ImageWithPlaceholder from 'react-native-img-placeholder-component';
....
<ImageWithPlaceholder
    useNativeDriver
    style={{ width: 100, height: 100, borderRadius: 50  }}
    placeholder={require('../images/placeholder.png')}
    source={{ uri: 'https://randomuser.me/api/portraits/women/1.jpg' }}
    fadeDuration={800}
    resizeMode='cover'
>
    <View style={{ justifyContent: 'center', alignItems: 'center' }}>
        <Text>Hello world</Text>
    </View>
</ImageWithPlaceholder>

Options

License

MIT