Membuat Splash Screen pada Aplikasi Android

Diposting pada 24th May 2020

Splash Screen merupakan bagian kecil dari activity yang biasa ada di aplikasi. Splash Screen ini menampilkan sebuah tampilan singkat saat aplikasi pertama kali dijalankan yang memvisualisasikan brand, motto, atau elemen-elemen lain yang merepresentasikan aplikasi tersebut. Hampir semua aplikasi di Android menampilkan Splash Screen mulai dari Whatsapp, Youtube, Gojek, Facebook, hingga Instagram dan hanya sebagian kecil yang tidak menyajikan Splash Screen yang pastinya mereka memiliki pertimbangan tertentu kenapa perlu melewatkannya. Pada tutorial ini, saya akan memberikan contoh menggunakan brand dan motto yang saya buat sendiri, bagi yang mengikuti tutorial ini bisa memakai logo atau assetnya sendiri. Berikut langkah yang bisa ditempuh untuk membuat Splash Screen tersebut.

1 Buat Project Baru di Android Studio

 Buat project Android baru di Android Studio dengan pilih menu File - New - New Project.
 Pilih Empty Activity. Maka secara otomatis akan ada beberapa file yang akan ter-generate setelahnya yaitu class MainActivity, activity_main.xml, AndroidManifest.xml, dan juga build.gradle.


2 Mengatur Layout

Setiap project Android pasti akan memiliki beberapa komponen berikut:

 AndroidManifest.xml - komponen untuk mendeklarasikan nama paket aplikasi, fitur hardware dan software yang diperlukan aplikasi, komponen aplikasi (meliputi activity, service, receiver, serta provider), dan izin yang diperlukan aplikasi untuk mengakses bagian sistem atau aplikasi lain yang dilindungi.
 Package Android - bagian ini lebih mirip seperti direktori (folder) untuk menampung source code atau juga untuk memisahkan satu kode dengan kode-kode lainnya sesuai dengan peruntukannya, sebagai contoh com.mapping.likuapp.ui dan com.mapping.likuapp.data.
Layout - resource ini akan menampung seluruh file xml project yang dipakai sebagai layout aplikasi. Pada komponen ini pula kita akan mengatur layout dari Splash Screen yang akan kita buat.
 Drawable dan Mipmap - ini resource lain yang khusus menampung seluruh file image bedanya pada mipmap khusus untuk menampung ikon app/launcher. Untuk menyajikan aplikasi yang konsisten untuk digunakan diberbagai perangkat android sudah sepatutnya kita menyiapkan beberapa file image yang sama dengan densitas (dpi - dots per inch) yang berbeda. Diantaranya ada ldpi (~120 dpi), mdpi (~160 dpi), hdpi (~240 dpi), xhdpi (~320 dpi), xxhdpi (~480 dpi), dan xxxhdpi (~640 hdpi).
 Values - pada resource ini terdiri dari colors.xml, strings.xml, dan styles.xml. Untuk colors.xml sesuai penamaannya digunakan untuk mendeklarasikan sekumpulan warna agar ketika dipakai ulang di layout atau elemen yang lain pada aplikasi kita tidak lagi perlu mendefinisikan ulang nilainya, cukup dengan memanggil nama variabelnya saja. Sedangkan pada strings.xml sesuai namanya khusus untuk mengcover string. Kemudian styles.xml untuk tema aplikasi, di dalamnya kita bisa mengatur app bar (action bar), font family, windowActivityTransition, colorPrimary, dan lain-lain seputar tema aplikasi. Kita juga bisa membuat banyak tema di dalam 1 file styles.xml tersebut mengingat dalam aplikasi yang kompleks biasanya membutuhkan banyak tema di dalamnya.

Pada bagian layout ini, atur activity_main.xml menggunakan RelativeLayout agar kita menempatkan setiap widgetnya sebagai layer. Pada contoh kali ini, saya akan menempatkan brand aplikasi disertai motto di bawahnya pada Splash Screen. Buat yang mengikuti tutorial ini, bisa menyesuaikan tampilkan dengan selera masing-masing dan tidak harus sama dengan yang ada di tutorial ini. Sedikit penjelasan pada kode xml di bawah ini, pada orientasi RelativeLayout saya tentukan vertical agar screen UI hanya bisa ditampilkan ke mode vertikal, kemudian pada ImageView saya atur layout_width ke match_parent agar lebar gambar brand aplikasi seukuran dengan lebar layar device, kemudian saya tambahkan parameter layout_below 






    

    

    



package com.mapping.likuapp;

import android.app.ActivityOptions;
import android.content.Context;
import android.content.DialogInterface;
import android.content.Intent;
import android.content.SharedPreferences;
import android.os.Bundle;
import android.os.Handler;
import android.util.Pair;
import android.view.View;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.TextView;
import android.widget.Toast;

import androidx.appcompat.app.AlertDialog;
import androidx.appcompat.app.AppCompatActivity;

import com.mapping.likuapp.Model.UpdateHelper;

public class SplashScreen extends AppCompatActivity {

    private RelativeLayout splash_relative_layout;
    private ImageView app_logo;
    private TextView app_desc;

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

        splash_relative_layout = (RelativeLayout) findViewById(R.id.RL);
        app_logo = (ImageView) findViewById(R.id.app_logo);
        app_desc = (TextView) findViewById(R.id.app_desc);

        new Handler().postDelayed(new Runnable() {
            @Override
            public void run() {
                Intent shared_intent = new Intent(SplashScreen.this, MainActivity.class);
                startActivity(shared_intent);

                finish();
            }
        }, 500);
    }

}