Başlangıç ekranları

Android 12'den itibaren SplashScreen API, uygulamaların animasyonla başlatılmasına olanak tanır. Bu animasyonda, açılışta uygulamaya giriş hareketi, uygulama simgenizi gösteren bir başlangıç ekranı ve uygulamanızın kendisine geçiş yer alır. SplashScreen, Window ve bu nedenle de Activity.

Başlangıç ekranı deneyimi, her uygulama lansmanına standart tasarım öğeleri getirir ancak uygulamanızın benzersiz marka kimliğini koruyabilmesi için özelleştirilebilir.

SplashScreen platform API'sini kullanmanın yanı sıra SplashScreen API'sini sarmalayan SplashScreen uyumluluk kitaplığını da kullanabilirsiniz.

Başlangıç ekranının işleyiş şekli

Kullanıcı, uygulamanın işlemi çalışmıyorken bir uygulamayı başlatırsa (soğuk başlat) yoksa Activity değeri değil (hazır başlangıç), aşağıdaki olaylar gerçekleşir:

1. Sistem, başlangıç ekranını göstermek istediğiniz temaları ve animasyonları kullanarak tanımlar.

2. Uygulama hazır olduğunda açılış ekranı kapatılır ve uygulama gösterilir.

Açılış ekranı hazır başlatma:

Başlangıç ekranındaki öğeler ve mekanikler

Açılış ekranının öğeleri, Android manifest dosyasında XML kaynak dosyalarıyla tanımlanır. Her öğenin açık ve koyu mod sürümleri vardır.

Başlangıç ekranının özelleştirilebilir öğeleri; uygulama simgesi, simge arka plan ve pencere arka planı:

Şekil 2'de gösterilen aşağıdaki öğeleri göz önünde bulundurun:

1 Uygulama simgesi, çekilebilir bir vektör olmalıdır. Statik veya animasyonlu olabilir. Animasyonlar sınırsız uzunlukta olabilir ancak 1.000 milisaniyeyi aşmamasını öneririz. Başlatıcı simgesi varsayılandır.

2 Simge arka planı aşağıdaki durumlarda isteğe bağlı ve yararlıdır: ve simge ile pencere arka planı arasında daha fazla kontrasta ihtiyacınız var. Bir uyarlanabilir simge kullanıyorsanız Pencere arka planıyla yeterli kontrast varsa arka plan görüntülenir.

3 Uyarlanabilir simgelerde olduğu gibi, ön planın üçte biri maskelenmiştir.

4 Pencere arka planı tek bir öğeden oluşur. opak renk. Pencere arka planı ayarlanmışsa ve düz bir renkse özellik ayarlanmamışsa varsayılan olarak kullanılır.

Başlangıç ekranı boyutları

Başlangıç ekranı simgesi, uyarlanabilir simgelerle aynı spesifikasyonları kullanır.

• Markalı resim: Bu 200×80 dp olmalıdır.
• Simge arka planı olan uygulama simgesi: 240×240 dp olmalı ve 160 dp boyutunda daire.
• Simge arka planı olmayan uygulama simgesi: 288×288 dp boyutunda olmalı ve simge arka plana sığmalıdır 192 dp boyutunda bir daire.

Örneğin, bir resmin tam boyutu 300×300 dp ise simgenin 200 dp çaplı daire içinde. Çemberin dışındaki her şey döner görünmez (maskeli).

Başlangıç ekranı animasyonları ve başlatma sırası

Ek gecikmeler genellikle bir uygulamanın soğuk başlatma ile başlatılmasıyla ilişkilidir. Başlangıç ekranınıza animasyonlu bir simge eklemek hem estetik açıdan çekicidir hem de daha premium bir deneyim sunar. Kullanıcı araştırması, algılanan startup’ların süre daha kısadır.

Başlangıç ekranı animasyonu, aşağıdaki gibi başlatma dizisi bileşenlerine yerleştirilir: Şekil 4'te gösterilmiştir.

1. Giriş animasyonu: Bu, açılış ekranındaki sistem görünümünden oluşur. Bu boyut, sistem tarafından kontrol edilir ve özelleştirilemez.

2. Başlangıç ekranı (sıranın "bekleme" bölümünde gösterilir): Başlangıç ekranı özelleştirilebilir. Böylece kendi logo animasyonunuzu ve markanızı ekleyebilirsiniz. Düzgün çalışması için bu sayfada açıklanan şartları karşılamalıdır.

3. Çıkış animasyonu: Başlangıç ekranını gizleyen animasyondan oluşur. Özelleştirmek isterseniz SplashScreenView ve onun simgesini tıklayın. Bunlarda, dönüştürme ayarları ile herhangi bir animasyon çalıştırabilirsiniz. opaklık ve renk. Bu durumda, animasyon tamamlandığında açılış ekranını manuel olarak kaldırın.

Simge animasyonu çalıştırıldığında, uygulamanın daha erken hazır olduğu durumlarda uygulama başlatma işlemi size sırayı atlama seçeneği sunar. Uygulama onResume()'yi tetikler veya açılış ekranının süresi otomatik olarak dolar. Bu nedenle, hareketin rahatça atlanabildiğinden emin olun. Başlangıç ekranı yalnızca uygulama görsel açıdan kararlı olduğunda onResume() ile kapatılmalıdır. Bu nedenle ek döndürücülere gerek yoktur. Eksik bir arayüz sunmak kullanıcılar için can sıkıcı olabilir ve öngörülemezlik ya da özensizlik izlenimi verebilir.

Başlangıç ekranı animasyonu gereksinimleri

Başlangıç ekranınız aşağıdaki özelliklere uygun olmalıdır:

• Şeffaflık içermeyen tek bir pencere arka plan rengi ayarlayın. Gündüz ve gece modu, SplashScreen uyumluluk kitaplığı ile desteklenir.

• Animasyonlu simgenin aşağıdaki özellikleri karşıladığından emin olun:

  • Biçim: Simge AnimatedVectorDrawable (AVD) XML.
  • Boyutlar: AVD simgesi, aşağıdaki gibi uyarlanabilir simgeden dört kat daha büyük olmalıdır:
    • Simge alanı 432 dp, diğer bir deyişle, alan adının Maskesiz uyarlanabilir bir simgenin 108 dp alanı.
    • Görselin üçte ikisi başlatıcı simgesinde görünür, ve 288 dp olmalıdır. Yani, sistemdeki 72 dp'nin dört katı olmalıdır. uyarlanabilir bir simgenin iç maskeli alanını oluşturur.
  • Süre: Telefonlarda 1.000 ms.yi aşmamanızı öneririz. Gecikmeli başlatma kullanabilirsiniz ancak bu süre 166 ms'den uzun olamaz. Uygulamanın başlatma süresi 1.000 ms'den uzunsa döngüsel animasyon kullanabilirsiniz.

• Uygulamanız ilk karesini çizerken gösterilen açılış ekranını kapatmak için uygun bir süre belirleyin. Bu ayarı, başlangıç ekranını daha uzun süre ekranda tutma ile ilgili bölümde açıklandığı şekilde daha da özelleştirebilirsiniz.

Başlangıç ekranı kaynakları

İndirin: örnek başlangıç seti, Bu videoda, animasyonların nasıl oluşturulacağını, biçimlendirileceğini ve ortalama görüntüleme süresinde (AVD) nasıl dışa aktarılacağını gösterilmektedir. Bunlardan bazıları:

• Animasyonun Adobe After Effects proje dosyası.
• Dışa aktarılan nihai AVD XML dosyası.
• Animasyonun örnek GIF'i.

Bu dosyaları indirerek Google Hizmet Şartları'nı kabul etmiş olursunuz.

Google Gizlilik Politikası'nda, verileri bu hizmette işlenir.

Uygulamanızdaki açılış ekranını özelleştirme

Varsayılan olarak SplashScreen, windowBackground tek bir renkse temanızın windowBackground değerini kullanır. Başlangıç ekranını özelleştirmek için uygulama temasına özellikler ekleyin.

Uygulamanızın açılış ekranını özelleştirmek için aşağıdakilerden birini yapabilirsiniz:

• Görünümünü değiştirmek için tema özelliklerini ayarlayın.

• Reklamı daha uzun süre ekranda tutun.

• Başlangıç ekranını kapatma animasyonunu özelleştirin.

Başlayın

Temel SplashScreen kitaplığı, Android 12 başlangıç ekranını herkese sunar. API 23'teki cihazlar. Bu snippet'i projenize eklemek için build.gradle dosyanız:

dependencies {
    implementation "androidx.core:core-splashscreen:1.0.0"
}

dependencies {
    implementation("androidx.core:core-splashscreen:1.0.0")
}

Başlangıç ekranının görünümünü değiştirmek için tema ayarlama

Özelleştirmek için Activity temanızda aşağıdaki özellikleri belirtebilirsiniz başlangıç ekranını seçin. Zaten eski bir başlangıç ekranınız varsa android:windowBackground gibi özelliklerin kullanıldığı bir uygulama için Android 12 ve sonraki sürümler için alternatif bir kaynak dosyası sağlar.

1. Arka planı tek bir renkle doldurmak için windowSplashScreenBackground simgesini kullanın:

   <item name="android:windowSplashScreenBackground">@color/...</item>
   

2. Tekliflerinizi otomatikleştirmek ve optimize etmek için windowSplashScreenAnimatedIcon simgesini tıklayın.

   Yalnızca Android 12'yi (API düzeyi 32) hedefleyen uygulamalar için aşağıdakileri yapın:

   Nesne animasyon haline getirilebilir ve AnimationDrawable ve AnimatedVectorDrawable için windowSplashScreenAnimationDuration olarak ayarla animasyonu oynatır. Bu gerekli değildir çünkü süre doğrudan AnimatedVectorDrawable

   <item name="android:windowSplashScreenAnimatedIcon">@drawable/...</item>
   

3. Tekliflerinizi otomatikleştirmek ve optimize etmek için windowSplashScreenAnimationDuration başlangıç ekranı simge animasyonunun süresini belirtin. Bu ayarın, açılış ekranının gösterildiği gerçek süre üzerinde herhangi bir etkisi yoktur ancak SplashScreenView.getIconAnimationDuration kullanarak açılış ekranı çıkış animasyonunu özelleştirirken bu değeri alabilirsiniz. Daha fazla bilgi için açılış ekranını ekranda daha uzun süre tutma ile ilgili aşağıdaki bölüme bakın.

   <item name="android:windowSplashScreenAnimationDuration">1000</item>
   

4. Başlangıç ekranı simgesinin arkasına arka plan ayarlamak için windowSplashScreenIconBackgroundColor simgesini kullanın. Bu özellik, pencerenin arka planıyla simge arasında yeterli kontrast yok.

   <item name="android:windowSplashScreenIconBackgroundColor">@color/...</item>
   

5. Tekliflerinizi otomatikleştirmek ve optimize etmek için windowSplashScreenBrandingImage simgesini tıklayın. Ancak marka imajı kullanılmaması önerilir.

   <item name="android:windowSplashScreenBrandingImage">@drawable/...</item>
   

6. Tekliflerinizi otomatikleştirmek ve optimize etmek için windowSplashScreenBehavior uygulamanızın, simgenin başlangıç ekranında her zaman Android 13 ve sonraki sürümler. Varsayılan değer 0'dır. Bu değer, simgeyi başlatma etkinliği, splashScreenStyle öğesini SPLASH_SCREEN_STYLE_ICON, veya başlatma etkinliğinde bir stiline sahip. Hiçbir zaman boş bir başlangıç ekranı göstermemeyi tercih ediyor ve her zaman animasyonlu simgeyi icon_preferred değerine ayarlayın.

   <item name="android:windowSplashScreenBehavior">icon_preferred</item>
   

Başlangıç ekranını daha uzun süre ekranda tutma

Uygulamanız ilk karesini çizer çekmez başlangıç ekranı kapanır. Uygulama içi ayarları yerel diskten eşzamansız olarak yüklemek gibi küçük miktarda veri yüklemeniz gerekiyorsa uygulamayı askıya alarak ilk karesini çizmek için ViewTreeObserver.OnPreDrawListener kullanabilirsiniz.

Başlangıç etkinliğiniz çizimden önce bitiyorsa (örneğin, içerik görünümünü ayarlayıp onResume (çizim öncesi) öncesinde bitirme bu sürecin sonunda uygulanabilir.

// Create a new event for the activity.
override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    // Set the layout for the content view.
    setContentView(R.layout.main_activity)

    // Set up an OnPreDrawListener to the root view.
    val content: View = findViewById(android.R.id.content)
    content.viewTreeObserver.addOnPreDrawListener(
        object : ViewTreeObserver.OnPreDrawListener {
            override fun onPreDraw(): Boolean {
                // Check whether the initial data is ready.
                return if (viewModel.isReady) {
                    // The content is ready. Start drawing.
                    content.viewTreeObserver.removeOnPreDrawListener(this)
                    true
                } else {
                    // The content isn't ready. Suspend.
                    false
                }
            }
        }
    )
}

// Create a new event for the activity.
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    // Set the layout for the content view.
    setContentView(R.layout.main_activity);

    // Set up an OnPreDrawListener to the root view.
    final View content = findViewById(android.R.id.content);
    content.getViewTreeObserver().addOnPreDrawListener(
            new ViewTreeObserver.OnPreDrawListener() {
                @Override
                public boolean onPreDraw() {
                    // Check whether the initial data is ready.
                    if (mViewModel.isReady()) {
                        // The content is ready. Start drawing.
                        content.getViewTreeObserver().removeOnPreDrawListener(this);
                        return true;
                    } else {
                        // The content isn't ready. Suspend.
                        return false;
                    }
                }
            });
}

Başlangıç ekranını kapatma animasyonunu özelleştirme

Başlangıç ekranının animasyonunu Activity.getSplashScreen().

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    // ...

    // Add a callback that's called when the splash screen is animating to the
    // app content.
    splashScreen.setOnExitAnimationListener { splashScreenView ->
        // Create your custom animation.
        val slideUp = ObjectAnimator.ofFloat(
            splashScreenView,
            View.TRANSLATION_Y,
            0f,
            -splashScreenView.height.toFloat()
        )
        slideUp.interpolator = AnticipateInterpolator()
        slideUp.duration = 200L

        // Call SplashScreenView.remove at the end of your custom animation.
        slideUp.doOnEnd { splashScreenView.remove() }

        // Run your animation.
        slideUp.start()
    }
}

@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    // ...

    // Add a callback that's called when the splash screen is animating to the
    // app content.
    getSplashScreen().setOnExitAnimationListener(splashScreenView -> {
        final ObjectAnimator slideUp = ObjectAnimator.ofFloat(
                splashScreenView,
                View.TRANSLATION_Y,
                0f,
                -splashScreenView.getHeight()
        );
        slideUp.setInterpolator(new AnticipateInterpolator());
        slideUp.setDuration(200L);

        // Call SplashScreenView.remove at the end of your custom animation.
        slideUp.addListener(new AnimatorListenerAdapter() {
            @Override
            public void onAnimationEnd(Animator animation) {
                splashScreenView.remove();
            }
        });

        // Run your animation.
        slideUp.start();
    });
}

Bu geri çağırma işleminin başlangıcında, açılış ekranındaki animasyonlu vektör çizilebilir başlar. Uygulamanın başlatılma süresine bağlı olarak, çizilebilir öğe animasyonunun ortasında olabilir. Animasyonun ne zaman başladığını öğrenmek için SplashScreenView.getIconAnimationStart değerini kullanın. Görevin kalan süresini aşağıdaki gibi simge animasyonu gösterilir:

// Get the duration of the animated vector drawable.
val animationDuration = splashScreenView.iconAnimationDuration
// Get the start time of the animation.
val animationStart = splashScreenView.iconAnimationStart
// Calculate the remaining duration of the animation.
val remainingDuration = if (animationDuration != null && animationStart != null) {
    (animationDuration - Duration.between(animationStart, Instant.now()))
        .toMillis()
        .coerceAtLeast(0L)
} else {
    0L
}

// Get the duration of the animated vector drawable.
Duration animationDuration = splashScreenView.getIconAnimationDuration();
// Get the start time of the animation.
Instant animationStart = splashScreenView.getIconAnimationStart();
// Calculate the remaining duration of the animation.
long remainingDuration;
if (animationDuration != null && animationStart != null) {
    remainingDuration = animationDuration.minus(
            Duration.between(animationStart, Instant.now())
    ).toMillis();
    remainingDuration = Math.max(remainingDuration, 0L);
} else {
    remainingDuration = 0L;
}

Ek kaynaklar

• Mevcut başlangıç ekranı uygulamanızı Android 12 ve sonraki sürümlere taşıma
• Başlangıç ekranının gerçek dünyadaki uygulamasını gösteren Artık Android'de uygulaması