Kotlin ile Android Studio’da Splash Screen Ekleme

Merhaba arkadaşlar, Medium’daki ilk yazımda sizlere kısa ve öz şekilde Android uygulamalarımıza nasıl Splash Screen ekleyebileceğimizi anlatmaya çalışacağım.

Splash Screen, genellikle uygulama açıldığında karşımıza çıkan ilk ​​ekrandır ve bu ekranda çoğunlukla uygulamayı tanıtan bir resim, şirket logosu veya reklam içerikli görsel ya da yazılar 1–2 saniye boyunca gösterilir. Bu kısa süreli gösterimden sonra uygulama esas akışıyla devam eder.

Uygulamamıza Splash Screen ekleyebilmek için MainActivity dışında bir activity’ye daha ihtiyacımız var. Bu yüzden yeni bir EmptyActivity oluşturup isimlendiriyoruz ve “Generate a Layout File” kutucuğunu da işaretliyoruz çünkü ekran tasarımı da yapacağız. Projelerde tüm dosya ve variable’ları kullanış amaçlarına göre isimlendirmemiz iyi bir alışkanlık olacağı için yeni activity’yi SplashActivity olarak isimlendirmek daha doğru olacaktır.

Şimdi ekranımızı tasarlamaya örnek bir logo ekleyerek başlayabiliriz. Bunun için File →New → Vector Asset yolunu izleyerek Local File’ı seçersek kendi dosyalarımızdan .svg uzantılı bir dosya seçebiliriz. Bitmapler yerine vektör çizimleri kullanmak daha iyi bir tercih olacaktır çünkü aynı dosya, görüntü kalitesinde kayıp olmaksızın farklı ekran yoğunlukları için yeniden boyutlandırılabilir ve APK’nızın boyutunu azaltır.

Ben örnek olarak E-spor organizasyonu olan Team Liquid’in logosunu seçtim. Dosyayı seçtikten sonra ilerlersek logomuzun drawable dosyası oluşturulmuş olacak.

Logo eklemek için, File → New → Vector Asset

Logomuzu yükledikten sonra SplashActivity’mizin tasarımını özelleştirmek için res → layout klasöründen activity_splash.xml dosyasını açıp, logomuzu gösterebileceğimiz bir ImageView ekliyoruz ve background’ına logomuzu veriyoruz.

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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"
    android:background="#FFFFCD"
    tools:context=".SplashActivity">

    <ImageView
        android:id="@+id/team_liquid_iv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/ic_team_liquid"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent">

    </ImageView>

</androidx.constraintlayout.widget.ConstraintLayout>

Daha sonra, ekranımızın temasını özelleştirmek için res → values → themes klasöründeki themes.xml dosyasına aşağıdaki style tag’ini ekliyoruz. Logomuzun gözükeceği karşılama ekranında Action Bar olmasını istemediğimiz için ona göre düzenliyoruz.

<style name="splashScreenTheme" parent="Theme.AppCompat.DayNight.NoActionBar"/>

Tasarım kısmını bitirdik, şimdi SplashActivity’yi “LAUNCHER” activity yapmak ve tasarladığımız temayı eklemek için AndroidManifest.xml dosyasında gerekli düzenlemeleri yapıyoruz.

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

    <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/Theme.SplashScreen">
        <activity
            android:name=".SplashActivity"
            android:theme="@style/splashScreenTheme"
            android:exported="true" >

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

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

        <activity
            android:name=".MainActivity"
            android:exported="true">

        </activity>
    </application>
</manifest>

Son olarak SplashActivity.kt dosyasında View classının özelliklerini kullanarak logomuzun ImageView componentine animasyon ekliyoruz ve çıkış aksiyonu olarak da Intent kullanarak MainActivity’yi başlatıyoruz.

Burada setDuration() metodunun içine milisaniye cinsinden animasyonun yani Splash Screen’in kaç saniye süreceğini söylemiş oluyoruz.

overridePendingTransition() ile giriş ve çıkış animasyonlarımızı vermiş oluyoruz.

finish() ile MainActivity’den SplashActivity’ye geri dönmeyi engellemiş oluyoruz.

package com.example.splashscreen

import android.content.Intent
import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import com.example.splashscreen.databinding.ActivitySplashBinding

class SplashActivity : AppCompatActivity() {

    private lateinit var binding: ActivitySplashBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = ActivitySplashBinding.inflate(layoutInflater)
        setContentView(binding.root)

        binding.apply {
            teamLiquidIv.alpha = 0f
            teamLiquidIv.animate().setDuration(1500).alpha(1f).withEndAction{
                val intent = Intent(this@SplashActivity, MainActivity::class.java)
                startActivity(intent)
                overridePendingTransition(android.R.anim.fade_in, android.R.anim.fade_out)
                finish()
            }
        }
    }
}

Bu örnek projede layout dosyalarındaki componentleri bulmak için ViewBinding kullandım.

Ve böylece uygulamayı tamamlamış olduk. Örnek olması açısından da uygulamanın ekran kaydını aşağıya ekliyorum.

Umarım faydalı ve açıklayacı bir yazı olmuştur.