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

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

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

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

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

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

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

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

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

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

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

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

दूसरे चित्र में दिखाए गए इन एलिमेंट पर ध्यान दें:

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

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

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

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

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

स्प्लैश स्क्रीन आइकॉन, अडैप्टिव आइकॉन की ही शर्तों का इस्तेमाल करता है. ये शर्तें यहां दी गई हैं:

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

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

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

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

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

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

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

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

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

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

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

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

• पक्का करें कि ऐनिमेशन वाला आइकॉन इन स्पेसिफ़िकेशन के मुताबिक हो:

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

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

स्प्लैश स्क्रीन के रिसॉर्स

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

• ऐनिमेशन की Adobe After Effects प्रोजेक्ट फ़ाइल.
• एक्सपोर्ट की गई AVD एक्सएमएल फ़ाइल का फ़ाइनल वर्शन.
• ऐनिमेशन का उदाहरण 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 और उसके बाद के वर्शन पर माइग्रेट करना
• Android में अब उपलब्ध ऐप्लिकेशन, जिसमें स्प्लैश स्क्रीन को लागू करने का तरीका दिखाया गया है