app启动页react-native-splash-screen（android）

react-native启动时会装载js bundle到内存并渲染界面，这段时间界面是一个空View（白屏）。这个过程即为项目初始化过程中。瞬间的白屏会影响用户体验，因此利用react-native-splash-screen可以配置一个对用户体验相对友好的启动页。

步骤

1、下载：react-native-splash-screen

在项目根目录运行终端执行 yarn add react-native-splash-screen（推荐） 或者 npm install react-native-splash-screen --save

如报错请运行多次，下载成功如下

2、安装：react-native link react-native-splash-screen

运行终端执行以下命令进行自动安装

3、android配置

（1）、打开android\app\src\main\java\com目录下的MainActivity.java添加以下三项，如图

A、import android.os.Bundle;

B、import org.devio.rn.splashscreen.SplashScreen;

C、@Override

protected void onCreate(Bundle savedInstanceState) {

SplashScreen.show(this);

super.onCreate(savedInstanceState);

}

（2）、在 android/app/src/mian/res目录下创建layout文件夹，并在创建的layout文件夹中创建launch_screen.xml，添加相应配置

在项目根目录运行终端执行：

A、创建layout文件夹： mkdir android/app/src/main/res/layout

（3）、在 android/app/src/mian/res目录下创建drawable-xhdpi和drawable-xxhdpi文件夹，并添加名为launch_screen.png的图片（若要想适配的更全面可以像mipmap一样添加不同分辨率的图片）

在项目根目录运行终端执行：

A、创建drawable-xhdpi文件夹

B、创建drawable-xxhdpi文件夹

4、使用

在首页导入react-native-splash-screen，在componentDidMount中执行hide隐藏启动屏（不是必须，可按照需要在适当的时候隐藏）

5、运行项目看效果

6、关于报错

（1）、放上启动页的图片时。因为Androidstudio严格审查png图片，要是png没有达到Androidstudio的要求，或者格式错误，则会报如下错误

java.util.concurrent.ExecutionException: com.android.ide.common.process.ProcessException:

则在build.gradle文件下的android下添加

aaptOptions.cruncherEnabled = false    和    aaptOptions.useNewCruncher = false 这两句即可，表示忽略png严格检查

（2）、

报如上图的错误时，解决方法如下：