I have a unique splash screen, called splash.png and sized 1280x1280, 150dpi I use react-native-bootsplash
in my React Native project, but I don't think it really matters.
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= />
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.
[EDIT] Here is the splash original image, with the size reduced enough to have a small size for stackoverflow
and here is what it give on screen...
from Android unique splash screen : how to make it fill screen?
No comments:
Post a Comment