Cách tạo Splash Screen cho Android hiệu quả

Reading Time: 4 minutes

Splash Screen chính là màn hình đầu tiên mà người dùng nhìn thấy khi ứng dụng Android khởi chạy. Nó đóng vai trò cực kỳ quan trọng vì đây chính là ấn tượng đầu tiên của người dùng đối với ứng dụng của bạn.

Không chỉ là nơi để hiển thị các hoạt ảnh, logo ứng dụng hay những hình minh họa bắt mắt, Splash Screen còn là khoảng thời gian quý báu để ứng dụng tải dữ liệu ban đầu cần thiết cho các màn hình tiếp theo, ví dụ như fetching dữ liệu từ mạng hay database.

Splash Screen của ứng dụng Android

Theo mặc định, intent-filter trong file AndroidManifest.xml chính là Splash Activity của ứng dụng bạn:

AndroidManifest.xml

<intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>

Cấu trúc project của Android Splash Screen sẽ như sau

 

Có một vài cách để tạo màn hình khởi động ban đầu, tức là Splash Screen, cho ứng dụng của bạn. Chúng ta hãy cùng tìm hiểu từng phương pháp.

Cách tiếp cận truyền thống với Splash Screen

Trước tiên, chúng ta hãy xem xét cách làm truyền thống mà nhiều lập trình viên mới thường áp dụng.

File SplashActivity.java của bạn sẽ trông như thế này:

package com.journaldev.splashscreen;

import android.content.Intent;
import android.os.Handler;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

public class SplashActivity extends AppCompatActivity {

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

        new Handler().postDelayed(new Runnable() {

            @Override
            public void run() {
                // This method will be executed once the timer is over
                Intent i = new Intent(SplashActivity.this, MainActivity.class);
                startActivity(i);
                finish();
            }
        }, 5000);
    }
}

Chúng ta thường tạo layout cho Splash Screen của mình trong file activity_splash.xml như sau:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="<https://schemas.android.com/apk/res/android>"
    xmlns:app="<https://schemas.android.com/apk/res-auto>"
    xmlns:tools="<https://schemas.android.com/tools>"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/black"
    tools:context="com.journaldev.splashscreen.SplashActivity">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="72dp"
        android:layout_height="72dp"
        android:src="@mipmap/ic_launcher"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <ProgressBar
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:indeterminate="true"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        android:layout_marginTop="8dp"
        app:layout_constraintTop_toBottomOf="@id/imageView" />

</android.support.constraint.ConstraintLayout>

Lưu ý: Để MainActivity.java trống rỗng tạm thời cho mục đích minh họa. Chúng ta cũng đã thiết lập theme của SplashActivity thành Theme.AppCompat.NoActionBar trong file AndroidManifest.xml.

Khi bạn chạy ứng dụng với cách triển khai trên, bạn có để ý thấy một trang trống (thường là màu đen hoặc trắng) xuất hiện trong một khoảnh khắc trước khi Splash Screen của bạn thực sự hiển thị không? Đây chính là nhược điểm lớn của phương pháp này, dẫn đến hiện tượng “cold start” (khởi động lạnh).

Mục đích của Splash Screen là hiển thị một màn hình đẹp mắt một cách nhanh chóng trong khi ứng dụng tải nội dung cần thiết (từ các cuộc gọi mạng hoặc cơ sở dữ liệu). Với cách tiếp cận truyền thống này, SplashActivity phải tốn thêm chi phí để tạo layout của nó (setContentView(R.layout.activity_splash)). Điều này gây ra sự chậm trễ đáng kể trong quá trình khởi động ứng dụng, biểu hiện bằng một màn hình trống khó chịu, làm giảm trải nghiệm người dùng ngay từ giây phút đầu tiên. Đây không phải là cách tiếp cận chuẩn mực!

Cách tiếp cận chuẩn mực cho Splash Screen

Hiện tượng “cold start” xảy ra do ứng dụng mất thời gian để tải file layout của Splash Activity. Vậy, thay vì tạo layout riêng, chúng ta sẽ tận dụng sức mạnh của application theme để tạo layout ban đầu của mình. Theme của ứng dụng được khởi tạo trước khi layout được tạo ra. Chúng ta sẽ đặt một drawable bên trong thuộc tính android:windowBackground sẽ bao gồm nền của Activity và một biểu tượng sử dụng layer-list như hình dưới đây.

Bạn tạo một file splash_background.xml trong thư mục drawable như sau:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="<https://schemas.android.com/apk/res/android>">

    <item android:drawable="@android:color/black" />
    <item>
        <bitmap
            android:gravity="center"
            android:src="@mipmap/ic_launcher" />
    </item>
</layer-list>

Tiếp theo, chúng ta định nghĩa một style trong styles.xml và đặt android:windowBackground trỏ đến splash_background vừa tạo:

<style name="SplashTheme" parent="Theme.AppCompat.NoActionBar">
        <item name="android:windowBackground">@drawable/splash_background</item>
    </style>

Cuối cùng, bạn sẽ gán SplashTheme này làm theme cho SplashActivity trong file AndroidManifest.xml của mình.

Và đây là cách file SplashActivity.java của bạn sẽ trông như thế này:

package com.journaldev.splashscreen;

import android.content.Intent;
import android.os.Handler;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

public class SplashActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // Không còn setContentView(R.layout.activity_splash); nữa!

        new Handler().postDelayed(new Runnable() {

            @Override
            public void run() {
                // This method will be executed once the timer is over
                Intent i = new Intent(SplashActivity.this, MainActivity.class);
                startActivity(i);
                finish();
            }
        }, 5000);
    }
}

Lưu ý quan trọng: Theme của Activity được thiết lập trước mọi thứ khác, bao gồm cả việc tạo layout thông qua setContentView(). Do đó, cách tiếp cận này sẽ mang lại cho ứng dụng của chúng ta một khởi đầu nhanh chóng hơn rất nhiều. Việc sử dụng theme và loại bỏ việc tải layout riêng trong SplashActivitylà cách hiệu quả để tạo một Splash Screen hiệu quả và tối ưu.

Kết luận

Chúng ta đã cùng nhau khám phá ý nghĩa và tầm quan trọng của Android Splash Screen. Bằng cách áp dụng phương pháp chuẩn mực này, bạn không chỉ loại bỏ được hiện tượng màn hình trống khó chịu mà còn cải thiện đáng kể tốc độ khởi động của ứng dụng, mang lại trải nghiệm mượt mà và chuyên nghiệp hơn cho người dùng.