Android application (how to add a splash screen with timer) tutorial #4

6

Android Application TutorialHow to add a splash screen with a timer

All Copy Rights Saved to the 7th Students’ Conference on Communication and Information Based in the Faculty of Computers and Information Cairo University – Egypt 2011/2012 www.scci-cu.com

Tutorial Code: APS-06-2012

Instructed on: 02-Mar-2012 | Tutorial: #06

By : Yasmine Sherif Mahmoud

• We will continue on our last project to add a splash screen with a timer to it.

• A splash screen is the first screen you see when you open the application.

• It disappears after an interval of time.• Open your last project and follow these steps:

I added the new picture that I want to use as a splash screen in my drawable file.You can add a new picture as we have learned before in the previous tutorials.

Here is the new picture.Do not forget to clean your project so you can be able to see the picture.

Right Click on layout

We will delete this part of code

Open the .Java file

Type R. and it will give you these options,Choose layout

After choosing the layout , type . then it will give you these options.Choose splash_screen

This is how you reference a your .xml file

• We are now accessing the Splash screen.xml but we can’t access the main.xml file anymore so we will have to create another .java file to access the main.xml file again at the same time of accessing the splash screen.xml file.

• Steps:

Right Click on your project

This is how it going to look like.We will have to add some code here to access the main.xml file

1-Open the old .Java file

2-Copy this line

1- Back to the new .Java file

2- Paste the line you copied before here

3- Write extends Activity

Right Click between the parenthesis This list will show up.

This will be auto generated as we used an already implemented class to use the function that will access the main.xml file

Write this line to finally access the main.xml file

Go to the new splash_screen.xml file to add some code to it.

Open a tag < and write i the following list will appear choose ImageView

Inside the Image view Write android: and choose android:src from the list which will appear

Reference the picture you want to use like that

Write android:la and choose android:layout_width from the list which will appear

Write fill_parent so that the picture will fill the width of the screen.

Write android:la and choose android:layout_height from the list which will appear

This is how the code is going to look like

When closing any file don’t forget to save the changed you have made.

• Now according the application life cycle (Shown next slide), we have to add all the functions that the application carry out.

• So now we are going to add all these functions in our code:

Open your old .Java file

Right Click in the body of the class and this list will appear

This is where you are going to choose all the functions that are found in the application life cycle.

This is how they going to look like after over riding them.

• After that we have to create the timer:

Write this line under here

Put a semi colon after this parenthesis

Write this code

Write the following code inside this class

It’s a while loop that operates the timer

Write this line after the while loop but inside the try body.

Copy your package name.CLEARSCREEN in the brackets after Intent(“ ”)

You will have in error in the word Intent which can be fixed by using this:

Add this code after the try body

Add this line after the thread body

You will have an error here which can be handled by adding a catch to the try

This will be auto generated, choose the first option.

1- Go to the Manifest.xml file

2-Copy the shaded part

Paste it under itself

Change the android:name to .Mymain (the new .java file you created before)

Change the name to “your package name.CLEARSCREEN”

Change it to .DEFAULT

The code after the modifications.

• Save and Run.

Splash screen successfully appeared

• After 5 seconds , this screen will disappear and the next screen will be shown.

Yasmine Sherif EL-Adly

@YasmineSherif91

+Yasmine Sherif EL-Adly

Contact Me: