The Android launch screen does not display full screen

[orzhtml]

Description

The Android launch screen does not display full screen

Steps to reproduce

/layout/launch_screen.xml
<?xml version="1.0" encoding="utf-8"?> <FrameLayout 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"> </FrameLayout>

/values/styles.xml
<resources> <style name="AppTheme" parent="Theme.AppCompat.NoActionBar"> <item name="android:textColor">#000000</item> <item name="android:windowExitAnimation">@android:anim/fade_out</item> <item name="android:windowLightStatusBar">true</item> <item name="android:windowFullscreen">true</item> <item name="android:windowNoTitle">true</item> <item name="android:windowDrawsSystemBarBackgrounds">false</item> <item name="android:statusBarColor">@android:color/transparent</item> <item name="android:navigationBarColor">@android:color/black</item> <item name="android:windowTranslucentStatus">true</item> <item name="android:windowIsTranslucent">false</item> <item name="android:windowDisablePreview">true</item> <item name="android:windowBackground">@drawable/launch_screen</item> </style> </resources>

Observe changes in the status bar

460_1742203064.mp4

Snack or a link to a repository

1

Version

^0.0.12

React Native version

0.77.1

Platforms

Android

Architecture

None

Build type

None

Device

None

Device model

24031PN0DC

[orzhtml]

what I use is: android:background="@drawable/launch_screen"

[wulaizi]

<style  name="SplashScreenTheme" parent="SplashScreen_SplashTheme">
    <item name="colorPrimaryDark">@color/primary_dark</item>
    <item name="android:windowBackground">@color/primary_dark</item>
    <item name="android:windowIsTranslucent">false</item>
</style>

[orzhtml]

In the video, the startup screen is displayed twice, blinking

[wulaizi]

On Android, there are two launch screens. What you see in the video is not a flicker but the default launch screen appearing first, followed by your custom launch screen. Since your header is not immersive, it creates the illusion of a flicker. Both launch screens use the same image, but one has a status bar while the other does not.

[orzhtml]

<resources>
    <style name="SplashViewTheme" parent="Theme.AppCompat.NoActionBar">
        <item name="android:textColor">#000000</item>
        <item name="android:statusBarColor">@android:color/transparent</item>
        <item name="android:navigationBarColor">@android:color/white</item>
        <item name="android:windowTranslucentStatus">true</item>
        <item name="android:windowIsTranslucent">false</item>
        <item name="android:windowExitAnimation">@android:anim/fade_out</item>
        <item name="android:windowLightStatusBar">true</item>
    </style>
</resources>

[jagnesh]

<resources>
    <style name="SplashViewTheme" parent="Theme.AppCompat.NoActionBar">
        <item name="android:textColor">#000000</item>
        <item name="android:statusBarColor">@android:color/transparent</item>
        <item name="android:navigationBarColor">@android:color/white</item>
        <item name="android:windowTranslucentStatus">true</item>
        <item name="android:windowIsTranslucent">false</item>
        <item name="android:windowExitAnimation">@android:anim/fade_out</item>
        <item name="android:windowLightStatusBar">true</item>
    </style>
</resources>

@orzhtml @wulaizi Try out the new version 0.0.13 without making any changes in styles. just do the below for status bar colors

<style name="SplashViewTheme" parent="Theme.AppCompat.NoActionBar">
    <item name="android:windowLightStatusBar">true</item>
</style>

[wulaizi]

<resources>
    <style name="SplashViewTheme" parent="Theme.AppCompat.NoActionBar">
        <item name="android:textColor">#000000</item>
        <item name="android:statusBarColor">@android:color/transparent</item>
        <item name="android:navigationBarColor">@android:color/white</item>
        <item name="android:windowTranslucentStatus">true</item>
        <item name="android:windowIsTranslucent">false</item>
        <item name="android:windowExitAnimation">@android:anim/fade_out</item>
        <item name="android:windowLightStatusBar">true</item>
    </style>
</resources>

@orzhtml @wulaizi 尝试新版本 0.0.13，无需对样式进行任何更改。只需对状态栏颜色进行以下操作即可

<style name="SplashViewTheme" parent="Theme.AppCompat.NoActionBar">
    <item name="android:windowLightStatusBar">true</item>
</style>

Thank you very much! I’m now using version 0.0.13. I made some slight modifications based on your approach—I set the theme of MainApplication to the splash screen theme and assigned a windowBackground to it. This way, both startup screens use the same image, making it visually look like there’s only one startup screen.

[wulaizi]

<resources>
    <style name="SplashViewTheme" parent="Theme.AppCompat.NoActionBar">
        <item name="android:textColor">#000000</item>
        <item name="android:statusBarColor">@android:color/transparent</item>
        <item name="android:navigationBarColor">@android:color/white</item>
        <item name="android:windowTranslucentStatus">true</item>
        <item name="android:windowIsTranslucent">false</item>
        <item name="android:windowExitAnimation">@android:anim/fade_out</item>
        <item name="android:windowLightStatusBar">true</item>
    </style>
</resources>

@orzhtml @wulaizi 尝试新版本 0.0.13，无需对样式进行任何更改。只需对状态栏颜色进行以下操作即可

<style name="SplashViewTheme" parent="Theme.AppCompat.NoActionBar">
    <item name="android:windowLightStatusBar">true</item>
</style>

<resources>
    <style name="SplashViewTheme" parent="Theme.AppCompat.NoActionBar">
        <item name="android:navigationBarColor">#3D3E74</item>
        <item name="android:windowExitAnimation">@android:anim/fade_out</item>
        <item name="android:windowIsTranslucent">false</item>
        <item name="android:windowBackground">@drawable/splash_logo</item>
        <item name="colorPrimaryDark">#3D3E74</item>
    </style>
</resources>

Screen_recording_20250318_100238.webm