HwangTaehyun / react-native-lottie-splash-screen

⚡ Lottie splash screen for your react native app!
MIT License
222 stars 62 forks source link

How to remove screen between splash and main screens? #47

Open glushkina1 opened 2 years ago

glushkina1 commented 2 years ago

Run react-native info in your project and share the content.

 "react": "18.1.0",
 "react-native": "0.70.1",

What react-native-splash-screen version are you using? "^1.0.1",

What platform does your issue occur on? (Android/iOS/Both) Android

Describe your issue as precisely as possible : When splash screen is over I have an intermediate screen(white screen) for 1-2 secs before showing my main screen (App.tsx below)

colors.xml:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="status_bar_color">#000000</color>
</resources>

styles.xml:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="SplashScreenTheme" parent="SplashScreen_SplashTheme">
        <item name="colorPrimaryDark">@color/status_bar_color</item>
        <item name="android:statusBarColor">@color/status_bar_color</item>
        <item name="android:navigationBarColor">@color/status_bar_color</item>
        <item name="android:windowIsTranslucent">false</item>
        <item name="android:windowExitAnimation">@android:anim/fade_out</item>
    </style>
</resources>

lauch_screen.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              xmlns:app="http://schemas.android.com/apk/res-auto"
              xmlns:tools="http://schemas.android.com/tools"
              tools:context=".MainActivity"
              android:orientation="vertical"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:background="@drawable/launch_screen"
>
    <com.airbnb.lottie.LottieAnimationView
            android:id="@+id/lottie"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:lottie_rawRes="@raw/loading"
            app:lottie_autoPlay="true"
            app:lottie_loop="false"
    />
</LinearLayout>

App.tsx:

const App = observer(({}) => {
  const store = useStore();

  const [isStoreLoaded, setIsStoreLoaded] = useState<boolean>(false);

  useEffect(() => {
    const rehydrate = async () => {
      await trunk.init();
      setIsStoreLoaded(true);
    };
    rehydrate().catch(() =>
      console.log('problems with localStorage or calculation next period'),
    );
  }, []);

  if (isStoreLoaded) {
    LottieSplashScreen.hide();
  }

  return (
    <NavigationContainer>
            ...
    </NavigationContainer>
  );
});
mehranali12 commented 1 year ago

I got this error. I don't know what the issue is in this. if you help me I am waiting.

_**A failure occurred while executing com.android.build.gradle.internal.res.ResourceCompilerRunnable

Resource compilation failed (Failed to compile resource file: D:\Apps\ReactNative\HisabKitab\android\app\src\main\res\layout\launchscreen.xml: . Cause: com.ctc.wstx.exc.WstxParsingException: Illegal processing instruction target ("xml"); xml (case insensitive) is reserved by the specs. at [row,col {unknown-source}]: [31,5]). Check logs for more details.**