react-native-splash-screen
1.安装： npm i react-native-splash-screen --save
2.自动link： react-native link react-native-splash-screen
3.在MainActivity.java文件中添加如下代码：
import android.os.Bundle;
import org.devio.rn.splashscreen.SplashScreen;
public class MainActivity extends ReactActivity {
/**
* 设置启动页
*/
@Override
protected void onCreate(Bundle savedInstanceState) {
SplashScreen.show(this); // 展示启动页设置代码
super.onCreate(savedInstanceState);
}
// ...other code
}
4.添加启动页图片及布局
在路径app/src/main/res/layout创建文件(如果不存在则进行手动创建)命名为 launch_screen.xml. 然后输入下面内容：
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/launch_screen">
</LinearLayout>
5.在res文件夹下面创建如下文件夹，添加对应分辨率图片，分别对应放入下面文件夹,图片命名和xml中一致，命名为launch_screen
drawable-ldpi
drawable-mdpi
drawable-hdpi
drawable-xhdpi
drawable-xxhdpi
drawable-xxxhdpi
6.在启动的过程中看到有白屏出现，我们将启动背景设置成透明背景，使用下面方式进行处理， 打开android/app/src/main/res/values/styles.xml文件，并且添加 true
到文件中，添加之后结果如下所示:
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<!--设置透明背景-->
<item name="android:windowIsTranslucent">true</item>
</style>
</resources>
7.在App.js（入口文件处）处隐藏掉启动页
import SplashScreen from 'react-native-splash-screen';
constructor(props) {
super(props);
// 在入口文件处隐藏掉启动页
SplashScreen.hide();
}
