Hướng dẫn tạo một SPLASH SCREEN

Chào các bạn , chúng ta lại gặp nhau vào blog hay cuối tuần ^_^ . Đến với bài blog hôm nay mình sẽ chỉ các bạn tạo 1 hiệu ứng splash screen chuyên nghiệp của các android application .

Vậy thì splash screen là gì ? Splash Screen là các màn hình hiệu ứng xuất hiện trong 1 thời gian ngắn khi các bạn click bắt đầu sử dụng vào một app nào đó trên điện thoại. Mục đích chính của splash screen để mẹo cho những tác vụ nặng như load data từ server về hay hỗ trợ cung cấp nhiều thời gian hơn khi chạy những process cần thiết , đồng thời thể hiện các logo và thể hiện tính chuyên nghiệp của một mobile app

(Hình minh họa )

Các bước xây dựng màn hình trên .

Bước 1 :

Các bạn tạo một project mới và tạo một Empty Activity nhé ^_^

Bước 2 : Sau khi đã có được activity thì các bạn design một layout mình mong muốn .

Dưới đây là mình chọn import 1 hình từ ngoài vào để bỏ lên , Cách để import 1 hình thì mình đã chỉ các bạn ở bài Sidebar Menu

Sau đó mình cho vào một ImageView và chỉnh background của layout tổng về màu trắng và có được một activity với layout đơn giản . như sau

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="40dp"
    android:paddingRight="40dp"
    android:paddingTop="40dp"
    android:paddingBottom="40dp"
    android:background="#FFFFFF"
    tools:context="com.example.hello.createscreenshotexample.SplashScreenActivity">
      <ImageView
        android:layout_centerVertical="true"
        android:layout_width="400dp"
        android:layout_height="300dp"
        android:background="@drawable/cloud"/>
</RelativeLayout>

Phần dưới nhìn thì ok rồi , nhưng mà layout vẫn còn bị cái thanh ActionBar ở trên làm xấu đi cái layout phải không ? Giờ mình cho nó đi luôn nhé ^_^

Các bạn vào style.xml

Các bạn chú ý theme hiện tại các bạn đang xài

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
</style>

Hiện tại theme của mình là Theme.AppCompat.Light.DarkActionBar

Các bạn thêm một thẻ style ở dưới với nội dung như sau

<style name="NoActionBar" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="android:windowActionBar">true</item>
    <item name="android:windowNoTitle">true</item>
</style>

Đặt name nó là NoActionBar và có parent giống như là theme các bạn đang xài

Và chú ý 2 hàng item dưới là để disable ActionBar

Sau đó các bạn lưu lại file style.xml

Các bạn mở file AndroidManifest.xml

Tìm đến Activity splash screen của các bạn và chỉnh lại như sau .

<activity android:name=".SplashScreenActivity" android:theme="@style/NoActionBar" >

</activity>

Các bạn chú ý NoActionBar chính là thuộc tính vừa thêm của các bạn bên style.xml

Vậy là ok xong bước bỏ đi thanh ActionBar rồi đấy .

Sau đó các bạn chỉnh cho Activity Splash Screen là MAIN LAUNCHER cho app của các bạn bằng cách

<activity android:name=".SplashScreenActivity" android:theme="@style/NoActionBar" >
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />

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

Cho intent-filter vào , nếu các bạn có activity main chứa thuộc tính intent-filter như vậy thì các bạn chỉ việc cut 2 dòng đó xuống activity splash screen là ok .

Và đây là kết quả ^_^

Bước cuối cùng: các bạn vào file class của Acitivty Splash screen này

Các bạn

import android.os.Handler;

trên đầu

Sau đó khai báo 1 biến global variable giống như dưới đây :

private static final long SPLASH_TIME_OUT = 3000;

Vào hàm onCreate() các bạn viết một hàm đơn giản dưới đây :

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

    @Override
    public void run() { 

        Intent i = new Intent(SplashScreenActivity.this, MainActivity.class);
        startActivity(i);

        // close this activity
        finish();
    }
}, SPLASH_TIME_OUT);

Mình xin giải thích hàm này là hàm sẽ delay 1 khoảng thời gian SPLASH_TIME_OUT được tính là 3000 mili giây. Hàm này chính là áp dụng cơ chế Threading Runnable trong JAVA . Các bạn có thể tham khảo sâu hơn trong lập trình đa luồng Multi Threading trên google ( Nếu có cơ hội mình cũng sẽ viết 1 bài nói về chủ đề này ^_^ ).

Ngoài ra , các bạn có thể kết hợp với AsyncTask để chạy những process nặng trong background trong khoảng thời gian mà splash screen đang load .

Còn Intent hay finish() thì có lẽ đã quá quen với các bạn rồi nhỉ .

Trỏ từ activity splash screen này tới MainActivity nào đó của các bạn .

Như vậy là đã xong mọt splash screen rồi đấy ^_^

//------------------------------------------------------------------------------

VuTNQ ^_^