CARA MEMBUAT SPLASH DI ANDROID

Jakarta, 10 April 2019

CARA MEMBUAT SPLASH DI ANDROID

Apakah pernah melihat icon sewaktu membuka aplikasi android? nah itulah yang di sebut sebagai splash. Di sini kita akan belajar cara membuat splash. Untuk mempermudah, di sini akan kita gunakan logo dari gojek (logo / icon bisa di sesuaikan keinginan)
1. Buat Project Baru

Buka android studio dan create new project. Kemudian bisa ikuti seperti di bawah ini :

• Aplication name : splashscreengojek
• phone and tablet : API 22 (disesuaikan)
• Activity : empty
• activity name : activity_main

2. Atur layout

Selanjutnya atur layout splash screennya pada activity_main.xml. Untuk logonya sendiri pada tutorial cara membuat splash screen pada android studio ini menggunakan logo dari aplikasi gojek (atau bisa di sesuaikan keinginan). Bisa di download disini.

Jika sudah didownload masukan logo atau gambar yang ingin digunakan pada drawable dengan cara :

• klik kanan pada drawable 

• show in explorer

• copykan gambar ke folder drawable 

Lalu ketikan  kode-kode dibawah ini pada activity_main.xml.

?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:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFF"
android:gravity="center"
tools:context=".MainActivity">

<ImageView
android:layout_width="160dp"
android:layout_height="60dp"
android:id="@+id/logo"
android:src="@drawable/logogojek" //mengikuti nama file
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />

</RelativeLayout>

Pada kode-kode di atas kita bisa melihat layout yang digunakan adalah relative layout dengan ditambahkan satu widget imageview untuk menampilkan gambar.

3. Atur style

Pada styles.xml yang berada pada folder res kita akan menghilangkan app bar (action bar) dan mengganti warna primarynya dengan warna putih. Silahkan masukan kode-kode dibawah ini.

<resources>

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

</resources>

4. Buat Activity_home

Splash screen yang dibuat pada tutorial ini hanya akan tampil selama 4 detik (lama loading bisa di tentukan) setelah itu akan langsung ditampilkan menu utama dari aplikasi android yang sudah diberi splash screen.

Buat activity baru dengan nama activity_home dengan cara klik kanan pada nama package lalu :

• pilih new
• activity –> empty activity
• beri nama home (activity_home)

Tambahkan kode-kode dibawah ini pada activity_home.xml :

<?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:id="@+id/activity_home"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="30dp"

    tools:context=".home">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="halo ini adalah tutorial splash screen "
        android:textSize="30sp"/>

</RelativeLayout>

5. Masukan Kode di MainActivity.java

Buka MainActivity.java lalu tambahkan kode-kode java berikut.

package badoystudio.com.splashscreengojek;

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

public class MainActivity extends AppCompatActivity {
    private int waktu_loading=4000;

    //4000=4 detik. Ini adalah lama loading

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);


        setContentView(R.layout.activity_main);
        new Handler().postDelayed(new Runnable() {
            @Override
            public void run() {

                //setelah loading maka akan langsung berpindah ke home activity
                Intent home=new Intent(MainActivity.this, home.class);
                startActivity(home);
                finish();

            }
        },waktu_loading);
    }
}

Perhatikan kode di atas waktu_loading=4000 yaitu splash screen nantinya hanya akan muncul selama 4 detik saja kemudian langsung pindah ke activity yang lain. Silakan di edit sesuai keinginan.

6. AndroidManifests.xml

Terakhir tambahkan script dibawah ini pada AndroidManifest.xml yang ada pada manifest

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="badoystudio.com.splashscreengojek">

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

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

</manifest>

Ditutorial cara membuat splash screen pada android studio ini penulis masih menjadikan mainactivity untuk splash screennya. Sehingga tidak ada yang diubah pada android manifestnya (defaultnya seperti kode-kode di atas).

8. Running Aplikasi

Running aplikasi bisa menggunakan android virtual device, emulator genymotion, atau langsung ke smartphone yang kamu miliki. Maka akan tampil seperti dibawah ini :

 

Demikian turtorial cara membuat splash di android. Silahkan praktekan dan modifikasi sesuai kebutuhan aplikasi android yang sedang kamu buat. 

Semoga bermanfaat.