Develop Reference

Android - How to use an ImageView in a SplashScreen

My company has a single activity Android Kotlin applicaiton.
We would like to display a splashscreen on startup.
After reading a bunch of turtorial I have found a way to do it.
But when I try to display an ImageView the splashscreen, it becomes a white background.
Here is my code:
AndroidManifest.xml
<application
...
android:theme="#style/Theme.SplashScreen">
...
</application
Theme.SplashScreen in res/values/themes/themes.xml
<resources xmlns:tools="http://schemas.android.com/tools">
...
<style name="Theme.SplashScreen" parent="Theme.AppCompat.NoActionBar">
<item name="android:windowBackground">#drawable/splash_background</item>
</style>
...
</resources>
res/drawable/splash_background.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item android:drawable="#color/blue" />
<item>
<!-- This works
<bitmap
android:gravity="center"
android:src="#mipmap/ic_launcher" />
-->
<!-- This doesn't work -->
<ImageView
android:layout_width="match_parent"
android:layout_height="250dp"
android:src="#drawable/ic_somePicture"
app:tint="#color/white" />
</item>
</layer-list>
Notice I have two cases here: The bitmap and the ImageView cases.
The bitmap case work if I uncomment it.
During startup this image is displayed in the splashscreen.
The ImageView case doesn't work.
This result is a completely white splashscreen.
The ImageView "should" work, because I use the same setup in some fragments.
The #drawable/ic_somePicture is a SVG-image that I have added in the AndroidStudio project.
I cannot show it here, as it's a property of my company.
Notice I have to specify the app:tint property to show the image on whatever background color I have in either the splash_background.xml or the fragment.
What could be the problem?
Any suggestion how to fix this?

windowBackground not picking night color in styles when dark theme enabled

i have implemented dark ui in my android app everything is working fine but i have a launcher activity which has windowBackground in styles like this
<style name="AppTheme.Launcher" parent="Theme.MaterialComponents.DayNight.NoActionBar">
<item name="android:windowBackground">#drawable/l_launch_screen</item>
</style>
and the l_launch_screen is this
<?xml version="1.0" encoding="utf-8"?>
<!-- The android:opacity=”opaque” line — this is critical in preventing a flash of black as your theme transitions. -->
<layer-list
xmlns:android="http://schemas.android.com/apk/res/android"
android:opacity="opaque">
<!-- The background color, preferably the same as your normal theme -->
<item android:drawable="#color/colorPrimaryDark"/>
<!-- Your product logo - 144dp color version of your app icon -->
<item>
<bitmap
android:src="#drawable/app_round_icon"
android:gravity="center"/>
</item>
</layer-list>
and in this colorPrimaryDark has two color one is night and other is simple
now the issue is that when the dark theme is activated by android by selecting Dark theme in android q notification panel android:windowBackground is picking night color but when Dark theme is disabled by android and dark theme is selected in my app by setting this in application class
AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_YES);
android:windowBackground is not picking the night color but all other activities is picking the night color perfectly I have seen the same behavior with WhatsApp app so is this a bug or i am doing something wrong I have also tried define different styles for the night and for drawable but happening the same issue

This is how to implement loading screen using Activities approach.
Add 2 new resource files:
for light theme splash_background.xml:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#color/white" />
<item>
<bitmap android:gravity="center"
android:src="#drawable/logo"/>
</item>
</layer-list>
for dark theme splash_background.xml (same name) place it in drawable-night folder (create if you dont have it ) and you have to add in colors.xml custom dark color (for example <color name="black_700">#191414</color>) :
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#color/your_dark_background_color" />
<item>
<bitmap android:gravity="center"
android:src="#drawable/logo"/>
</item>
</layer-list>
Finally In your themes.xml:
<style name="Theme.AppName.SplashTheme" parent="Theme.AppName">
<item name="android:windowBackground">#drawable/splash_background</item>
</style>
Good approach to create splashscreen as theme of existing style and show it when app started: to do that create new Activity
class SplashScreenActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
setTheme(R.style.Theme_AppName_SplashTheme)
super.onCreate(savedInstanceState)
startActivity(Intent(this,MainActivity::class.java))
overridePendingTransition(0, 0) //this one to remove animation
finish()
}
}
Apply this theme on your SplashScreenActivity in AndroidManifest.xml:
<activity
android:name=".SplashScreenActivity"
android:excludeFromRecents="true"
android:exported="true"
android:launchMode="singleInstance"
android:theme="#style/Theme.AppName.SplashTheme">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
<category android:name="android.intent.category.MULTIWINDOW_LAUNCHER" />
</intent-filter>
</activity>
In your MainActivity.kt you have to add Intent.FLAG_ACTIVITY_NO_ANIMATION to remove annoying swipe animation when switching activity:
companion object {
fun startFrom(context: Context) {
val intent = Intent(context, MainActivity::class.java)
intent.flags =
Intent.FLAG_ACTIVITY_NEW_TASK or Intent.FLAG_ACTIVITY_CLEAR_TOP or Intent.FLAG_ACTIVITY_NO_ANIMATION
context.startActivity(intent)
}
}

Centered image on windowBackground is different than on an inflated layout

I tried to implement a "slash screen" and I faced an issue where the image on splashscreen is not really centered, some times it jumps up and sometimes down and sometimes it's well placed.
First of all, the issue:
So here you can see my logo, the first one to show up is the one that is in Red, it's declared like this :
background_splash.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Background color -->
<item android:drawable="#color/colorPrimaryDark" />
<!-- Logo at the center of the screen -->
<item
android:width="300dp"
android:height="300dp"
android:gravity="center">
<bitmap android:src="#drawable/ic_launcher_sablier" />
</item>
</layer-list>
And added like this:
styles.xml
<style name="SplashTheme" parent="AppTheme">
<item name="android:windowBackground">#drawable/background_splash</item>
</style>
Then the view with the Blue one is shown, it's declared like this :
activity_splash.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"
android:id="#+id/linearLayoutSplash"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:animateLayoutChanges="true"
android:background="#color/colorPrimaryDark"
android:gravity="center"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatImageView
android:id="#+id/imageViewSplash"
android:layout_width="300dp"
android:layout_height="300dp"
app:srcCompat="#drawable/ic_launcher_sablier" />
<ProgressBar
android:id="#+id/progressSplash"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_marginTop="12dp"
android:indeterminateTint="#color/grey_light"
android:visibility="gone" />
</LinearLayout>
It's just like the windowBackground is taking into consideration something else (StatusBar height, etc.) and it's not really centered on the screen.
I've tried this:
<item name="android:windowDrawsSystemBarBackgrounds">false</item>
and/or
<item name="android:windowNoTitle">true</item>
and/or
<item name="android:windowContentOverlay">#drawable/background_splash</item>
And nothing is working.
At a moment I said to myself it's ok if it's not working under api 26 so I used that :
v26/style.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="SplashTheme" parent="AppTheme">
<item name="android:windowSplashscreenContent">#drawable/background_splash</item>
</style>
</resources>
And same issue.
So finally I was thinking to move the inflated view up/or down instead of trying to place correctly the window background, it's not a big problem if it's not exactly centered in the screen so I tried to remove Status bar height, and it was working on some devices but not on others, and etc...
It's working on Nexus 5 with the specific v26/style.xml I shared before, so that is exactly what I want :
And what happen on my Xiaomi MI 8 for example (it also happen on a Pixel 2XL, on some Huawei,...):
So if someone have a solution to center correctly the windowBackground OR to move the inflated view accordingly, I will be happy with both !
Thx to you to help me !
EDIT 13/08:
Here the AppTheme you asked for :
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>

So, after doing a lot of research, I managed to make it work for API 26 and above.
Let's recap, if you just want to make sure to display an image when launching the application to avoid "the white screen loading", just use:
styles.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
<style name="SplashTheme" parent="AppTheme">
<item name="android:windowBackground">#drawable/background_splash</item>
</style>
</resources>
And set it like this:
AndroidManifest.xml
<activity
android:name=".ui.splash.ActivitySplash"
android:theme="#style/SplashTheme">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
Now if you want to have a flow of flowing screens by displaying an animated progressbar for example, you can do it but only for API 26 and above like this:
v26/style.xml
<resources>
<style name="SplashTheme" parent="AppTheme">
<item name="android:windowSplashscreenContent">#drawable/background_splash</item>
<item name="android:windowOverscan">true</item>
</style>
</resources>
The solution is to use android:windowOverscan, I don't really know why, I tried to search for answers in doc, but only thing I found was :
windowOverscan
Flag indicating whether this window should extend into overscan region.
Corresponds to WindowManager.LayoutParams.FLAG_LAYOUT_IN_OVERSCAN.
May be a boolean value, such as "true" or "false".
To make it work in-out of API 26, maybe there are some calculations to be done with the help of this (I admit I have not had the time or the patience to spend more time in solve this problem):
https://developer.android.com/reference/androidx/core/view/WindowInsetsCompat
Enjoy.
(If someone have a better answer to this question, I can check his answer instead of mine ;) )

Drawable as background of splash theme doesn't keep ratio

In my application, I'm trying to set the splash theme with a drawable background. It works correctly if I use a small image, but when the image is bigger then the screen size, it doesn't work anymore.
The image is correctly scaled horizzontally, but the height isn't, as follows:
I tried every scaletype and gravity, what else can I do?
this is my Theme:
<style name="SplashTheme" parent="AppTheme">
<item name="android:windowBackground">#drawable/background_splash</item>
</style>
This is my background_splash.xml
<item android:drawable="#android:color/white" />
<item
android:left="50dp"
android:right="50dp"
>
<bitmap android:src="#drawable/logo_splash"
android:gravity="center|clip_horizontal"
android:scaleType="centerInside"
/>
</item>
and this is my manifest (relevant code):
<activity
android:name=".activities.SplashScreenActivity"
android:configChanges="orientation|screenSize"
android:theme="#style/SplashTheme">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
Any idea?

You can use a layer-list like this in your background_splash.xml:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#android:color/white"
android:gravity="fill" />
<item
android:drawable="#drawable/logo_splash"
android:gravity="center" />
</layer-list>
This will center your image on the screen and the left space will be filled by the white background color.
Maybe you have to add the image in different sizes like you can read here:
https://developer.android.com/training/multiscreen/screendensities#TaskProvideAltBmp
If you do that you can access the image with the same name. It will look like this your project structure:
If you want to remove the action and status bar in your splash screen, you can add the following line to your SplashTheme:
<item name="android:windowFullscreen">true</item>

Setting background image to an application which already has a theme

Hi i want to set background image to my application which already has a theme.
<application android:theme="#android:style/Theme.NoTitleBar" />
Now i have changed the code to this
<style name="BackgroundImage" parent="#android:style/Theme.NoTitleBar">
<item name="android:background">#drawable/background</item>
</style>
the manifest file looks like this
<application android:theme="#style/BackgroundImage" />
Now the background image is set but my previous theme i.e. Theme.NoTitleBar is not working.
Ideal behavior expected is both background image and Theme.NoTitleBar should be working. What should i do?

I have changed the style as follows by doing this i am overriding the Theme.NoTitlteBar
<style name="Background" parent="#android:style/Theme.NoTitleBar">
<item name="android:windowBackground">#android:color/black</item>
<item name="android:windowNoTitle">true</item>
</style>
Now manifest file looks like this.
<application android:theme="#style/Background"/>

you need to do it in the xml file, and not your manifest.
you just have to do somerhing like this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/yourimage" > //your drawable image here
hope i helped you