यूज़र इंटरफ़ेस (यूआई) को पसंद के मुताबिक बनाना

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

टूलबार का रंग सेट करना

पसंद के मुताबिक हल्के रंग वाली स्कीम वाला कस्टम टैब
हल्के रंग वाला मोड
पसंद के मुताबिक डार्क कलर स्कीम वाला कस्टम टैब
गहरे रंग वाला मोड

सबसे पहले, कस्टम टैब के पता बार को अपने ऐप्लिकेशन की थीम के हिसाब से कस्टमाइज़ करें. नीचे दिया गया स्निपेट, setDefaultColorSchemeParams() को कॉल करके टूलबार का डिफ़ॉल्ट रंग बदलता है. अगर आपके ऐप्लिकेशन में गहरे रंग वाली कलर स्कीम भी काम करती है, तो उसे .setColorSchemeParams(CustomTabsIntent.COLOR_SCHEME_DARK, …) से सेट करें.

// get the current toolbar background color (this might work differently in your app)
@ColorInt int colorPrimaryLight = ContextCompat.getColor(MainActivity.this, R.color.md_theme_light_primary);
@ColorInt int colorPrimaryDark = ContextCompat.getColor(MainActivity.this, R.color.md_theme_dark_primary);

CustomTabsIntent intent = new CustomTabsIntent.Builder()
        // set the default color scheme
        .setDefaultColorSchemeParams(new CustomTabColorSchemeParams.Builder()
                .setToolbarColor(colorPrimaryLight)
                .build())
        // set the alternative dark color scheme
        .setColorSchemeParams(CustomTabsIntent.COLOR_SCHEME_DARK, new CustomTabColorSchemeParams.Builder()
                .setToolbarColor(colorPrimaryDark)
                .build())
        .build();

टूलबार में अब पसंद के मुताबिक बैकग्राउंड और फ़ोरग्राउंड के रंग चुने जा सकते हैं.

ऑब्जेक्ट को सीन में शामिल करने और हटाने के लिए कस्टम ऐनिमेशन कॉन्फ़िगर करना

इसके बाद, setStartAnimation और setExitAnimation का इस्तेमाल करके, कस्टम टैब को शुरू करने और उससे बाहर निकलने के लिए कस्टम ऐनिमेशन तय करके, अपने ऐप्लिकेशन में कस्टम टैब को आसानी से लॉन्च (और उससे बाहर निकलने) किया जा सकता है:

CustomTabsIntent intent = new CustomTabsIntent.Builder()

.setStartAnimations(MainActivity.this, R.anim.slide_in_right, R.anim.slide_out_left)
.setExitAnimations(MainActivity.this, android.R.anim.slide_in_left, android.R.anim.slide_out_right)
.build();

कस्टमाइज़ करने के अन्य विकल्प: टाइटल, ऐप्लिकेशन बार अपने-आप छिपना, और बंद करने के लिए कस्टम आइकॉन

कस्टम टैब के यूज़र इंटरफ़ेस (यूआई) को अपनी ज़रूरतों के हिसाब से अडजस्ट करने के लिए, कुछ और भी काम किए जा सकते हैं.

  • स्क्रोल करने पर यूआरएल बार छिपाएं, ताकि उपयोगकर्ता setUrlBarHidingEnabled()(true) का इस्तेमाल करके वेब कॉन्टेंट को एक्सप्लोर करने के लिए ज़्यादा जगह पा सके.
  • setShowTitle()(true) का इस्तेमाल करके, दस्तावेज़ के यूआरएल के बजाय उसका टाइटल दिखाएं.
  • अपने ऐप्लिकेशन में यूज़र फ़्लो के हिसाब से, 'बंद करें' बटन को पसंद के मुताबिक बनाएं. उदाहरण के लिए, डिफ़ॉल्ट X आइकॉन के बजाय, बैक ऐरो दिखाएं: setCloseButtonIcon()(myCustomCloseIcon).

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

Bitmap myCustomCloseIcon = getDrawable(R.drawable.ic_baseline_arrow_back_24));
CustomTabsIntent intent = new CustomTabsIntent.Builder()
  
  .setUrlBarHidingEnabled(true)
  .setShowTitle(true)
  .setCloseButtonIcon(toBitmap(myCustomCloseIcon))
  .build();

कस्टम रेफ़रर सेट करना

कस्टम टैब लॉन्च करते समय, अपने ऐप्लिकेशन को रेफ़रर के तौर पर सेट किया जा सकता है. इस तरह, वेबसाइटों को यह जानकारी दी जा सकती है कि उन पर ट्रैफ़िक कहां से आ रहा है.

CustomTabsIntent customTabsIntent = new CustomTabsIntent.Builder().build()
customTabsIntent.intent.putExtra(Intent.EXTRA_REFERRER,
       Uri.parse("android-app://" + context.getPackageName()));

अगला लेख: कस्टम टैब में कस्टम ऐक्शन जोड़ने का तरीका जानें.