Develop Reference

best implementation of splash screen Android

Looking online I've found more than one way to implement a splash screen on Android apps. Someone create a new "splashActivity" with a "splash.xml" layout and a "splash_theme" (often fullscreen), some others use a "splashActivity" with no "splash.xml" layout, but just a theme with a "splashscreenDrawable.xml" as background. I'm using the last one because it seems more fast compared to the first case (maybe the theme+drawable is not heavy as the layout?), but which is better? In which cases should I use the first or the second one?
The app uses android oreo 8.0 and I'm using kotlin
This is the code (just in case the question is not well expressed sry)
MainActivity.kt (do nothing)
package com.example.mobileprogrammingproject
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
}
}
activity_main.xml (just a test layout with a tv and a btn)
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/titleTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/app_name"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintHorizontal_bias="0"
android:layout_marginStart="10dp"
android:textSize="26sp">
</TextView>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="press me"
app:layout_constraintTop_toBottomOf="#+id/titleTextView"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent">
</Button>
</androidx.constraintlayout.widget.ConstraintLayout>
SplashScreen.kt (the launcher activity that calls the MainActivity.kt)
package com.example.mobileprogrammingproject
import android.content.Intent
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.os.Handler
class SplashScreen : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
startActivity(Intent(applicationContext, MainActivity::class.java))
finish()
}
}
AndroidManifest.xml (i've changed the laucher activity from MainActivity.kt to SplashScreen.kt)
<?xml version="1.0" encoding="utf-8"?>
<manifest
xmlns:android="http://schemas.android.com/apk/res/android"
package="com.example.mobileprogrammingproject">
<application
android:allowBackup="true"
android:icon="#drawable/icon"
android:label="#string/app_name"
android:roundIcon="#drawable/icon"
android:supportsRtl="true"
android:theme="#style/Theme.MobileProgrammingProject">
<activity
android:name=".SplashScreen" android:theme="#style/SplashScreen">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity android:name=".MainActivity">
</activity>
</application>
and the splash theme (using a drawable)
<style
name="SplashScreen" parent="Theme.MaterialComponents.DayNight.NoActionBar">
<item name="android:windowBackground">#drawable/splash_screen_drawable</item>
<item name="windowNoTitle">true</item>
<item name="windowActionBar">false</item>
<item name="android:windowFullscreen">true</item>
<item name="android:windowContentOverlay">#null</item>
</style>
this is the splash_screen_drawable:
<?xml version="1.0" encoding="utf-8"?>
<layer-list
xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="#+id/splash_background_color"
android:drawable="#android:color/black" />
<item>
<bitmap
android:src="#drawable/dicce_logo"
android:gravity="center"/>
</item>
</layer-list>

The use of the two modes is completely left to the developer as he is the only one who knows what the app must do before starting and above all he decides the flow to follow.
Personally I can tell you that the spash screen created by xml, style etc. is the one suggested for everything because you have the right waiting time for the start (about a second) and you have the opportunity to have a unique experience for the user who interface with yours instead of with the most famous and used apps.
Someone implements the class with xml layout etc in case they want to manage the splash duration based on services and actions that they need to check or validate before bringing the user into the app.

Any alternate way of setting splash screen?

I have a logo image asset which I am using as splash screen.I am trying to achieve result like instagram , snapchat which shows their logo in splash screen
I have a made a layout with black background and a imageview with my image asset
Logo
AndroidManifest
<application
android:name=".BaseApplication"
android:allowBackup="true"
android:configChanges="orientation|keyboardHidden|screenSize"
android:icon="#mipmap/ic_logo_black_no_title"
android:label="#string/app_name"
android:roundIcon="#mipmap/ic_logo_black_no_title_round"
android:supportsRtl="true"
android:theme="#style/AppTheme">
<meta-data
android:name="com.google.mlkit.vision.DEPENDENCIES"
android:value="ocr" />
<activity android:name=".SplashActivity"
android:screenOrientation="portrait">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity
android:name=".MainActivity"
android:screenOrientation="portrait">
</activity>
<provider
android:name="androidx.core.content.FileProvider"
android:authorities="com.pratiksahu.android.fileprovider"
android:exported="false"
android:grantUriPermissions="true">
<meta-data
android:name="android.support.FILE_PROVIDER_PATHS"
android:resource="#xml/file_paths" />
</provider>
</application>
welcome_splash_screen.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:tools="http://schemas.android.com/tools"
android:background="#000000"
tools:context=".SplashActivity">
<ImageView
android:id="#+id/imageView"
android:layout_width="70sp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/logo_512_512" />
</androidx.constraintlayout.widget.ConstraintLayout>
SplashActivity.kt
class SplashActivity : AppCompatActivity(){
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.welcome_splash_screen)
val handler = Handler()
handler.postDelayed({
val intent = Intent(this, MainActivity::class.java)
startActivity(intent)
finish()
}, 3000)
}
}
The 3000ms delay is for starting other activity
This is working fine but when I start app , it takes few seconds to load the my splash screen layout.
When app starts
After few seconds
Is there any way I can load the layout faster or any alternative way to show splash screen?
UPDATE 1 -
After trying varun's answer
Logo size issue
UPDATE 2 -
I was using xxxhdpi but now I am using mdpi , the image is not getting out of screen but it is still big .
mdpi result Can I change the resolution according to device?
UPDATE 3 SOLVED -
splash_screen.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#android:color/black" />
</shape>
</item>
<item
android:width="80dp" //mentioned width
android:height="80dp" //mentioned height
android:drawable="#drawable/logo_mdpi"
android:gravity="center" />
</layer-list>
Image can be resized by mentioning height width in drawable item

What you are doing is not correct. The purpose of the Splash screen is to fill in the time which is currently taken by the system to load your app not to make the user wait for one second before the app loads. I always set a splash screen by this method and it works perfectly and does not make users wait.
splash_screen.xml (put this inside the res>drawable folder)
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#android:color/white" />
</shape>
</item>
<item
android:drawable="#drawable/ic_logo_full"
android:gravity="center" />
</layer-list>
In your styles.xml add these line.
<style name="SplashTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
<item name="android:windowBackground">#drawable/splash_screen</item>
</style>
In your manifest add these
<application
...
android:theme="#style/SplashTheme"/>
In your MainActivity
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setTheme(R.style.AppTheme)
setContentView(R.layout.activity_view)
...
}
Edit 1:
To fix the size issue you can try this drawable. Set whatever width and height you need.
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<size android:height="20dp" android:width="20dp"/>
<solid android:color="#android:color/white" />
</shape>
</item>
<item
android:drawable="#drawable/ic_logo_full"
android:gravity="center" />
</layer-list>

Splash screen is sometimes distorted and blurred

I have a splash screen activity with the following theme:
<style name="AppTheme.Launcher" parent="Theme.AppCompat.NoActionBar">
<item name="android:background">#drawable/splash_theme</item>
</style>
Here is a part of my manifest:
<activity
android:name=".activities.SplashActivity"
android:theme="#style/AppTheme.Launcher">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
<category android:name="android.intent.category.DEFAULT" />
</intent-filter>
</activity>
And here is my drawable:
<?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/colorPrimaryDarkBackground" />
<item>
<bitmap
android:gravity="center"
android:src="#drawable/shelpwelt_theme" />
</item>
</layer-list>
At some builds all works perfectly but sometimes the splash screen is completely distorted and blurred but just at the first 2-3 seconds. Then when my splash screen activity reaches onCreate the theme looks perfectly fine.
Here is the problem:

You are using a gif file for this case. And after the given time you said, 2-3 sec it wraps the screen size, so the image gets bigger. That's why it get's blurred on the screen.

Add bottom,left,right,top size to your item.
Change your drawble file to 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/colorPrimaryDarkBackground" />
<item
android:bottom="24dp"
android:left="24dp"
android:right="24dp"
android:top="24dp"
>
<bitmap
android:gravity="center"
android:src="#drawable/shelpwelt_theme" />
</item>
</layer-list>

It might be a scaling issue, try to change splash's layout, instead of designing the entire image and set it as a background, design your layout to have two images one for the gray rectangle and the other for the video icon

SplashScreen approach defined in xml (without activity) does not appear

I have defined splash screen like many other without external activity, but it doesn't works for me, I don't understand why.
Is there any limitations for images? Also tried for many other images
This is my splash.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"
android:opacity="opaque">
<item>
<bitmap
android:gravity="center"
android:src="#drawable/splash_logo" />
</item>
</layer-list>
Here preview for splash.xml file in android studio looks like perfectly.
Than I have created style like that
<style name="AppTheme.Launcher">
<item name="android:windowBackground">#drawable/splash</item>
</style>
and assigned it to activity theme inside manifest
<activity
android:theme="#style/AppTheme.Launcher"
android:name=".MainActivity"
android:screenOrientation="portrait">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
this is my activity's
override fun onCreate(savedInstanceState: Bundle?) {
setTheme(R.style.AppTheme)
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
}
when activity is loaded blank white screen is shown instead of image, maybe for a one second. I searched this approach and seems that it is the same what others were done. Don't understand what's wrong
EDIT:
I have tested it for another device OS 5.0 and it works, but for 6.0 doesn't

EDIT
Remove this from your activity
setTheme(R.style.AppTheme)
Try this
Style.xml
<style name="SplashTheme" parent="Theme.AppCompat.NoActionBar">
<item name="android:windowBackground">#drawable/splash_background</item>
</style>
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/colorPrimary" />
<item>
<bitmap
android:gravity="center"
android:src="#mipmap/ic_launcher" />
</item>
</layer-list>
SplashActivity
public class SplashActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_splash);
startActivity(new Intent(SplashActivity.this, MainActivity.class));
// close splash activity
finish();
}
}
Manifest
<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>

This should be a comment. But i cannot put a comment. I have faced the same problem. Please check your size of image. Try to compress the image and try again it may help you. Please do let me know.

Android Splash Screen Center Image

I have an app with a splash screen view that looks like this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/black">
<ImageView android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:src="#drawable/splash2"
android:scaleType="centerInside"
android:adjustViewBounds="true"
/>
<TextView
android:id="#+id/txtVersion"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#android:color/white"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:textSize="20dip"
android:visibility="invisible"
android:text="Version "/>
<LinearLayout
android:id="#+id/lvSplashInfo"
android:layout_width="fill_parent"
android:layout_height="120dp"
android:layout_marginRight="40dp"
android:layout_marginLeft="40dp"
android:layout_alignParentBottom="true"
android:orientation="vertical"
android:visibility="invisible"
android:background="#android:color/black">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="bleh"
android:layout_margin="5dp"
android:layout_gravity="center_horizontal"
android:textColor="#android:color/white"/>
<TextView
android:id="#+id/txtPercent"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="0% of the total"
android:layout_margin="5dp"
android:textSize="18sp"
android:gravity="center_horizontal"
android:textColor="#9DBA32"/>
<TextView
android:id="#+id/txtFilename"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="File name: xxxxx"
android:layout_margin="5dp"
android:textSize="18sp"
android:visibility="invisible"
android:gravity="center_horizontal"
android:textColor="#android:color/white"/>
</LinearLayout>
</RelativeLayout>
It renders an image scaled and centered into the screen. Unfortunately, this isn't working well for us. It causes a slight flash of white before it loads the view. My solution was to use an activity style. That works great, except I can't seem to center AND scale the image. I can center it easily, but it is wider than the screen. Here is my xml drawable:
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#android:color/black"/>
<item>
<bitmap
android:gravity="center|bottom|clip_vertical"
android:src="#drawable/splash2"
/>
</item>
</layer-list>
How do I scale and center that splash2 image?

You can make the image in Photoshop, put it in the xml then center the whole thing, but I would recommend having a Splash screen while loading the app, because if you have it with a timer it wastes user's time...
So that's what I did to have a splash screen like this one:
First, you have to add a new Java class, let's call it SplashActivity.java
You don't have to add much to it:
package YOUR-PACKAGE-NAME;
import android.content.Intent;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
public class SplashActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
Intent i = new Intent(SplashActivity.this, MainActivity.class);
startActivity(i);
finish();
}
}
After that, you have to have a drawable for the splash screen, because if you have a layout it will appear when the app is already loaded, so there won't be any sense in the Splash...
Go to the drawable folder and create a file named background_splash.xml.
There you add
<?xml version="1.0" encoding="utf-8"?>
<layer-list
xmlns:android="http://schemas.android.com/apk/res/android"
android:gravity="center">
<item>
<bitmap
android:src="#drawable/ic_splash"
/>
</item>
</layer-list>
where ic_splash is the image I created with Photoshop with resolution 1280x720 and then created a 9-patch image... (You have to have the 9-patch image, not to have normal, small and cropped image on different devices..) So go here and generate yours... Create it, download it and copy all the folders (mdpi, hdpi etc) to your res folder...
Now, go to your values/styles.xml and add the NoActionBar style
<style name="SplashTheme" parent="Theme.AppCompat.NoActionBar">
<item name="android:windowBackground">#drawable/background_splash</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
THEN open your Manifest.xml and edit the activity with intent-filter.
Yours should be
<activity
android:name=".MainActivity"
android:label="#string/app_name"
android:icon="#drawable/ic_launcher"
android:theme="#style/AppTheme"
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
so replace the .MainActivity with .SplashActivity and the .MainActivity as another activity, so in the end you should have at least two activities declared at the Manifest.xml:
<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>
<activity android:name=".MainActivity"
android:label="#string/app_name"
android:icon="#drawable/ic_launcher" or "#mipmap/ic_launcher"
android:theme="#style/AppTheme">
</activity>
Good luck! :)
If there are any troubles, ask :)