स्प्लैश स्क्रीन

Android 12 से, SplashScreen एपीआई की मदद से ऐप्लिकेशन को ऐनिमेशन के साथ लॉन्च किया जा सकता है. इसमें ऐप्लिकेशन लॉन्च होने पर मोशन, आपके ऐप्लिकेशन का आइकॉन दिखाने वाली स्प्लैश स्क्रीन, और आपके ऐप्लिकेशन पर ट्रांज़िशन शामिल है. SplashScreen एक Window है. इसलिए, इसमें Activity शामिल है.

स्प्लैश स्क्रीन की सुविधा, हर ऐप्लिकेशन के लॉन्च के लिए स्टैंडर्ड डिज़ाइन एलिमेंट उपलब्ध कराती है. हालांकि, इसे पसंद के मुताबिक भी बनाया जा सकता है, ताकि आपके ऐप्लिकेशन की यूनीक ब्रैंडिंग बनी रहे.

SplashScreen प्लैटफ़ॉर्म एपीआई का इस्तेमाल करने के अलावा, SplashScreen कंपैट लाइब्रेरी का भी इस्तेमाल किया जा सकता है. यह लाइब्रेरी, SplashScreen एपीआई को रैप करती है.

स्प्लैश स्क्रीन कैसे काम करती है

जब कोई उपयोगकर्ता किसी ऐप्लिकेशन को तब लॉन्च करता है, जब ऐप्लिकेशन की प्रोसेस नहीं चल रही होती (कोल्ड स्टार्ट) या Activity नहीं बना होता (वॉर्म स्टार्ट), तो ये इवेंट होते हैं:

1. सिस्टम, आपकी तय की गई थीम और ऐनिमेशन का इस्तेमाल करके स्प्लैश स्क्रीन दिखाता है.

2. ऐप्लिकेशन के तैयार होने पर, स्प्लैश स्क्रीन हट जाती है और ऐप्लिकेशन दिखने लगता है.

हॉट स्टार्ट के दौरान, स्प्लैश स्क्रीन कभी नहीं दिखती.

स्प्लैश स्क्रीन के एलिमेंट और काम करने का तरीका

स्प्लैश स्क्रीन के एलिमेंट, Android मेनिफ़ेस्ट फ़ाइल में एक्सएमएल रिसॉर्स फ़ाइलों से तय होते हैं. हर एलिमेंट के लिए, हल्के और गहरे रंग वाले मोड के वर्शन उपलब्ध हैं.

स्प्लैश स्क्रीन के जिन एलिमेंट को पसंद के मुताबिक बनाया जा सकता है उनमें ऐप्लिकेशन का आइकॉन, आइकॉन का बैकग्राउंड, और विंडो का बैकग्राउंड शामिल है:

इमेज 2 में दिखाए गए इन एलिमेंट पर ध्यान दें:

1 ऐप्लिकेशन का आइकॉन, ड्रॉ करने लायक वेक्टर होना चाहिए. यह स्टैटिक या ऐनिमेटेड हो सकता है. हालांकि, ऐनिमेशन की अवधि अनलिमिटेड हो सकती है, लेकिन हमारा सुझाव है कि यह 1,000 मिलीसेकंड से ज़्यादा न हो. लॉन्चर आइकॉन डिफ़ॉल्ट होता है.

2 आइकॉन का बैकग्राउंड जोड़ना ज़रूरी नहीं है. हालांकि, अगर आपको आइकॉन और विंडो के बैकग्राउंड के बीच ज़्यादा कंट्रास्ट चाहिए, तो यह काम का साबित हो सकता है. अडैप्टिव आइकॉन का इस्तेमाल करने पर, उसका बैकग्राउंड तब दिखता है, जब विंडो के बैकग्राउंड के साथ उसका कंट्रास्ट सही हो.

3 अडैप्टिव आइकॉन की तरह ही, फ़ोरग्राउंड का एक-तिहाई हिस्सा मास्क किया जाता है.

4 विंडो के बैकग्राउंड में एक ही अपारदर्शी रंग होता है. अगर विंडो का बैकग्राउंड सेट है और वह एक ही रंग का है, तो एट्रिब्यूट सेट न होने पर, उसे डिफ़ॉल्ट रूप से इस्तेमाल किया जाता है.

स्प्लैश स्क्रीन के डाइमेंशन

स्प्लैश स्क्रीन आइकॉन के लिए, अडैप्टिव आइकॉन की तरह ही इन शर्तों को पूरा करना ज़रूरी है:

• ब्रैंडेड इमेज: यह 200×80 डीपी होनी चाहिए.
• बैकग्राउंड के साथ ऐप्लिकेशन का आइकॉन: यह 240×240 dp का होना चाहिए और 160 dp व्यास वाले सर्कल में फ़िट होना चाहिए.
• बिना आइकॉन बैकग्राउंड वाला ऐप्लिकेशन का आइकॉन: यह 288×288 डीपी का होना चाहिए और 192 डीपी व्यास वाले सर्कल में फ़िट होना चाहिए.

उदाहरण के लिए, अगर किसी इमेज का पूरा साइज़ 300×300 डीपी है, तो आइकॉन को 200 डीपी के व्यास वाले सर्कल में फ़िट होना चाहिए. सर्कल के बाहर मौजूद हर चीज़ छिप जाती है (मास्क हो जाती है).

स्प्लैश स्क्रीन के ऐनिमेशन और लॉन्च सीक्वेंस

किसी ऐप्लिकेशन को कोल्ड स्टार्ट करने पर, अक्सर ज़्यादा इंतज़ार का समय लगता है. स्प्लैश स्क्रीन में ऐनिमेशन वाला आइकॉन जोड़ने से, वह ज़्यादा आकर्षक लगती है. साथ ही, इससे उपयोगकर्ताओं को बेहतर अनुभव मिलता है. उपयोगकर्ताओं पर की गई रिसर्च से पता चलता है कि ऐनिमेशन देखने पर, ऐप्लिकेशन के चालू होने में लगने वाला समय कम महसूस होता है.

स्प्लैश स्क्रीन का ऐनिमेशन, लॉन्च सीक्वेंस के कॉम्पोनेंट में एम्बेड किया जाता है. जैसा कि इमेज 4 में दिखाया गया है.

1. एंटर ऐनिमेशन: इसमें सिस्टम व्यू से लेकर स्प्लैश स्क्रीन तक शामिल है. इसे सिस्टम कंट्रोल करता है और इसमें बदलाव नहीं किया जा सकता.

2. स्प्लैश स्क्रीन (सीक्वेंस के "इंतज़ार" वाले हिस्से के दौरान दिखाई जाती है): स्प्लैश स्क्रीन को पसंद के मुताबिक बनाया जा सकता है. इससे आपको अपना लोगो ऐनिमेशन और ब्रैंडिंग जोड़ने की सुविधा मिलती है. यह इस पेज पर बताई गई ज़रूरी शर्तों को पूरा करती हो, ताकि यह ठीक से काम कर सके.

3. एग्ज़िट ऐनिमेशन: इसमें वह ऐनिमेशन शामिल होता है जो स्प्लैश स्क्रीन को छिपाता है. अगर आपको इसे पसंद के मुताबिक बनाना है, तो SplashScreenView और इसके आइकॉन का इस्तेमाल करें. इन पर कोई भी ऐनिमेशन चलाया जा सकता है. इसके लिए, ट्रांसफ़ॉर्म, ओपैसिटी, और कलर की सेटिंग का इस्तेमाल करें. इस मामले में, ऐनिमेशन पूरा होने पर स्प्लैश स्क्रीन को मैन्युअल तरीके से हटाएं.

आइकॉन ऐनिमेशन चलाते समय, ऐप्लिकेशन लॉन्च होने पर आपको क्रम को छोड़ने का विकल्प मिलता है. ऐसा तब होता है, जब ऐप्लिकेशन पहले से तैयार हो. ऐप्लिकेशन onResume() को ट्रिगर करता है या स्प्लैश स्क्रीन अपने-आप बंद हो जाती है. इसलिए, पक्का करें कि मोशन को आसानी से स्किप किया जा सके. स्प्लैश स्क्रीन को onResume() के साथ सिर्फ़ तब खारिज किया जाना चाहिए, जब ऐप्लिकेशन विज़ुअल के हिसाब से स्टेबल हो. इससे, अतिरिक्त स्पिनर की ज़रूरत नहीं पड़ती. अधूरा इंटरफ़ेस पेश करने से, उपयोगकर्ताओं को परेशानी हो सकती है. साथ ही, इससे उन्हें लग सकता है कि प्रॉडक्ट में कुछ गड़बड़ी है या उसे बेहतर बनाने की ज़रूरत है.

स्प्लैश स्क्रीन के ऐनिमेशन से जुड़ी ज़रूरी शर्तें

आपकी स्प्लैश स्क्रीन इन शर्तों के मुताबिक होनी चाहिए:

• विंडो के बैकग्राउंड के लिए, कोई एक रंग सेट करें. साथ ही, उसे पारदर्शी न रखें. डे और नाइट मोड, SplashScreen कंपैट लाइब्रेरी के साथ काम करते हैं.

• पक्का करें कि ऐनिमेटेड आइकॉन इन शर्तों को पूरा करता हो:

  • फ़ॉर्मैट: आइकॉन, AnimatedVectorDrawable (एवीडी) एक्सएमएल फ़ॉर्मैट में होना चाहिए.
  • डाइमेंशन: एवीडी आइकॉन का साइज़, अडैप्टिव आइकॉन के साइज़ से चार गुना होना चाहिए. जैसे:
    • आइकॉन का साइज़ 432 डीपी होना चाहिए. दूसरे शब्दों में, यह बिना मास्क वाले अडैप्टिव आइकॉन के 108 डीपी साइज़ का चार गुना होना चाहिए.
    • इमेज का अंदरूनी दो-तिहाई हिस्सा, लॉन्चर आइकॉन पर दिखता है. यह 288 डीपी होना चाहिए. दूसरे शब्दों में, यह 72 डीपी का चार गुना होना चाहिए, जो अडैप्टिव आइकॉन के अंदरूनी मास्क किए गए हिस्से को बनाता है.
  • अवधि: हमारा सुझाव है कि फ़ोन पर यह अवधि 1,000 मिलीसेकंड से ज़्यादा न हो. देरी से शुरू होने वाले ऐनिमेशन का इस्तेमाल किया जा सकता है. हालांकि, यह 166 मि॰से॰ से ज़्यादा नहीं होना चाहिए. अगर ऐप्लिकेशन के स्टार्टअप का समय 1,000 मि॰से॰ से ज़्यादा है, तो लूपिंग ऐनिमेशन का इस्तेमाल करें.

• स्प्लैश स्क्रीन को हटाने के लिए सही समय तय करें. ऐसा तब होता है, जब आपका ऐप्लिकेशन अपना पहला फ़्रेम दिखाता है. स्प्लैश स्क्रीन को ज़्यादा समय तक स्क्रीन पर बनाए रखने के बारे में सेक्शन में बताए गए तरीके से, इसे अपनी पसंद के मुताबिक बनाया जा सकता है.

स्प्लैश स्क्रीन से जुड़े संसाधन

स्टार्टर किट का उदाहरण डाउनलोड करें. इसमें, किसी ऐनिमेशन को बनाने, उसे फ़ॉर्मैट करने, और उसे एवीडी में एक्सपोर्ट करने का तरीका बताया गया है. इसमें ये शामिल हैं:

• ऐनिमेशन की Adobe After Effects प्रोजेक्ट फ़ाइल.
• एक्सपोर्ट की गई फ़ाइनल एवीडी एक्सएमएल फ़ाइल.
• ऐनिमेशन का उदाहरण दिखाने वाला GIF.

इन फ़ाइलों को डाउनलोड करने का मतलब है कि आप Google की सेवा की शर्तों से सहमत हैं.

Google की निजता नीति में बताया गया है कि इस सेवा में, आपके डेटा को किस तरह इस्तेमाल किया जाता है.

अपने ऐप्लिकेशन में स्प्लैश स्क्रीन को पसंद के मुताबिक बनाना

डिफ़ॉल्ट रूप से, SplashScreen आपकी थीम के windowBackground का इस्तेमाल करता है. ऐसा तब होता है, जब windowBackground एक ही रंग का हो. स्प्लैश स्क्रीन को पसंद के मुताबिक बनाने के लिए, ऐप्लिकेशन की थीम में एट्रिब्यूट जोड़ें.

अपने ऐप्लिकेशन की स्प्लैश स्क्रीन को पसंद के मुताबिक बनाने के लिए, इनमें से कोई भी तरीका अपनाएं:

• थीम के एट्रिब्यूट सेट करके, उसका लुक बदलें.

• इसे ज़्यादा समय तक स्क्रीन पर रखें.

• स्प्लैश स्क्रीन को खारिज करने के लिए, ऐनिमेशन को पसंद के मुताबिक बनाएं.

शुरू करें

SplashScreen की कोर लाइब्रेरी, एपीआई 23 से लेकर सभी डिवाइसों पर Android 12 की स्प्लैश स्क्रीन उपलब्ध कराती है. इसे अपने प्रोजेक्ट में जोड़ने के लिए, अपनी build.gradle फ़ाइल में यह स्निपेट जोड़ें:

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

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

स्प्लैश स्क्रीन का लुक बदलने के लिए, कोई थीम सेट करें

अपने ऐप्लिकेशन की स्प्लैश स्क्रीन को पसंद के मुताबिक बनाने के लिए, Activity थीम में इन एट्रिब्यूट की जानकारी दी जा सकती है. अगर आपके पास पहले से ही कोई लेगसी स्प्लैश स्क्रीन है, जो android:windowBackground जैसे एट्रिब्यूट का इस्तेमाल करती है, तो Android 12 और इसके बाद के वर्शन के लिए कोई वैकल्पिक रिसॉर्स फ़ाइल उपलब्ध कराएं.

1. बैकग्राउंड को किसी एक रंग से भरने के लिए, windowSplashScreenBackground का इस्तेमाल करें:

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

2. शुरुआती विंडो के बीच में मौजूद आइकॉन को बदलने के लिए, windowSplashScreenAnimatedIcon का इस्तेमाल करें.

   सिर्फ़ Android 12 (एपीआई लेवल 32) को टारगेट करने वाले ऐप्लिकेशन के लिए, यह तरीका अपनाएं:

   अगर ऑब्जेक्ट को ऐनिमेट किया जा सकता है और उसे AnimationDrawable और AnimatedVectorDrawable की मदद से ड्रॉ किया जा सकता है, तो शुरुआती विंडो दिखाते समय ऐनिमेशन चलाने के लिए, windowSplashScreenAnimationDuration को सेट करें. Android 13 के लिए इसकी ज़रूरत नहीं है, क्योंकि अवधि का पता सीधे AnimatedVectorDrawable से चलता है.

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

3. स्प्लैश स्क्रीन के आइकॉन के ऐनिमेशन की अवधि बताने के लिए, windowSplashScreenAnimationDuration का इस्तेमाल करें. इस सेटिंग को सेट करने से, स्प्लैश स्क्रीन दिखने के असल समय पर कोई असर नहीं पड़ता. हालांकि, SplashScreenView.getIconAnimationDuration का इस्तेमाल करके, स्प्लैश स्क्रीन के एग्ज़िट ऐनिमेशन को पसंद के मुताबिक बनाते समय, इसे वापस लाया जा सकता है. ज़्यादा जानकारी के लिए, स्प्लैश स्क्रीन को ज़्यादा समय तक स्क्रीन पर बनाए रखने के बारे में यहां दिया गया सेक्शन देखें.

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

4. स्प्लैश स्क्रीन आइकॉन के पीछे बैकग्राउंड सेट करने के लिए, windowSplashScreenIconBackgroundColor का इस्तेमाल करें. यह तब काम आता है, जब विंडो के बैकग्राउंड और आइकॉन के बीच का कंट्रास्ट कम हो.

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

5. windowSplashScreenBrandingImage का इस्तेमाल करके, स्प्लैश स्क्रीन पर सबसे नीचे दिखने वाली इमेज सेट की जा सकती है. हालांकि, डिज़ाइन से जुड़े दिशा-निर्देशों के मुताबिक, ब्रैंडिंग इमेज का इस्तेमाल नहीं करना चाहिए.

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

6. windowSplashScreenBehavior का इस्तेमाल करके यह तय किया जा सकता है कि Android 13 और इसके बाद के वर्शन में, आपका ऐप्लिकेशन स्प्लैश स्क्रीन पर हमेशा आइकॉन दिखाए या नहीं. डिफ़ॉल्ट वैल्यू 0 होती है. इससे स्प्लैश स्क्रीन पर आइकॉन दिखता है. ऐसा तब होता है, जब लॉन्चिंग गतिविधि splashScreenStyle को SPLASH_SCREEN_STYLE_ICON पर सेट करती है. इसके अलावा, अगर लॉन्चिंग गतिविधि कोई स्टाइल तय नहीं करती है, तो सिस्टम के व्यवहार के हिसाब से आइकॉन दिखता है. अगर आपको कभी भी खाली स्प्लैश स्क्रीन नहीं दिखानी है और हमेशा ऐनिमेशन वाला आइकॉन दिखाना है, तो इसे icon_preferred वैल्यू पर सेट करें.

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

स्प्लैश स्क्रीन को ज़्यादा समय तक स्क्रीन पर रखना

जैसे ही आपका ऐप्लिकेशन अपना पहला फ़्रेम दिखाता है, स्प्लैश स्क्रीन हट जाती है. अगर आपको कम डेटा लोड करना है, जैसे कि लोकल डिस्क से इन-ऐप्लिकेशन सेटिंग को एसिंक्रोनस तरीके से लोड करना, तो ViewTreeObserver.OnPreDrawListener का इस्तेमाल करके, ऐप्लिकेशन को निलंबित किया जा सकता है, ताकि वह अपना पहला फ़्रेम ड्रॉ कर सके.

अगर आपकी शुरुआती गतिविधि, ड्रॉइंग से पहले खत्म हो जाती है, तो प्री-ड्रॉ लिसनर की ज़रूरत नहीं होती. उदाहरण के लिए, कॉन्टेंट व्यू सेट न करने और onResume से पहले खत्म होने पर.

// 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;
                    }
                }
            });
}

स्प्लैश स्क्रीन को खारिज करने के लिए, ऐनिमेशन को पसंद के मुताबिक बनाएं

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();
    });
}

इस कॉलबैक के शुरू होने पर, स्प्लैश स्क्रीन पर ऐनिमेटेड वेक्टर ड्रॉएबल शुरू हो जाता है. ऐप्लिकेशन लॉन्च होने में लगने वाले समय के आधार पर, ड्रॉएबल अपने ऐनिमेशन के बीच में हो सकता है. ऐनिमेशन शुरू होने का समय जानने के लिए, SplashScreenView.getIconAnimationStart का इस्तेमाल करें. आइकॉन के ऐनिमेशन की बची हुई अवधि को इस तरह कैलकुलेट किया जा सकता है:

// 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;
}

अन्य संसाधन

• स्प्लैश स्क्रीन के मौजूदा सेटअप को Android 12 और उसके बाद के वर्शन पर माइग्रेट करना
• Now in Android ऐप्लिकेशन में, स्प्लैश स्क्रीन को असल में लागू करने का तरीका दिखाया गया है