Membuat SplashScreen, Loading Layar Utama di Aplikasi Android Dengan Android Studio


Ngulik Kode - Splash Screen adalah tampilan loading pertama kali ketika aplikasi android dibuka/dijalankan, agar terlihat lebih menarik dan terkesan profesional. Pada umumnya Splash Screen ini dibuat untuk menunjukan logo perusahaan atau logo dari aplikasi yang dibuat.

Saya akan memulai untuk menunjukan cara memasang Splash Screen pada aplikasi android.

Saya menggunakan aplikasi Android Studio 1.4 sebagai IDEnya, selain menggunakan versi 1.4 anda juga bisa menggunakan versi yang lama 1.0, tapi lebih baik anda update terlebih dahulu agar kinerja dari aplikasi tersebut bisa berjalan dengan lancar.

Siapkan gambar dengan ukuran Lebar 480 pixels dan Panjang 800 pixels dengan format JPG/JPEG, saya kasih contoh seperti gambar di bawah ini.


Pada tutorial kali ini, pastikan anda sudah membaca tutorial sebelumnya Membuat Project Baru dan Menjalankan Project di Android Studio untuk pembelajaran dasarnya, karena pada kali ini kita akan langsung menuju ke pembuatan programnya.
Yang kita butuhkan untuk memasang Splash Screen pada aplikasi android adalah
1 Buah file JAVA dengan di beri nama splashscreen.java
1 Buah Activity Layout dengan di beri nama splashscreen.xml
dan sedikit setingan di file AndroidManifest.xml

Berikut ini codingannya :

spalashscreen.java
package com.ngulikode.olin.splashscreen;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.os.Handler;
import android.view.Window;
import android.view.WindowManager;

public class splashscreen extends Activity {
   
  //Set waktu lama splashscreen
  private static int splashInterval = 2000;
   
  @Override
  protected void onCreate(Bundle savedInstanceState) {
   super.onCreate(savedInstanceState);
   requestWindowFeature(Window.FEATURE_NO_TITLE);
   getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
     WindowManager.LayoutParams.FLAG_FULLSCREEN);       
   
   setContentView(R.layout.splashscreen);
    
   new Handler().postDelayed(new Runnable() {
     
     
    @Override
    public void run() {
     // TODO Auto-generated method stub
     Intent i = new Intent(splashscreen.this, MainActivity.class);
     startActivity(i);
     
      
                                 //jeda selesai Splashscreen
     this.finish();
        }

 private void finish() {
  // TODO Auto-generated method stub
  
 }
     }, splashInterval);
     
   };
     
  }

Perhatikan pada script package com.ngulikode.olin.splashscreen; ganti dengan packege yang anda buat.

Lalu buat lagi file baru dengan nama dan format seperti dibawah
splashscreen.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:ads="http://schemas.android.com/apk/res-auto">

    <ImageView
        android:src="@drawable/splash2"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:scaleType="fitXY"/>

    <ProgressBar
        android:id="@+id/progressBar1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="58dp" />
</RelativeLayout>
Lalu edit file Android Manifest.xml menjadi seperti script dibawah ini
Android Manifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.panelic.ngulikkode" >
    <uses-permission android:name="android.permission.INTERNET"/>
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:supportsRtl="true"
        android:theme="@style/AppTheme" >
        <!-- Splash screen -->
        <activity
            android:name=".splashscreen"
            android:label="Ngulik Kode"
            android:screenOrientation="portrait"
            android:noHistory="true" >


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

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

        <!-- Main activity -->
        <activity
            android:name=".MainActivity"
            android:screenOrientation="portrait"
            android:label="@string/app_name" >
        </activity>

        <!--memasukan elemen Activity dengan atribut configChanges dan theme-->
        <activity android:name="com.google.android.gms.ads.AdActivity"
            android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|uiMode|screenSize|smallestScreenSize"
            android:theme="@android:style/Theme.Translucent" />
    </application>

</manifest>
Terimakasih sudah berkunjung ke blog saya


Sekian tutorial dari saya semoga dapat bermanfaat untuk anda.

9 komentar

  1. error pada android manifest nya mas , gimana nge fix nya ya
    error pada bagian
    android:name="com.google.android.gms.ads.AdActivity"
    android:value="@integer/google_play_services_version"

    BalasHapus
    Balasan
    1. Ups, maaf mas hapus saja kode tersebut. itu kode untuk menambahkan iklan pada aplikasi.

      Terimakasih sudah di koreksi dan terimakasih juga sudah berkunjung :)

      Hapus
  2. Gan masukin gambarnya gmn, buat jd kode kali gambarnya?

    BalasHapus
    Balasan
    1. Gambar di masukin pada direktori Drawable, klo untuk pemanggilannya di bagian layout-nya, file splash tren.xml

      Hapus
  3. gan klo error bagian setContentView(R.layout.activity_splash);
    R jadi warna merah setelah saya run
    gmn cranya ya?

    BalasHapus
  4. gan klo error bagian setContentView(R.layout.activity_splash);
    R jadi warna merah setelah saya run
    gmn cranya ya?

    BalasHapus
    Balasan
    1. Buat file xml baru dengan nama "activity_class.xml"t tanpa petik

      Hapus
  5. Terimakasih ^_^ sangat membantu sekali

    BalasHapus


EmoticonEmoticon