Android Splash Screen With Progress Bar

A splash screen is a graphical control element consisting of window containing an image,  logo and the current version of the software. Splash screen usually appears while a game or program is launching. A Splash screened are typically used by particularly large applications to notify the user that the program is in the process of loading. They provide feedback that a lengthy process is underway. Occasionally, a progress bar within the splash screen indicates the loading progress. The splash disappears when the application’s main window appears. Source: Wikipedia. Else we can use it for making the app more attractive. You can find tutorials in splash screen for android all over the internet. Only few that works without the blank screen while launching. I found a perfect example for proper splash screen from bignerdranch.com.

Progress bar is used in this example and can be changed according to the work done. We are creating two activity’s. One for displaying flash and another is the landing activity. The page after splash screen. This can be explained in four steps.

1. Creating the xml file for the splash screen.
2.  Creating the theme for splash activity.
3. Applying the theme for splash activity.
4. Background tasks to be done while displaying progress bar and splash screen.

Fourth one is for class files to show progress and load next page after progress bar reach 100% .

 1 – Creating XML file for the splash screen and splash activity

For this first create a xml file in the drawable. Mine is "splash.xml",ic_launcher is the splash image.

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="100dp"
    android:layout_height="100dp">
    <item
        android:drawable="@android:color/background_light"/>
    <item >
        <bitmap
            android:gravity="center"
            android:filter="true"
            android:src="@drawable/ic_launcher"/>
    </item>

</layer-list>

Below is the xml file for Splash activity.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_splash"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.logicchip.blog_7_proper_splash_screen.Splash">


    <ProgressBar
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="50dp"
        android:id="@+id/progressBar" />

    <TextView
        android:textSize="40sp"
        android:textColor="@android:color/holo_red_light"
        android:text="TextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/progressBar"
        android:layout_centerHorizontal="true"
        android:id="@+id/textView" />
</RelativeLayout>

2 – Creating the Theme for splash activity

Theme is an important element. Edit your styles.xml file and add the SplashTheme part.

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

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

</resources>

3 – Applying the theme for splash activity

Setting theme for the specified splash activity. Just edit AndroidManifest.xml file and replace the laucher activity theme with SplashTheme.

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.logicchip.blog_7_proper_splash_screen">

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity
            android:name=".Splash"
            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">
        </activity>
    </application>

</manifest>

4 – Tasks for progress bar and loading next activity

Two activity’s are created Splash.java and MainActivity.java. Splash.java is the splash activity,handling the splash and progress of progress bar. MainActivity.java is the landing page. Inside the code the part runOnUiThread  is used to modify the TextView component. Ui components modification is possible only on ui thread. Otherwise app crashes.

 runOnUiThread(new Runnable() {
                        @Override
                        public void run() {
                            textView.setText(String.valueOf(i)+"%");
                        }
                    });

Time period is set to 100 ms. Run method inside the thread executes every 100 ms. It only stops when timer.cancel(); called . If you don’t call timer.cancel(); the process continues to execute leading to system hang or crash.

import android.content.Intent;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ProgressBar;
import android.widget.TextView;
import java.util.Timer;
import java.util.TimerTask;

public class Splash extends AppCompatActivity{
    private Timer timer;
    private ProgressBar progressBar;
    private int i=0;
    TextView textView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_splash);
        progressBar=(ProgressBar)findViewById(R.id.progressBar);
        progressBar.setProgress(0);
        textView=(TextView)findViewById(R.id.textView);
        textView.setText("");

        final long period = 100;
        timer=new Timer();
        timer.schedule(new TimerTask() {
            @Override
            public void run() {
                //this repeats every 100 ms
                if (i<100){
                    runOnUiThread(new Runnable() {
                        @Override
                        public void run() {
                            textView.setText(String.valueOf(i)+"%");
                        }
                    });
                    progressBar.setProgress(i);
                    i++;
                }else{
                    //closing the timer
                    timer.cancel();
                    Intent intent =new Intent(Splash.this,MainActivity.class);
                    startActivity(intent);
                    // close this activity
                    finish();
                }
            }
        }, 0, period);
    }

}

You can download full code from here, You can modify the code us u like. In like manner feel free to comment your doubt’s below. Does our tutorials help you then help as spread the word, like and share.