How To Create animated Splash Screen in React Native

Table of Contents

React Native Animated Splash Screen

Splashscreen acts as a launch screen for your application. Let me show you how you can create animated splash screen in react native. There are other libraries available to create a splash screen in react native . I have chosen this library react-native-animated-splash-screen because of its simplicity and features that are easily customizable.

Features

  • Custom background color.
  • Custom background image.
  • Custom logo.
  • Custom logo size.
  • It works both: Expo and Pure React Native.
				
					yarn add react-native-animated-splash-screen 
				
			
or
				
					npm install --save react-native-animated-splash-screen
				
			
				
					import AnimatedSplash from "react-native-animated-splash-screen";
 
render() {
    return (
      <AnimatedSplash
        translucent={true}
        isLoaded={this.state.isLoaded}
        logoImage={require("./assets/logo.png")}
        backgroundColor={"#262626"}
        logoHeight={150}
        logoWidth={150}
      >
        <App />
      </AnimatedSplash>
    );
  }
				
			
splash screen

Leave a Reply

Your email address will not be published. Required fields are marked *