Monday, November 14, 2011

Splash Screen in Android (Advance)


A splash screen is an image with animation effects that appears while a game or program is loading. It may also be used to describe an introduction of App or page on a website.

So today we will learn how to create a splash screen in Android so that our app will start with Splash screen and then load Home Screen.

in this example i have defined 5 seconds delay to load home screen you may modify as your need.

In the previous example i used thread to manage splash duration here we will use Android's Animation Class
also we will create custom fad animation effects in res/anim folder

so lets try this smart app..


app structure is look like this




-------------------------------------------
App Name: SplashScreenAdvance
Package Name: com.rdc
Android SDK: Android SDK 2.3.3 / API 10
Default Activity Name: ActivitySplashScreen
-------------------------------------------

ActivitySplashScreen.java
package com.rdc;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.KeyEvent;
import android.view.Window;
import android.view.WindowManager;
import android.view.animation.Animation;
import android.view.animation.Animation.AnimationListener;
import android.view.animation.AnimationUtils;
import android.widget.ImageView;

public class ActivitySplashScreen extends Activity {

	// animation duration you can find in fad_in and fad out xml files
	// in anim folder

	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		requestWindowFeature(Window.FEATURE_NO_TITLE);
		getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
				WindowManager.LayoutParams.FLAG_FULLSCREEN);
		setContentView(R.layout.splash_screen);

		// get the instace of image view
		ImageView image = (ImageView) findViewById(R.id.imageViewSplash);

		// create animation object
		Animation fad = AnimationUtils.loadAnimation(getBaseContext(),
				R.anim.splash_fade_in);

		// create animation listener
		fad.setAnimationListener(new AnimationListener() {

			@Override
			public void onAnimationEnd(Animation animation) {
				Intent i = new Intent(ActivitySplashScreen.this,
						ActivityHomeScreen.class);
				startActivity(i);
				finish();

				overridePendingTransition(R.anim.splash_fade_in,
						R.anim.splash_fade_out);

			}

			@Override
			public void onAnimationRepeat(Animation animation) {
				// TODO Auto-generated method stub
			}

			@Override
			public void onAnimationStart(Animation animation) {
				// TODO Auto-generated method stub
			}

		});

		// start animation
		image.startAnimation(fad);
	}

	// disable home button during splash screen
	@Override
	public void onAttachedToWindow() {
		this.getWindow().setType(
				WindowManager.LayoutParams.TYPE_KEYGUARD_DIALOG);
		super.onAttachedToWindow();
	}

	// disable back button during splash screen
	@Override
	public boolean onKeyDown(int keyCode, KeyEvent event) {
		return false;
	}
}

ActivityHomeScreen.java
package com.rdc;

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

public class ActivityHomeScreen extends Activity {
	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.home_screen);
	}
}
put these two files in res/layout folder
splash_screen.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:orientation="vertical"
	android:layout_width="fill_parent"
	android:layout_height="fill_parent"
	android:gravity="center">
	<ImageView
		android:layout_height="fill_parent"
		android:layout_width="fill_parent"
		android:src="@drawable/android_splash_image"
		android:id="@+id/imageViewSplash"></ImageView>
</LinearLayout>

home_screen.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:orientation="vertical"
	android:layout_width="match_parent"
	android:layout_height="match_parent"
	android:gravity="center">
	<TextView
		android:layout_width="wrap_content"
		android:id="@+id/textView1"
		android:layout_height="wrap_content"
		android:textSize="25sp"
		android:text="@string/homeTitle"></TextView>
</LinearLayout>

create anim folder in res and put below tow files at res/anim splash_fade_in.xml
<alpha
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:interpolator="@android:anim/decelerate_interpolator"
	android:zAdjustment="top"
	android:fromAlpha="0.0"
	android:toAlpha="1.0"
	android:duration="2000" />

splash_fade_out.xml
<alpha
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:interpolator="@android:anim/accelerate_interpolator"
	android:fromAlpha="1.0"
	android:toAlpha="0.0"
	android:duration="3000" />

AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest
	xmlns:android="http://schemas.android.com/apk/res/android"
	package="com.rdc"
	android:versionCode="1"
	android:versionName="1.0">
	<uses-sdk android:minSdkVersion="10" />

	<application
		android:icon="@drawable/icon"
		android:label="@string/app_name">
		<activity
			android:name=".ActivitySplashScreen"
			android:screenOrientation="nosensor"
			android:configChanges="keyboardHidden|orientation"
			android:theme="@android:style/Theme.Black.NoTitleBar.Fullscreen"
			android:label="@string/app_name">
			<intent-filter>
			<action android:name="android.intent.action.MAIN" />
			<category android:name="android.intent.category.LAUNCHER" />
			</intent-filter>
		</activity>
		<activity
			android:name=".ActivityHomeScreen"
			android:label="@string/app_name">
			<intent-filter>
		    <category android:name="android.intent.category.LAUNCHER" />
			</intent-filter>
		</activity>

	</application>
</manifest>

The output Screen will be like this..


You can download the complete source code zip file here : SplashScreenAdvance 

cheers!!

I'd love to hear your thoughts!

No comments:

Post a Comment