question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Android unique splash screen : how to make it fill screen?

See original GitHub issue

I have a unique splash screen, called splash.png and sized 1280x1280, 150dp

My question is simple : how can I make my splash screen, in portrait mode, be full height, not less, not more, and keep its aspect ratio so that the picture fills the screen. Like a background-size: cover in css. Or like an easy <Image resizeMode="cover" style={{ height: '100%' }} /> in React Native.

So I have :

android/app/src/main/res/values/styles.xml

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="android:textColor">#000000</item>
    </style>

    <!-- BootTheme should inherit from AppTheme -->
    <style name="BootTheme" parent="AppTheme">
        <!-- set the generated bootsplash.xml drawable as activity background -->
        <item name="android:windowBackground">@drawable/bootsplash</item>
        <item name="android:windowNoTitle">true</item>
    </style>

</resources>

android/app/src/main/res/drawable/bootsplash.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent">
    <item>
      <!-- your logo, centered horizontally and vertically -->
      <bitmap
        android:layout_height="fill_parent"
        android:src="@drawable/splash"
        android:scaleType="centerInside"
        android:gravity="center" />
    </item>
</layer-list>

And my splash.png in android/app/src/main/res/drawable/splash.png

I tried a lot of things, a lot of combinations of android:layout_height, android:scaleType and all, and I always end-up with a splash image’s height overflowing the screen height.

💻 My environment

  • react-native-bootsplash version: 2.2.4
  • react-native version: 0.62.2
  • Platform: ios / android / both: android
  • OS version: 10
  • Device: Emulator Armor_6_API_29
  • Simulator: yes
  • Android Studio version: 3.6.1
  • Android buildToolsVersion: ?

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:9 (6 by maintainers)

github_iconTop GitHub Comments

2reactions
jedashfordcommented, Jul 20, 2020

@arnaudambro you can change the android:gravity to ‘fill’ like this: `<?xml version="1.0" encoding="utf-8"?>

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" android:opacity="opaque"> <item android:drawable="@color/bootsplash_background" />
<item>
    <bitmap android:src="@drawable/launch_screen" android:gravity="fill" />
</item>

</layer-list>`

0reactions
billnbellcommented, Nov 8, 2021
<?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item> <color android:color="#FFFF"></color> </item> <item android:drawable="@color/splashscreen_bg" /> <item android:drawable="@mipmap/splash_icon" android:gravity="fill_vertical" /> </layer-list>
Read more comments on GitHub >

github_iconTop Results From Across the Web

Android unique splash screen : how to make it fill screen?
Upload your image (use 3:4 aspect ratio, e.g. 1080x1920, for the best results) and select -> splashes. It will generate nine-patch images for ......
Read more >
Implementing the Perfect Splash Screen in Android - Medium
Step 1. Create Background for Splash Screen in drawable/ splash_background .xml, the bitmap is the image we want to show.
Read more >
Splash screens - Android Developers
Splash screen animation requirements · Set a single window background color with no transparency. · Make sure the animated icon meets the following...
Read more >
Splash Screen Tutorial for Android - Kodeco
Open any app from the launcher on your Android device and you're likely to see a splash screen — a simple full-screen layout, ......
Read more >
A Comprehensive Guide to Android 12's Splash Screen API
By default all apps on Android 12 will show a splash screen with the app icon ... If you don't, the icon will...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found