react-native-animated-splash-screen - npm Package Compare versions

Comparing version 1.0.5 to 1.0.6

package.json

 {
   "name": "react-native-animated-splash-screen",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "private": false,
@@ -5,0 +5,0 @@ "description": "Animated splash screen component for React Native project.",

README.md

@@ -0,27 +1,39 @@
+<h1 align="center">
+  React Native Animated Splash Screen
+</h1>
+
+<div align="center">
+
+Animated splash screen for Android and iOS. It is based on [Implementing Twitter’s App Loading Animation in React Native](https://facebook.github.io/react-native/blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native) topic from RN. This use an Image instead of MaskedView to work on both platforms.
+
 [![license](https://img.shields.io/github/license/mashape/apistatus.svg)]()
 [![Version](https://img.shields.io/npm/v/react-native-animated-splash-screen.svg)](https://www.npmjs.com/package/react-native-animated-splash-screen)
-![GitHub All Releases](https://img.shields.io/github/downloads/fabio-alss-freitas/react-native-animated-splash-screen/total)
 [![npm](https://img.shields.io/npm/dt/react-native-animated-splash-screen.svg)](https://www.npmjs.com/package/react-native-animated-splash-screen)
 ![GitHub issues](https://img.shields.io/github/issues-raw/fabio-alss-freitas/react-native-animated-splash-screen)
 
-# React Native Animated Splash Screen
 ![GitHub followers](https://img.shields.io/github/followers/fabio-alss-freitas?style=social)
 ![GitHub stars](https://img.shields.io/github/stars/fabio-alss-freitas/react-native-animated-splash-screen?style=social)
 
-Animated splash screen for Android and iOS. It is based on [Implementing Twitter’s App Loading Animation in React Native](https://facebook.github.io/react-native/blog/2018/01/18/implementing-twitters-app-loading-animation-in-react-native) topic from RN. To work on Android, it use an Image instead of MaskedView.
+</div>
 
-## Examples
-![React Native Animated Splash Screen Android 1](https://i.postimg.cc/wMqmK0Wz/ezgif-3-d649b8902f22.gif)
-![React Native Animated Splash Screen Android 2](https://i.postimg.cc/5yTkKY3w/ezgif-3-2b23776764cf.gif)
+<p align="center" >
+  <kbd>
+    <img src="https://i.postimg.cc/wMqmK0Wz/ezgif-3-d649b8902f22.gif" title="Scroll Demo" float="left">
+  </kbd>
+  <kbd>
+    <img src="https://i.postimg.cc/5yTkKY3w/ezgif-3-2b23776764cf.gif" title="Priority Demo" float="left">
+  </kbd>
+  <br>
+  <em>SplashAnimated example app.</em>
+</p>
 
 ## Features
-- Custom background color
-- Custom logo
-- Custom logo size
 
+-   [x] Custom background color.
+-   [x] Custom logo.
+-   [x]  Custom logo size.
+
 ## Installation
 `yarn add react-native-animated-splash-screen`
-
 or
-
 `npm install --save react-native-animated-splash-screen`
@@ -59,4 +71,4 @@
 
+
 ## Example with React Navigation
-#### 1) Create a navigator (Stack or Switch) normally:
 ```javascript
@@ -82,11 +94,5 @@ const AppNavigator = createStackNavigator(
 );
-```
 
-#### 2) Create an app container:
-```javascript
 const Container = createAppContainer(AppNavigator);
-```
 
-#### 3) Pass the container as a children of AnimatedSplash:
-```javascript
 class App extends React.Component {
@@ -121,5 +127,20 @@ state = {
 ## Example with React Navigation (setting isLoaded inside a screen of navigator)
-##### Make sure you have done the [previous step](https://github.com/fabio-alss-freitas/react-native-animated-splash-screen/new/master?readme=1#example-with-react-navigation).
-#### 1) Pass the IsLoaded function as screenProps of Container:
+#### Navigator
 ```javascript
+const AppNavigator = createSwitchNavigator(
+  {
+    home: {
+      screen: props => (
+        <HomeScreen {...props} setAppLoaded={props.screenProps.setAppLoaded} />
+      )
+    },
+    dashboard: { screen: DashboardScreen }
+  },
+  {
+    initialRouteName: "home"
+  }
+);
+
+const Container = createAppContainer(AppNavigator);
+
 class App extends React.Component {
@@ -152,28 +173,25 @@ state = {
 
-#### 2) Update your navigator to handle screenProps on the chosen screen:
+
+#### HomeScreen
 ```javascript
-const AppNavigator = createSwitchNavigator(
-  {
-    home: {
-      screen: props => (
-        <HomeScreen {...props} setAppLoaded={props.screenProps.setAppLoaded} />
-      )
-    },
-    dashboard: { screen: DashboardScreen }
-  },
-  {
-    initialRouteName: "home"
+class HomeScreen extends React.Component {
+
+...
+
+  async componentDidMount() {
+    await loadAsync();
+    this.props.setAppLoaded();
   }
-);
-```
+  
+...
 
-#### 2) Call the function on the chosen screen:
-```javascript
-this.props.setAppLoaded();
+}
+
+export default HomeScreen
 ```
 
 ## Author
-Fabio Freitas
+[Fabio Freitas](https://github.com/fabio-alss-freitas)
 
 ## License
 MIT

No alert changes

Improved metrics

Number of lines in readme file

194

increased by10.23%

Worsened metrics

Total package byte prevSize

65177

decreased by-0.33%

No dependency changes