如何设置react-native android的启animation面

如何设置反应原生android的闪屏,我找不到任何关于这个话题,我认为这是奇怪的。

谢谢

Solutions Collecting From Web of "如何设置react-native android的启animation面"

我尝试了以下三种方法。 第一个是我目前用于android splash屏幕的react-native项目。

  1. 使用其他编写的npm包。

    参考: https : //github.com/remobile/react-native-splashscreen

  2. 创build一个SplashScreen组件,然后redirect。

    参考: 如何创build某种Splash屏幕/启动屏幕,在App加载后消失? (React Native)

  3. 本地在java代码。

    参考: https : //www.bignerdranch.com/blog/splash-screens-the-right-way/

我在initialRoutecomponentDidMount()中有一个fetch请求。

使用上面列表中的第一种方式在显示启animation面的同时执行请求。

而第二种方式,需要等到SplashScreen组件卸载。

第三种方法是编写和维护更多的代码。

这个教程在这里很好:

https://medium.com/react-native-development/change-splash-screen-in-react-native-android-app-74e6622d699

  1. 您需要在res / drawable中创build启animation面。 我们称之为splash_screen.xml

     <?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@android:color/white"/> <item> <bitmap android:gravity="center" android:src="@mipmap/ic_launcher"/> </item> </layer-list> 
  2. 现在你需要更新res / values / styles.xml

     <resources> <!-- Base application theme. --> <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"> <!-- Customize your theme here. --> </style> <style name="SplashTheme" parent="AppTheme"> <item name="android:windowBackground">@drawable/splash_screen</item> </style> </resources> 
  3. 现在打开AndroidManifest.xml并用MainActivity中的SplashThemereplaceAppTheme

     <activity android:name=".MainActivity" android:label="@string/app_name" android:theme="@style/SplashTheme" android:configChanges="keyboard|keyboardHidden|orientation|screenSize"> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> 

    我们使用SplashTheme而不是更新AppTheme,只是为了启动活动而添加这个背景,而不改变其他东西。

  4. 不要忘记为你的根视图设置背景。 这个需求,因为启animation面总是在你的JS视图。 所以如果不设置背景,它将是可见的。

你尝试使用这个吗? 我前几天遇到这个。 在iOS上正常工作,但我还没有在Android上testing它。 你应该有节点> = 6和imageMagic安装。 (对于mac: brew install imagemagic

 npm install -g yo generator-rn-toolbox yo rn-toolbox:assets --splash IMGAE --android 

这对我工作如何添加一个启animation面到React本机应用程序(iOS和Android)

这非常简单