Advanced splash screen

29 Aug

Introduction

Splash screen makes the app beautiful when the app is launched to make it more beautiful lets make it bit advanced with animation

Starts here

Create a new Android Eclipse project

Create a new Android XML file “splash.xml” in appfolder/res/layout folder and ddd some picture to the appfolder/res/drawable folder

splash.xml

<?xml version=”1.0″ encoding=”utf-8″?>
<LinearLayout
xmlns:android=”http://schemas.android.com/apk/res/android”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:id=”@+id/TheSplashLayout”
android:layout_gravity=”center”
>
<ImageView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:id=”@+id/SplashImageView”
android:layout_gravity=”center”
android:src=”@drawable/xyz”
>
</ImageView>
</LinearLayout>

Let’s look at the application manifest. It has now just one “.MainActivity” activity set as a launcher. We’ll set it as default category and add another splash activity with a splash layout and will set it as the launcher.

Set the action to android.intent.action.MAIN and the category to android.intent.category.LAUNCHER. So the Splash screen activity will be run first. The manifest should look like the following:

Manifest

<?xml version=”1.0″ encoding=”utf-8″?>

<manifest xmlns:android=”http://schemas.android.com/apk/res/android”

package=”com.yourname.main”

android:versionCode=”1″

android:versionName=”1.0″>

<application android:icon=”@drawable/icon” android:label=”@string/app_name”>

<activity android:name=”.MainActivity”

android:label=”@string/app_name”>

<intent-filter>

<action android:name=”android.intent.action.MAIN” />

<category android:name=”android.intent.category.DEFAULT”/>

</intent-filter>

</activity>

<activity android:name=”SplashScreen”>

<intent-filter>

<action android:name=”android.intent.action.MAIN”></action>

<category android:name=”android.intent.category.LAUNCHER”></category>

</intent-filter>

</activity>

</application>

</manifest>

Splash Screen Activity

package com.yourname.main;

import android.app.Activity;

import android.content.Intent;

import android.graphics.drawable.AnimationDrawable;

import android.media.MediaPlayer;

import android.os.Bundle;

import android.view.Menu;

import android.view.MotionEvent;

import android.widget.ImageView;

public class SplashScreen extends Activity {

/**

* The thread to process splash screen events

private Thread mSplashThread;

MediaPlayer myAudio;

/** Called when the activity is first created. */

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

// Splash screen view

setContentView(R.layout.splash);

myAudio = MediaPlayer.create(SplashScreen.this, R.drawable.titanic);

myAudio.start();

// Start animating the image

final ImageView splashImageView = (ImageView) findViewById(R.id.SplashImageView);

splashImageView.setBackgroundResource(R.drawable.flag);

final AnimationDrawable frameAnimation = (AnimationDrawable)splashImageView.getBackground();

splashImageView.post(new Runnable(){

@Override

public void run() {

frameAnimation.start();

}

});

final SplashScreen sPlashScreen = this;

// The thread to wait for splash screen events

mSplashThread = new Thread(){

@Override

public void run(){

try {

synchronized(this){

// Wait given period of time or exit on touch

wait(3000);

}

catch(InterruptedException ex){

}

finish();

// Run next activity

Intent intent = new Intent();

intent.setClass(sPlashScreen, MainActivity.class);

startActivity(intent);

//stop();

}

};

mSplashThread.start();

}

@Override

public boolean onCreateOptionsMenu(Menu menu){

super.onCreateOptionsMenu(menu);

return false;

}

/**

* Processes splash screen touch events

@Override

public boolean onTouchEvent(MotionEvent evt)

{

if(evt.getAction() == MotionEvent.ACTION_DOWN)

{

synchronized(mSplashThread){

mSplashThread.notifyAll();

}

return true;

}

@Override

protected void onPause() {

// TODO Auto-generated method stub

super.onPause();

myAudio.stop();

finish();

}

MainActivity

package com.yourname.main;

import android.app.Activity;
import android.os.Bundle;

public class MainActivity extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}
}

Add-ons to APP

Few animations are added to app to make splash screen advanced

First, let’s make the splash screen transparent. In appfolder/res/values, add new Android XML file styles.xml and add to it a transparent theme:

Styles.xml

<?xml version=”1.0″ encoding=”utf-8″?>

<resources>

<style name=”Animations” parent=”@android:Animation” />

<style name=”Animations.SplashScreen”>

<item name=”android:windowEnterAnimation”>@anim/appear</item>

<item name=”android:windowExitAnimation”>@anim/disappear</item>

</style>

<style name=”Theme.Transparent” parent=”android:Theme”>

<item name=”android:windowIsTranslucent”>true</item>

<item name=”android:windowBackground”>@android:color/transparent</item>

<item name=”android:windowContentOverlay”>@null</item>

<item name=”android:windowNoTitle”>true</item>

<item name=”android:windowIsFloating”>true</item>

<item name=”android:backgroundDimEnabled”>false</item>

<item name=”android:windowAnimationStyle”>@style/Animations.SplashScreen</item>

</style>

</resources>

Now we’ll make it fade-in and fade-out. Create in appfolder/res folder new folder “anim” and add to it two Android XML files – appear.xml and disappear.xml. They will be alpha animations

Appear.xml

Disappear.xml

Fla.xml

To make your splash screen with animated and

<?xml version=”1.0″ encoding=”utf-8″?>
<animation-list
xmlns:android=”http://schemas.android.com/apk/res/android”
android:id=”@+id/flaganim”
android:oneshot=”false”>
<item android:drawable=”@drawable/s1″ android:duration=”500″ />
<item android:drawable=”@drawable/s2″ android:duration=”500″ />
<item android:drawable=”@drawable/s3″ android:duration=”500″ />
</animation-list>

admin

Open Source