Sunday 9 June 2019

Tutorial Belajar Android : Cara Membuat Splash Screen di Android Studio

Cara Membuat Splash Screen di Android 3.3.2

Splash Screen merupakan tampilan pembuka saat aplikasi android di jalankan, jadi Splash Screen ini akan  pertama kali muncul pada layar smartphone kita sebelum kita masuk ke menu utama atau halaman login. Kegunaan Splash Screen umum nya untuk menampilkan informasi berupa nama aplikasi dan logo perusahaan dari aplikasi yang dibuat agar terlihat menarik dan profesional atau sebagai halaman tunggu untuk proses data hingga semua proses selesai di load.



Sekarang kita akan mulai cara membuat Splash Screen.

1. langkah pertama buat project baru dengan meng klik Start a new Android Studio project.



2. Pilih Empty Activity dan Next



3. Pada kolom Name isi dengan MySplashScreen atau boleh apa saja berdasarkan keinginan pembuat aplikasi. Pada bagian Minimum API level adalah sebagai batasan aplikasi yang akan dibuat nantinya akan berjalan dengan minimum level API (versi android) berapa. Dan setelah itu klik Finish.


4. 1.    Pada MainActivity.java tulis code seperti ini

package com.example.mysplashscreen;

import android.content.Intent;
import android.os.Bundle;
import android.os.Handler;
import android.support.annotation.Nullable;
import android.support.v7.app.AppCompatActivity;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.ImageView;

public class MainActivity extends AppCompatActivity {

    private ImageView splashImage;
    private static int splashTimeOut=5000;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        splashImage=(ImageView)findViewById(R.id.splash_id);


        new Handler().postDelayed(new Runnable() {
            @Override
            public void run() {
                Intent i = new Intent(MainActivity.this,Main2Activity.class);
                startActivity(i);
                finish();
            }
        },splashTimeOut);


        Animation splashAnimation = AnimationUtils.loadAnimation(this,R.anim.splashanimation);
        splashImage.startAnimation(splashAnimation);
    }
}

5. Membuat new empty Activity , disini saya menamakan secara default Main2Activity dan akan terbentuk file xml nya di res – layout dengan nama  activity_main2.xml .

6. Pada bagian res – layout – activity_main.xml , tuliskan code seperti ini

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity"
    android:background="@color/splashground">

    <ImageView
        android:id="@+id/splash_id"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:src="@mipmap/splash_screen2" />

</android.support.constraint.ConstraintLayout>

7. Selanjut nya pada bagian res – layout – activity_main2.xml , tuliskan code seperti ini

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".Main2Activity">


    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Selamat Datang !"
        android:textSize="40dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>

8.  Di folder res klik kanan – new – Android Resource Directory , pilih Resource type dan Directory name menjadi anim.




9. Buat file baru di folder anim, klik kanan (di folder anim) – new – Animation Resource File. Isi File name dengan nama splashanimation dan ketikan kode  berikut.


<?xml version="1.0" encoding="utf-8"?>
<alpha
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromAlpha="0.0"
    android:toAlpha="1.0"
    android:duration="3000">
</alpha>

10. Copy gambar (image) yang ingin di jadikan sebagai splash screen di folder res – mipmap dengan cara klik kanan (di folder mipmap) paste.




11.  Pada file colors.xml tambahkan code berikut
 <color name="splashground">#bfbdbe</color>

12. Di bagian androidManifest.xml tambahkan code berikut android:theme="@style/AppTheme.NoActionBar"  dibawah android:name=".Main2Activity"
 Hasil nya akan menjadi seperti ini :
<activity
     android:name=".Main2Activity"
     android:theme="@style/AppTheme.NoActionBar">
</activity>

13. Di bagian grandle tambahkan  dependencies  seperti ini  
implementation 'com.android.support:design:28.0.0'


No comments:

Post a Comment