项目作者: TuNguyenThanh

项目描述 :
React native Image Placeholder
高级语言: JavaScript
项目地址: git://github.com/TuNguyenThanh/react-native-image-placeholder.git


react-native-image-placeholder npm version

NPM

  • Support Android and iOS.
  • The image component that supports shows placeholderSource when load image network.
  • Show placeholderSource if the main source can’t be loaded or error.
  • Support custom ActivityIndicator loading.

Sample

Require

React-native >= 0.46.x

What’s new

Fixed render inside component

Installation

  1. npm i --save react-native-image-placeholder

Please file an issue if you have any trouble!

Usage

  1. import ImageLoad from 'react-native-image-placeholder';
  2. ....
  3. <ImageLoad
  4. style={{ width: 320, height: 250 }}
  5. loadingStyle={{ size: 'large', color: 'blue' }}
  6. source={{ uri: 'https://4.bp.blogspot.com/-lYq2CzKT12k/VVR_atacIWI/AAAAAAABiwk/ZDXJa9dhUh8/s0/Convict_Lake_Autumn_View_uhd.jpg' }}
  7. ></ImageLoad>

Options

Supports all Image properties.

Option Default Info
placeholderSource require(‘./Images/empty-image.png’) Show placeholderSource if the source can’t be loaded or error.
loadingStyle size: ‘small’; color: ‘gray’ Style ActivityIndicator
isShowActivity true Show ActivityIndicator loading
placeholderStyle Style placeholder image
customImagePlaceholderDefaultStyle Custom style image placeholder default
borderRadius Border radius

License

ISC