Skip to main content

Membuat Splash Screen dengan Mudah di Android Studio

Tutorial kali ini kita akan membuat splash screen menggunakan android studio dengan mudah. Splash screen merupakan tampilan yang muncul saat pertama kali kita membuka sebuah aplikasi. Splash screen biasanya menampilkan logo, nama, dan lainnya yang berhubungan dengan aplikasi. Beberapa aplikasi yang menggunakan splash screen antara lain : facebook, youtube, dan blackberry mesenger.

 

Jika kamu ingin belajar android dari awal bisa belajar melalui tautan berikut.

Tutorial Lengkap Belajar Android untuk Pemula dengan Android Studio

Langsung saja ikuti langkah-langkah berikut untuk membuat splash screen. 

1. Buat project baru di  android studio 

Buat project baru pada android studio, berikan nama splashscreen dengan activity empty.

 

 

2. MainActivity.java

Pada Mainactivity.java ketikan kode-kode dibawah ini

package badoystudio.com.splashscreen;

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

    @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. Bila pada intent home.class merah / error biarkan saja itu disebabkan karena kita belum membuat activity home.

Tambahkan gambar pendukung (logo atau background) pada drawable untuk ditampilkan di splashscreen :

  • klik kanan pada drawable 
  • show in explorer
  • copykan gambar ke folder drawable 

 

3. Activity_Main.xml

Pada activity_main.xml ketikan kode-kode xml dibawah ini :

<?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="@drawable/red"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="badoystudio.com.splashscreen.MainActivity">

   <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/logo"
        android:src="@drawable/logo"
        android:layout_centerVertical="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true" />

    <ProgressBar
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:progressTint="@color/colorPrimary"
        android:id="@+id/progressBar"
        android:layout_below="@+id/logo"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="31dp" />

</RelativeLayout>

 

pada <relativelayout terdapat  android:background=”@drawable/red” (gambar yang dijadikan background) dan <ImageView android:src=”@drawable/logo” (logo).

4. Activity_home

Buat sebuah activity baru seperti gambar dibawah dengan cara klik kanan pada nama package lalu :

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

membuat splash screen

 

5. Activity_home.xml

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:paddingBottom="@dimen/activity_vertical_margin"
 android:paddingLeft="@dimen/activity_horizontal_margin"
 android:paddingRight="@dimen/activity_horizontal_margin"
 android:paddingTop="@dimen/activity_vertical_margin"
 tools:context="badoystudio.com.splashscreen.home">

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

</RelativeLayout>

 

6. Styles.xml

buka styles.xml pada values, kemudian tambahkan 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">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

    <style name="second" 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>


</resources>

7. 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.splashscreen">

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        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>
        <activity
            android:name=".home"
            android:label="@string/home"
            android:theme="@style/second"></activity>
    </application>

</manifest>

 

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

membuat splash screen
tampilan splash screen
membuat splash screen
activity home akan tampil setelah splash screen

Walaupun banyak aplikasi yang tidak menggunakan splash screen dengan berbagai alasan. Namun tidak ada salahnya kita mencoba membuatnya untuk belajar saja.

Selamat mencoba, semoga bermanfaat. Jangan lupa untuk dishare 😀