[Android/Kotlin] Lottie Splash

今日はアプリケーションの開発に欠かせないSplash画面を開発しました.
一般の人から見れば、スクリーンをロードすることはアプリケーションを開くロード時間ですが、アプリケーションや会社のブランドを宣伝する非常に効果的な宣伝方法とも言えます.
本当はSplash画面をシンプルにしたかったんだけど、効果をあげてキレイにしたほうがいいんじゃないかな?Lottie公式サイトにアクセスして開発用途について詳しく説明したので、とても作りやすいです.
ここでは、このLottieアニメーションを使用してロード画面を作成する方法について説明します.
Lottie Animation無料ダウンロード:https://lottiefiles.com/featured
Lottie-Android公式ブログ:https://lottiefiles.com/blog/working-with-lottie

🎨 Lottie jsonファイルのダウンロード

📑 resフォルダにrawフォルダを作成しjsonファイルを挿入

resフォルダを右クリックし、New->Android Resource Directory->rawフォルダの作成を入力します.
次に、ダウンロードしたjsonファイルをドラッグしてrawフォルダに入れます.

📌 プロジェクトの設定

まず、Lottieを使用する前に構築します.gradle(:app)に入って設定する必要があります.
現在の最新バージョンは5.3.3です.(作成日2022.03.23)
dependencies {

  implementation 'com.airbnb.android:lottie:5.0.3'

}

🌞 activity_splash.xml

必要に応じてxmlを構成します.TextViewとImageView,LottieAnimationViewを選びました.

    <TextView
        android:id="@+id/introtext"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="AI와 함께하는"
        android:textSize="18sp"
        android:textColor="@color/black"
        android:fontFamily="@font/bazzi"
        android:layout_marginTop="150dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"/>

    <ImageView
        android:id="@+id/logo"
        android:layout_width="75dp"
        android:layout_height="75dp"
        android:layout_marginTop="10dp"
        android:layout_marginEnd="5dp"
        app:layout_constraintTop_toBottomOf="@+id/introtext"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:srcCompat="@drawable/shiritori" />

    <com.airbnb.lottie.LottieAnimationView
        android:id="@+id/animationView"
        android:layout_width="wrap_content"
        android:layout_height="200dp"
        android:layout_marginTop="300dp"
        app:layout_constraintTop_toBottomOf="@+id/logo"
        app:layout_constraintBottom_toTopOf="@+id/introteam"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:lottie_autoPlay="true"
        app:lottie_loop="true"
        app:lottie_rawRes="@raw/loading_lottie" />

    <TextView
        android:id="@+id/introteam"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Github: sinbee0402"
        android:textSize="12sp"
        android:textColor="#939393"
        android:fontFamily="@font/bazzi"
        android:layout_marginBottom="10dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"/>

🌚 SplashActivity.kt

SplashActivity画面の特定の期間をHandlerで表示します.
3秒のSplash画面を見せた後にMainActivityで表現しましたSplash画面はアプリを開いた時に一度!表示される画面なのでfinish()を使用して必ず閉じてください.

package com.example.shiritori

import android.content.Intent
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.os.Handler

class SplashActivity : AppCompatActivity() {

    private val SPLASH_TIME_OUT: Long = 3000  //3 sec

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_splash)

        Handler().postDelayed({  //3초(SPLASH_TIME_OUT)가 지나면 이 메서드가 실행됨

            //main activity 시작
            startActivity(Intent(this, MainActivity::class.java))

            //액티비티 닫기
            finish()
        }, SPLASH_TIME_OUT)
    }

    override fun onBackPressed() {
        super.onBackPressed()
    }
}

⭐ AndroidManifest.xml

Android Manifestの <intent-filter>をSplashActivityとして指定し、アプリケーションを開いたときにSplashActivityを初めて実行します.MainActivityに存在する<intent-filter>をSplashActivityに移動します.
最後に、通常のSplash画面では、動作Barが見えないため、Theme.AppCompat.NoActionBarを使用して動作Barを除去する.

<application>
        <activity
            android:name=".SplashActivity"
            android:theme="@style/Theme.AppCompat.NoActionBar">

            <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>

🌠 位置決め完了後。

現在作成中のアプリケーションは接話尾アプリケーションであり,初心者の開発が可能な簡単な(広義の)人工知能を用いて作成されている.
今日初めてラベルを書きましたが、これからもこのプロジェクトを通じてラベルを書き続けたいと思います.
注意:https://velog.io/@tlsgks 48/Kotlin-スクリーンをロード-Splash-featを作成-Lottie