Cara Membuat Splash Screen Animasi dari Lottie

Cara Membuat Splash Screen Animasi dari Lottie. Hampir sama dengan artikel sebelumnya mengenai Cara Membuat Splash Screen Animasi – Android Studio Tutorial namun kali ini kita akan memanfaatkan langsung library dari Lottie secara langsung dan ternyata baru saya coba hasilnya lebih keren Lho 🙂

Untuk cara membuatnya juga tidak akan jauh berbeda. Bahkan klo yang ini malah lebih gampang sih menurut saya.

1. Buat Project Baru
-Buka aplikasi Android Studio
-Pilih Start a New Android Studio Project
-Pilih Empty Activity > Next
-Name : (bisa diisi sesuka temen2)
-Languange : Java
-Minimum SDK : API 17
-Finish

2. Pada build.gradle (Project: ….. )
Tambahkan kode berikut  dan letakkan seperti contoh dibawah ini:

allprojects {
      repositories {
         ...
         ...
         maven { url "https://jitpack.io" }

      }
  }

3. Pada build.grandle (Module)

tambahkan library berikut dan letakkan seperti contoh di bawah

dependencies {
    ...
    ...
     implementation 'com.airbnb.android:lottie:3.4.4'
}

4. Buat Layout Baru (Klo dengan cara di bawah ini maka akan otomatis membuat file javanya)
Buat dengan cara
-Klik kanan pada App > New > Activity > Empty Activity

Isi seperti contoh di bawah ini:

Pilih Finish

5. Tambahkan folder Raw
Klik kanan pada App > New > Folder > Raw Folder

Pilih Finish

6. Buka website https://lottiefiles.com/

Pilih dan download animasi yang diinginkan (file dalam bentuk .json)

Lalu copy dan pastekan file animasi tadi (dalam format .json) ke dalam Folder Raw di Android Studio

7. Pada activity_splash_screen.xml

Tambahkan kode berikut:

<com.airbnb.lottie.LottieAnimationView
android:id="@+id/animationView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:lottie_rawRes="@raw/loading"
app:lottie_autoPlay="true"
android:layout_centerVertical="true"
app:lottie_loop="true"/>

sehingga akan menjadi seperti ini

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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=".SplashScreen">

    <com.airbnb.lottie.LottieAnimationView
        android:id="@+id/animationView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:lottie_rawRes="@raw/loading"
        app:lottie_autoPlay="true"
        android:layout_centerVertical="true"
        app:lottie_loop="true"/>

</RelativeLayout>

jangan lupa ganti tulisan loading dengan nama file .json animasi agan.
8. Pada SplashScreen.java

Tambahkan kode

final Handler handler = new Handler();
handler.postDelayed(new Runnable() {
    @Override
    public void run() {
        startActivity(new Intent(getApplicationContext(), MainActivity.class));
        finish();
    }
}, 3000L); //3000 L = 3 detik

sehingga kodenya akan menjadi seperti ini

package com.splashscreenanimasi.app;

import androidx.appcompat.app.AppCompatActivity;

import android.content.Intent;
import android.os.Bundle;
import android.os.Handler;

public class SplashScreen extends AppCompatActivity {

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

        final Handler handler = new Handler();
        handler.postDelayed(new Runnable() {
            @Override
            public void run() {
                startActivity(new Intent(getApplicationContext(), MainActivity.class));
                finish();
            }
        }, 3000L); //3000 L = 3 detik
    }
}

8. Pada AndroidManifest.xml

Rubah kodenya menjadi seperti ini:

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

<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=".SplashScreen">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />

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

</manifest>

9. Selesai dan coba run aplikasi