react-native-image-placeholder - npm Package Compare versions

Comparing version 1.0.8 to 1.0.9

index.js

 import React, { PropTypes } from 'react';
-import { Image, ActivityIndicator } from 'react-native';
+import { Image, ActivityIndicator, View } from 'react-native';
 
@@ -38,3 +38,3 @@ class ImageLoad extends React.Component {
         onError={this.onError.bind(this)}
-        style={[this.props.style, { alignItems: 'center' }]}
+        style={this.props.style}
         source={this.props.source}
@@ -44,18 +44,23 @@ resizeMode={this.props.resizeMode}
         {
-          this.state.isLoaded && !this.state.isError ? null :
-          <Image
-            style={this.props.placeholderStyle ? this.props.placeholderStyle : styles.imagePlaceholderStyles}
-            source={this.props.placeholderSource ? this.props.placeholderSource : require('./Images/empty-image.png')}
-          >
-            {
-              this.props.children  ? this.props.children :
-              this.props.isShowActivity ?
+          (this.state.isLoaded && !this.state.isError) ? this.props.children :
+          <View style={styles.viewImageStyles}>
+            <Image
+              style={this.props.placeholderStyle ? this.props.placeholderStyle : [styles.imagePlaceholderStyles, this.props.customImagePlaceholderDefaultStyle]}
+              source={this.props.placeholderSource ? this.props.placeholderSource : require('./Images/empty-image.png')}
+            >
               <ActivityIndicator
                 size={this.props.loadingStyle ? this.props.loadingStyle.size : 'small'}
                 color={this.props.loadingStyle ? this.props.loadingStyle.color : 'gray'}
-              /> :
-              null
-            }
-          </Image>
+              />
+            </Image>
+          </View>
         }
+        {
+          this.props.children &&
+          <View style={styles.viewChildrenStyles}>
+          {
+            this.props.children
+          }
+          </View>
+        }
       </Image>
@@ -67,7 +72,22 @@ );
 const styles = {
-  imagePlaceholderStyles: {
+  viewImageStyles: {
     flex: 1,
+    backgroundColor: '#e9eef1',
     justifyContent: 'center',
-    alignItems: 'center',
-    backgroundColor: 'gray'
+    alignItems: 'center'
+  },
+  imagePlaceholderStyles: {
+    width: 100,
+    height: 100,
+    resizeMode: 'contain',
+    justifyContent: 'center',
+    alignItems: 'center'
+  },
+  viewChildrenStyles: {
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0,
+    position: 'absolute',
+    backgroundColor: 'transparent'
   }
@@ -74,0 +94,0 @@ }

package.json

 {
   "name": "react-native-image-placeholder",
-  "version": "1.0.8",
+  "version": "1.0.9",
   "description": "react native image placeholder",
@@ -5,0 +5,0 @@ "main": "index.js",

README.md

@@ -12,2 +12,5 @@ # react-native-image-placeholder  [![npm version](https://badge.fury.io/js/react-native-image-placeholder.svg)](https://badge.fury.io/js/react-native-image-placeholder)
 
+## What's new
+Fixed render inside <ImageLoad /> component
+
 ## Installation
@@ -44,2 +47,3 @@
 placeholderStyle | | Style placeholder image
+customImagePlaceholderDefaultStyle | | Custom style image placeholder default
 
@@ -46,0 +50,0 @@ ## License

No alert changes

Improved metrics

Lines of code

85

30.77%

Number of lines in readme file

52

8.33%

Worsened metrics

Total package byte prevSize

609466

-4.67%

No dependency changes