Android : How to create splash screen

Splash Screen หรือ Splash page คือ หน้าจอที่เรามักใช้ในการแสดงรูปภาพ LOGO, Version, Promote Content หรือทำเป็นหน้า Loading เป็นต้น ก่อนเข้าสู่โปรแกรมจริงๆ

มีขั้นตอนการสร้างง่ายๆดังนี้

1. เตรียมรูป Splash Screen
ปกติจะเป็นรูปเต็มหน้าจอของอุปกรณ์ เพราะฉะนั้นถ้าจะให้รองรับกับอุปกรณ์มือถือที่มี resolution แตกต่างกัน เราสามารถเตรียมรูปหลายๆขนาดใส่ใน drawable/ ( รายละเอียดอ่านได้จาก Android : Drawable resolution ldpi mdpi hdpi xhdpi xxhdpi xxxhdpi )

ในตัวอย่างเตรียมรูปชื่อ “splash.png” เอาไปวางไว้ที่

  • res/drawable/mdpi
  • res/drawable/hdpi
  • res/drawable/xhdpi
  • res/drawable/xxhdpi

2. Modify “AndroidManifest.xml”

เพิ่ม Activity “SplashActivity” แล้วกำหนดให้เป็น Activity แรกที่ทำงานโดยการย้าย <intent-filter>…</intent-filter> จาก “MainActivity” เดิมมาอยู่ใน “SplashActivity” แทน ดังตัวอย่าง

<application

<activity
android:name=”.SplashActivity”
android:label=”@string/app_name”
android:screenOrientation=”portrait” >
<intent-filter>
<action android:name=”android.intent.action.MAIN” />
<category android:name=”android.intent.category.LAUNCHER” />
</intent-filter>
</activity>

<activity
android:name=”.MainActivity”
android:label=”@string/app_name” >
</activity>

3. สร้าง SplashActivity.java

เข้าไปที่เมนู Java -> Right Click -> New -> Java Class แล้วสร้าง SplashActivity.java ขึ้นมา โดยในไฟล์ใส่โค้ดนี้เลยครับ

package com.example.freeway.bannerads;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.os.Handler;

public class SplashActivity extends Activity {

/** Duration of wait **/
private final int SPLASH_DISPLAY_LENGTH = 1000;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_splash);

/* New Handler to start the Menu-Activity
* and close this Splash-Screen after some seconds.*/
new Handler().postDelayed(new Runnable(){
@Override
public void run() {
/* Create an Intent that will start the Menu-Activity. */
Intent intent;
intent = new Intent(getApplicationContext(),MainActivity.class);
startActivity(intent);
// closing spalsh activity
finish();
}
}, SPLASH_DISPLAY_LENGTH);

}

}

จากตัวอย่าง เราต้องแก้ชื่อ Package Name ด้วยครับ โดยในโค้ดจะมีการหน่วงเวลาของ Splash Screen ไว้ที่ 10 sec. ถ้าต้องการปรับเปลี่ยนเวลาใหม่แก้ที่ SPLASH_DISPLAY_LENGTH = … ; และในโค้ดจะไปเรียก Layout “activity_splash” จากคำสั่งบรรทัดนี้

setContentView(R.layout.activity_splash);

4. สร้าง layout “activity_splash.xml”

จากเมนู res -> layout -> right click -> New -> Layout resource file สร้าง LinearLayout activity_splash
โดยใส่โค้ดดังนี้

<?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”><ImageView
android:layout_width=”fill_parent”
android:layout_height=”fill_parent”
android:id=”@+id/imageView”
android:scaleType=”centerCrop”
android:src=”@drawable/splash” />
</LinearLayout>

เพียงเท่านี้เราก็ลองรัน application test ได้เลยครับ Splash Screen งามๆ จะถูกนำเสนอขึ้นมาเพิ่มสีสันและลูกเล่นก่อนเข้าสู่แอปปลิเคชันของเราครับ

You may also like...

Leave a Reply

Your email address will not be published. Required fields are marked *