Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including react-native-splash-screen-mask with all npm packages installed. Try it out:

require("react-native/package.json"); // react-native is a peer dependency. var reactNativeSplashScreenMask = require("react-native-splash-screen-mask")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

react-native-splash-screen-mask v1.0.2

A splash screen for react-native, It hide when application loaded. It works on iOS, Android and Window.

react-native-splash-screen-mask

version downloads license.

A splash screen for react-native, It hide when application loaded. It works on iOS, Android and Window.

Content

Examples

Examples

react-native-splash-screen-mask

Installation

$ npm install react-native-splash-screen-mask --save

Usage

Use like so:

import React, { Component } from 'react';
import { StyleSheet } from 'react-native';
import SplashScreenMask from 'react-native-splash-screen-mask';
import { Actions } from 'react-native-router-flux';

import IMAGE from '../assets/react.png';

export default class SplashScreen extends Component {
  render() {
    return (
      <SplashScreenMask
        imageSource={IMAGE}
        navigationAction={() => Actions.homeScene()}
        backgroundStyle={styles.backgroundStyle}
        duration={3000}
      />
    );
  }
}

const styles = StyleSheet.create({
  backgroundStyle: {
    backgroundColor: '#fff',
  },
});

Props

propsTypeOptionalDefaultDescription
imageSourceanynoThe image (png, jpg, jpeg, gif) splash screen.
navigationActionanynoRedirect callback function (can be used react-native-router-flux or anything else).
backgroundStyleanyyes{ backgroundColor: '#fff' }The style of splash screen background.
durationnumberyes3000 (3 seconds)Duration for loading the splash screen.

Wrap Up

If you think any of the react-native-splash-screen-mask can be improved, please do open a PR with any updates and submit any issues. Also, I will continue to improve this, so you might want to watch/star this repository to revisit.

Contribution

We'd love to have your helping hand on contributions to react-native-splash-screen-mask by forking and sending a pull request.

Your contributions are heartily ♡ welcome, recognized and appreciated.

How to contribute:

  • Open pull request with improvements
  • Discuss ideas in issues
  • Spread the word
  • Reach out with any feedback

License

The MIT License License: MIT

RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free