diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 0000000..e04219e
Binary files /dev/null and b/.DS_Store differ
diff --git a/README.md b/README.md
index 3020bf0..309dcc7 100644
--- a/README.md
+++ b/README.md
@@ -26,9 +26,11 @@ import ProgressiveImage from 'react-native-progressive-image'
const TheProgressiveImage = () =>
```
@@ -36,6 +38,7 @@ const TheProgressiveImage = () =>
| Prop | Description | Default |
|---|---|---|
+| **`placeHolderSource`** | PlaceHolder source (e.g. require('./image.jpg')). | None |
| **`imageSource`** | Image source (e.g. { uri: 'https://facebook.github.io/react/img/logo_og.png' }). | None |
| **`thumbnailSource`** | Should be a low resolution version of the image used in `imageSource`. | None |
| **`thumbnailBlurRadius`** | Blur radius for the low resolution thumbnail (iOS only). | `5` |
@@ -44,6 +47,7 @@ const TheProgressiveImage = () =>
| **`thumbnailFadeDuration`** | Fade-in duration for the thumbnail in ms. | `250` |
| **`onLoadThumbnail`** | Callback function that gets called when the thumbnail is loaded. | `noop` |
| **`onLoadImage`** | Callback function that gets called when the main image is loaded. | `noop` |
+| **`resizeMode`** | Image resizeMode (e.g. resizeMode="cover". | None |
## Credits
diff --git a/example/images/placeholder@2x.png b/example/images/placeholder@2x.png
new file mode 100755
index 0000000..308881f
Binary files /dev/null and b/example/images/placeholder@2x.png differ
diff --git a/example/images/placeholder@3x.png b/example/images/placeholder@3x.png
new file mode 100755
index 0000000..62353dc
Binary files /dev/null and b/example/images/placeholder@3x.png differ
diff --git a/example/index.js b/example/index.js
index bc5e7e5..013ed74 100644
--- a/example/index.js
+++ b/example/index.js
@@ -9,9 +9,11 @@ import ProgressiveImage from 'react-native-progressive-image'
const TheProgressiveImage = () =>
export default () =>
diff --git a/index.js b/index.js
index dd1b6e8..a6da013 100644
--- a/index.js
+++ b/index.js
@@ -30,19 +30,21 @@ export default class ProgressiveImage extends Component {
return (
+ {this.props.thumbnailSource &&
+ this.onLoadThumbnail()}
+ blurRadius={this.props.thumbnailBlurRadius}
+ />
+ }
this.onLoadThumbnail()}
- blurRadius={this.props.thumbnailBlurRadius}
- />
- this.onLoadImage()}
@@ -69,9 +71,10 @@ ProgressiveImage.propTypes = {
imageFadeDuration: PropTypes.number.isRequired,
onLoadThumbnail: PropTypes.func.isRequired,
onLoadImage: PropTypes.func.isRequired,
- thumbnailSource: PropTypes.object.isRequired,
+ thumbnailSource: PropTypes.object,
thumbnailFadeDuration: PropTypes.number.isRequired,
thumbnailBlurRadius: PropTypes.number,
+ resizeMode: PropTypes.string.isRequired
}
ProgressiveImage.defaultProps = {
@@ -80,4 +83,5 @@ ProgressiveImage.defaultProps = {
thumbnailBlurRadius: 5,
onLoadThumbnail: Function.prototype,
onLoadImage: Function.prototype,
+ resizeMode: 'cover'
}