[TUT] SplashScreen with Progress Bar

Recently had a request for a splash screen that can be used to inform the user that you are downloading some resources that are needed for your app to load.
When your app first starts you might want to download a database from the internet, unzip some compressed files in your assets directory or do some other type of pre-processing. This tutorial will show you how to setup a splash screen that indicates to the user that your application is loading and when they come back a second time the splash will show for a shorter time (because your resources are already loaded).

Ok here .. we .. go!

This is the order of play:

1. Create a launcher activity (this will be your splashscreen)
2. Create your main activity where the app starts
3. Setup the splash with a layout including a progress bar
4. Start off a task to get your resources (i.e. download from the internet)
5. Call back to your splash that you’ve finished
6. Start your app!

First off is the SplashActivity itself. This shows the progress bar informing the user that your app is loading. It fires off your ASyncTask (this then does work on another Thread in the background). The SplashActivity also reacts to the ASyncTask finishing and starts your main activity.

SplashActivity.java

package com.blundell.tut.ui;

import com.blundell.tut.R;
import com.blundell.tut.task.LoadingTask;
import com.blundell.tut.task.LoadingTask.LoadingTaskFinishedListener;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.widget.ProgressBar;

public class SplashActivity extends Activity implements LoadingTaskFinishedListener {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // Show the splash screen
        setContentView(R.layout.activity_splash);
        // Find the progress bar
        ProgressBar progressBar = (ProgressBar) findViewById(R.id.activity_splash_progress_bar);
        // Start your loading
        new LoadingTask(progressBar, this).execute("www.google.co.uk"); // Pass in whatever you need a url is just an example we don't use it in this tutorial
    }

    // This is the callback for when your async task has finished
    @Override
	public void onTaskFinished() {
		completeSplash();
	}

    private void completeSplash(){
		startApp();
		finish(); // Don't forget to finish this Splash Activity so the user can't return to it!
    }

    private void startApp() {
		Intent intent = new Intent(SplashActivity.this, MainActivity.class);
		startActivity(intent);
	}
}

If you notice this Activity implements the interface ‘LoadingTaskFinishedListener’ using interfaces is a way of communicating between classes, you are saying “I am capable of receiving message that look like ….this”, because the ASyncTask has a field that is an object of that interface it can fire off those messages and your Activity will receive them. Next comes the ASyncTask:

LoadingTask.java

package com.blundell.tut.task;

import android.os.AsyncTask;
import android.util.Log;
import android.widget.ProgressBar;

public class LoadingTask extends AsyncTask<String, Integer, Integer> {

	public interface LoadingTaskFinishedListener {
		void onTaskFinished(); // If you want to pass something back to the listener add a param to this method
	}

	// This is the progress bar you want to update while the task is in progress
	private final ProgressBar progressBar;
	// This is the listener that will be told when this task is finished
	private final LoadingTaskFinishedListener finishedListener;

	/**
	 * A Loading task that will load some resources that are necessary for the app to start
	 * @param progressBar - the progress bar you want to update while the task is in progress
	 * @param finishedListener - the listener that will be told when this task is finished
	 */
	public LoadingTask(ProgressBar progressBar, LoadingTaskFinishedListener finishedListener) {
		this.progressBar = progressBar;
		this.finishedListener = finishedListener;
	}

	@Override
	protected Integer doInBackground(String... params) {
		Log.i("Tutorial", "Starting task with url: "+params[0]);
		if(resourcesDontAlreadyExist()){
			downloadResources();
		}
		// Perhaps you want to return something to your post execute
		return 1234;
	}

	private boolean resourcesDontAlreadyExist() {
		// Here you would query your app's internal state to see if this download had been performed before
		// Perhaps once checked save this in a shared preference for speed of access next time
		return true; // returning true so we show the splash every time
	}


	private void downloadResources() {
		// We are just imitating some process thats takes a bit of time (loading of resources / downloading)
		int count = 10;
		for (int i = 0; i < count; i++) {

			// Update the progress bar after every step
			int progress = (int) ((i / (float) count) * 100);
			publishProgress(progress);

			// Do some long loading things
			try { Thread.sleep(1000); } catch (InterruptedException ignore) {}
		}
	}

	@Override
	protected void onProgressUpdate(Integer... values) {
		super.onProgressUpdate(values);
		progressBar.setProgress(values[0]); // This is ran on the UI thread so it is ok to update our progress bar ( a UI view ) here
	}

	@Override
	protected void onPostExecute(Integer result) {
		super.onPostExecute(result);
		finishedListener.onTaskFinished(); // Tell whoever was listening we have finished
	}
}

The LoadingTask is a nice skeleton of an ASyncTask, we setup a callback in the constructor, then check if the resources we are about to download exists, if they don’t we talk to the internet. Once we are finished we inform the listener.
This task is just imitating talking to the internet as that isn’t the aim of this tutorial. If you notice every time a loop is finished we update the progress bar. Remember a progress bar is an Android View object, View objects are part of the UI and so can only be updated on the UI thread. Therefore we use the onProgressUpdate method that the Android system ensures is ran on the UI thread.
When updating a progress bar you send it a value from 0-100 and this will be it’s progress. In this example we run through a loop counting to 10 so we know each loop will be one tenth of the progress bar. If you where doing tasks you could hold a count of how many tasks you have and do some maths to interpret them as a percentage of 100.

And thats it! Once the LoadingTask is finished is messages the SplashActivity to tell it so. The SplashActivity then loads the MainActivity and we are done.

Nothing special in the Manifest, just declare the activities.

Enjoy and please say thanks!

Here’s the eclipse source project:

Loading Splash Screen Tutorial

And here’s a GitHub mirror:

https://github.com/blundell/LoadingSplashScreenTut