Maintaining correct aspect ratio for windowBackground on Android splash activity

Question

I am working on getting a splash activity implemented in my project. The splash activity currently loads perfectly, and there's no "white flash" before the image loads - which is good.

My only problem is maintaining the correct aspect ratio of the splash screen image.

Here's the theme I am using for SplashActivity

<style name="SplashTheme" parent="Theme.AppCompat.NoActionBar">
    <item name="android:windowBackground">@drawable/splash</item>
</style>

splash.xml

<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
        android:src="@drawable/pink_grid"
        android:gravity="fill_vertical|clip_horizontal"
/>

And here's a screenshot of the result I am getting:

The black / pink grid image that I am using as the background has uniform squares. As you can see from the image, it's not maintaining a proper aspect ratio (being squished horizontally).

Here's the grid image (1280x1920):

What I tried:

It seems the only way to control the aspect ratio of the splash windowBackground is by using gravity. I tried to fill the image vertically and crop horizontally. But this does not maintain aspect ratio.

How can I adjust the gravity of the splash image to maintain aspect ratio and fit the screen on any device?

Edit: Progress based on Raz's answer:

activity_splash.xml

<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android">
    <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:src="@drawable/pink_grid" android:scaleType="centerCrop"/>
</merge>

SplashActivity.kt

class SplashActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_splash)

//        val intent = Intent(this, MainActivity::class.java)
//        startActivity(intent)
//        finish()
    }
}

AndroidManifest.xml

<application>
    <!-- ... -->
    <activity
            android:name=".SplashActivity"
            android:theme="@style/SplashTheme">
        <intent-filter>
            <action android:name="android.intent.action.MAIN"/>
            <category android:name="android.intent.category.LAUNCHER"/>
        </intent-filter>
    </activity>
</application>

styles.xml

<style name="SplashTheme" parent="Theme.AppCompat.NoActionBar">
    <item name="android:windowBackground">@android:color/transparent</item>
</style>

The splash screen is just a black screen now. The pink / black grid is not showing up.

i am at the same situation as you were. did you solve it? if yes then please let me know. — Tara

Raz Raz · Accepted Answer · 2019-07-07T20:32:50

AFAIK, windowBackground will always fill the screen. What you need to do is:

Set the layout of the activity to:

<FrameLayout 
        android:width="match_parent" 
        android:height="match_parent">
    <ImageView  
android:width="match_parent"  
android:height="match_parent"  
android:ScaleType="CENTER_CROP"  android:src="your_image"/>
        </FrameLayout>

The imageView property scaletype will preserve the aspect ratio.

As optimizations:

Set windowBackground as transparent (for reducing overdraw)
Change the root FrameLayout to <merge> - like so:

<merge> <ImageView android:width="match_parent" android:height="match_parent" android:ScaleType="CENTER_CROP" android:src="your_image"/> </merge>

Maintaining correct aspect ratio for windowBackground on Android splash activity

3 Answers