react-native 配置启动图支持ios和android

当前环境

OS: macOS High Sierra 10.13.5

Node: 8.11.3

Yarn: 1.7.0

npm: 5.6.0

Watchman: 4.9.0

Xcode: Xcode 9.4.1

react: 16.3.1 =>16.3.1

react-native: 0.55.4 =>0.55.4

react-native-splash-screen: 3.1.0 =>3.1.0

1：用Xcode打开项目, 找到Libraries目录，右键选择Add Files to [your project's name]

2：在{project}/node_modules/react-native-splash-screen/ios找到SplashScreen.xcodeproj文件，并添加

3：在XCode中，选择你的项目， 选择bilid Phases并将SplashScreen.xcodeproj/Products/libSplashScreen.a文件添加到Link Binary With Libraries中,拖过去即可

4：添加搜索路径：在项目 → Build Settings → Search Paths → Header Search Paths处添加一项为$(SRCROOT)/../node_modules/react-native-splash-screen/ios

1：在项目目录{prject}/android/下找到settings.gradle文件添加一下内容

2：在项目目录{prject}/android/app/下找到build.gradle文件添加compile project(':react-native-splash-screen')

3：找到项目目录{project}/android/app/src/main/java/com/app/下MainApplication.java文件，引入import org.devio.rn.splashscreen.SplashScreenReactPackage并添加new SplashScreenReactPackage()

1:找到项目目录{project}/ios/{project}/下AppDelegate.m文件，引入#import "SplashScreen.h"添加内容如下

2:在XCode中, 点击App/Images.xcassrts通过LaunchImage添加启动图片

3:在XCode中，选择你的项目， 选择General找到App Icons and Launch Images下的Launch Images Sourc选择你设置好的LaunchImage

4:如出现错误# unknown receiver 'SplashScreen'did you mean 'RNSplashScreen', 则改动源码以及AppDelegate.m文件如下：

        4.1.源码改动: 找到{project}/node_modules/react-native-splash-screen/ios文件夹下的RNSplashScreen.m文件，将其[SplashScreen show]修改为[RNSplashScreen show],如下图

  4.2:AppDelegate.m文件改动: 找到项目目录{project}/ios/{project}/下AppDelegate.m文件，将所有SplashScreen改为RNSplashScreen即可，如下图

4.3:重启尝试是否有其他问题，修改源码地址可查看我的 github 项目地址，更多问题请查看官方 issues

1:在项目目录{prject}/android/app/src/main/res/下创建layout文件夹

在layout文件夹下创建launch_screen.xml添加一下内容

2:将你的启动图改名为launch_screen.png并添加到{prject}/android/app/src/main/res/文件夹下相应的drawable文件夹中（根据需求配置相应大小的文件夹）

1.drawable-ldpi

2.drawable-mdpi

3.drawable-hdpi

4.drawable-xhdpi

5.drawable-xxhdpi

6.drawable-xxxhdpi

3：在{prject}/android/app/src/main/res/values/文件夹下修改名为添加一个名为primary_dark的属性并设置其颜，添加内容如下

4：如果您希望启动屏幕透明，打开{prject}/android/app/src/main/res/values/styles.xml并添加<item name="android:windowIsTranslucent">trueitem>到文件中

首先引入进行模块import SplashScreen from 'react-native-splash-screen'

使用SplashScreen.hide()方法将其关闭

我觉得这主要是你测试手机的问题 还是你是用模拟器做的测试？ 最好用手机测试 还有 这种问题解决只能是你不要把很多东西都写到oncreate里面 也不要布局的太复杂 android应用需要适配那么多的机型 而且大多都是低配机 如果你的oncreate方法处理时间过长的话 肯定是会有这种现象的

你是想问让应用第一次启动时显示图片，在以后启动时都不显示这图片吧？如果是这样，你可以弄一个文件保存一个状态，推荐用SharedPreferences，第一次启动时，因为没SharedPreferences文件，所以为初始化值，比如true要显示，然后在将这个值赋为false，保存后，下次启动是读取SharedPreferences文件，找到值就为false。你在后面写判断要不要显示图片就好了

---