Home / Questions / 5974
Accepted
Codelaby
Asked: 2020-03-19 00:35:35 +0800 CST 2020-03-19 00:35:35 +0800 CST

Show SplashScreen while app is loading in Android

  • 772

I have implemented a splashcreen by means of one activitythat inflates its layoutwith a centered image, but what I find is that if it is the first time the app is installed, during the loading/compilation a blank screen is shown, more or less 6 seconds , the second time you start the app it starts directly with the SplashScreen.

graphically like this

The first time the app is run after installation or deleting data from the configuration menu

(click open app)...............................(splashscreen)------(done)

The second time the app is opened

(click open app)(splashscreen)------(done)

My question is there any way to put a splashcreen during that Android preload period?

Manifest.xml

<activity
    android:name=".SplashActivity"
    android:configChanges="keyboardHidden|orientation|screenSize"
    android:theme="@style/AppTheme.SplashTheme">
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
</activity>

Style AppTheme.SplashThemeof the Theme that the activity inherits

<style name="AppTheme.SplashTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="windowActionBar">false</item>
    <item name="windowNoTitle">true</item>
    <item name="android:windowFullscreen">true</item>
    <item name="android:windowEnterAnimation">@android:anim/fade_in</item>
</style>

Layout XML splash_screen.xml

<?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="@color/colorSplashScreen">

    <LinearLayout
        android:id="@+id/splashscreen"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center_vertical|center_horizontal">

        <ImageView
            android:layout_width="wrap_content"
            android:contentDescription="@string/about.alt_logo"
            android:layout_height="wrap_content"
            android:src="@mipmap/ic_launcher"
            android:layout_gravity="center"/>

        <TextView android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/app_name"
            android:layout_marginTop="8dp" />

    </LinearLayout>

</LinearLayout>

SplashActivity.java

import android.content.Intent;
import android.os.Bundle;
import android.os.Handler;
import android.support.v7.app.AppCompatActivity;
import android.util.Log;
import android.view.View;
import android.view.animation.AccelerateInterpolator;
import android.view.animation.AlphaAnimation;
import android.view.animation.Animation;
import android.widget.LinearLayout;

/*
config_longAnimTime   = 400
config_mediumAnimTime = 300
config_shortAnimTime  = 150
*/
public class SplashActivity extends AppCompatActivity {

    private String TAG = "SplashActivity";


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        final int SPLASH_DISPLAY_LENGTH = 1200;
        final int SPLASH_DISPLAY_OFFSET = getResources().getInteger(android.R.integer.config_shortAnimTime);;

        super.onCreate(savedInstanceState);
        setContentView(R.layout.splash_screen);

        Log.d(TAG, "onCreate() called with: " + "savedInstanceState = [" + savedInstanceState + "]");
        final Handler handler = new Handler();

        handler.postDelayed(new Runnable() {
            @Override
            public void run() {


                final LinearLayout img = (LinearLayout) SplashActivity.this.findViewById(R.id.splashscreen);

                Animation fadeOut = new AlphaAnimation(1, 0);
                fadeOut.setInterpolator(new AccelerateInterpolator());
                fadeOut.setDuration(getResources().getInteger(android.R.integer.config_longAnimTime));

                fadeOut.setAnimationListener(new Animation.AnimationListener()
                {
                    public void onAnimationEnd(Animation animation)
                    {
                        img.setVisibility(View.GONE);

                        handler.postDelayed(new Runnable() {
                            @Override
                            public void run() {
                                //Create an intent that will start the main activity.
                                Intent mainIntent = new Intent(SplashActivity.this, MainActivity.class);
                                SplashActivity.this.startActivity(mainIntent);

                                //Apply splash exit (fade out) and main entry (fade in) animation transitions.
                                overridePendingTransition(R.anim.zoom_enter, android.R.anim.fade_out);

                                //Finish splash activity so user cant go back to it.
                                SplashActivity.this.finish();

                            }
                        }, SPLASH_DISPLAY_OFFSET);

                    }
                    public void onAnimationRepeat(Animation animation) {}
                    public void onAnimationStart(Animation animation) {}
                });

                img.startAnimation(fadeOut);

                Log.d(TAG, "finish SplashScreen: " + SPLASH_DISPLAY_LENGTH);

            }
        }, SPLASH_DISPLAY_LENGTH);

    }

}

Update: The white screen is shown because it inherits from the light theme, because if I add the style of the theme, the screen is shown black.

    <item name="android:background">#FF000000</item>
    <item name="android:colorBackground">#FF000000</item>

I think the solution lies in implementing drawing the icon by loading the theme before using an xml layout, open app ---> apply theme ----> load layout in frontend.

java

2 Answers

  1. When you want the application's home screen (SplashScreen) not to show that annoying white background when you start , it can be easily solved by creating a theme which you would relate to the activity:

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

    Actually the property that defines the background when starting the activity is android:windowBackgroundand you can add an image ( @drawable/)

        <item name="android:windowBackground">@drawable/fondo_splash</item>

    or a color ( @color/):

        <item name="android:windowBackground">@color/fondo_splash</item>

    Inside our AndroidManifest.xmlwe can define the theme at the application level:

      <application
        android:theme="@style/SplashTheme">

    or some specific activity:

    <activity android:name=".SplashScreenActivity"
   android:theme="@style/SplashTheme" >

    with this we always make sure to load a background (drawable or color), before loading an image or fully launching the application.

    enter image description here

    • 6
  2. Best Answer

    Update Reading that post An efficient splashscreen (in) I add the opaque

    Define the background of the splashscreen in a drawablebackground_splash.xml

    <?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/colorSplashScreen"/>
    <item android:top="-48dp">
        <bitmap
            android:gravity="center"
            android:src="@mipmap/ic_launcher"/>
    </item>
</layer-list>

    I apply a top offset to fine tune the transition from the pre-load screen to the splashscreen

    Assign as background the drawable created in styles.xml

    <style name="AppTheme.SplashTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="windowActionBar">false</item>
    <item name="windowNoTitle">true</item>
    <item name="android:windowFullscreen">true</item>
    <item name="android:windowEnterAnimation">@android:anim/fade_in</item>
    <item name="android:windowBackground">@drawable/background_splash</item>
</style>

    By the way, I eliminate the idea of ​​having text that appears under the app icon, because I haven't found how to do it directly as a drawable.

    layout splash_screen.xml

    <?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:orientation="horizontal"
    android:background="@color/colorSplashScreen">

    <LinearLayout
        android:id="@+id/splashscreen"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center_vertical|center_horizontal">

        <ImageView
        android:layout_width="wrap_content"
        android:contentDescription="@string/about.alt_logo"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher"
        android:layout_gravity="center"/>

</LinearLayout>

    Optional code to change the theme on the fly, in case you don't make a splascreen with an intermediate activity:

    public class MyMainActivity extends AppCompatActivity {
 @Override
  protected void onCreate(Bundle savedInstanceState) {

    setTheme(R.style.Theme_MyApp); //Tu Tema general
    super.onCreate(savedInstanceState);
    // ...
  }
}
    • 4