कस्टम इंटरैक्टिविटी जोड़ना

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

शेयर करने की डिफ़ॉल्ट कार्रवाई चालू करें

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

    CustomTabsIntent.Builder intentBuilder = new CustomTabsIntent.Builder();
    intentBuilder.setShareState(CustomTabsIntent.SHARE_STATE_ON);

कस्टम ऐक्शन बटन जोड़ना

ज़रूरी कार्रवाइयों के लिए, कस्टम टैब टूलबार की मदद से, कस्टम ऐक्शन बटन इंटिग्रेट किया जा सकता है. इस बटन में टेक्स्ट लेबल या कस्टम आइकॉन हो सकता है. आइकॉन की ऊंचाई 24 डीपी और चौड़ाई 24 से 48 डीपी होनी चाहिए.

पसंद के मुताबिक शेयर करने की कार्रवाई वाला कस्टम टैब

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

AndroidManifest.xml फ़ाइल में BroadCastReceiver को रजिस्टर करें:

<application …>
  <receiver android:name=".ShareBroadcastReceiver" />
</application>

इसके बाद, ShareBroadcastReceiver नाम की नई क्लास जोड़ें. onReceive() तरीके में, इंटेंट से फ़िलहाल दिखाया जा रहा यूआरएल निकालें और भेजें इंटेंट को ट्रिगर करें.

public class ShareBroadcastReceiver extends BroadcastReceiver {

    @Override
    public void onReceive(Context context, Intent intent) {
        String url = intent.getDataString();
        Intent sendIntent = new Intent();
        sendIntent.setAction(Intent.ACTION_SEND);
        sendIntent.putExtra(Intent.EXTRA_TEXT, url);
        sendIntent.setType("text/plain");
        Intent shareIntent = Intent.createChooser(sendIntent, null);
        shareIntent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
        context.startActivity(shareIntent);
    }
}

अब, ShareBroadcast के लिए PendingIntent बनाएं और उसे setActionButton() के ज़रिए रजिस्टर करें. आइकॉन और ब्यौरे के साथ, पेंडिंग इंटेंट को पास करें.

String shareDescription = getString(R.string.label_action_share);
Bitmap shareIcon = BitmapFactory.decodeResource(getResources(),
       android.R.drawable.ic_menu_share);

// Create a PendingIntent to your BroadCastReceiver implementation
Intent actionIntent = new Intent(
       this.getApplicationContext(), ShareBroadcastReceiver.class);
PendingIntent pendingIntent =
       PendingIntent.getBroadcast(getApplicationContext(), 0 /* request code */, actionIntent, PendingIntent.FLAG_MUTABLE);          

//Set the pendingIntent as the action to be performed when the button is clicked.
CustomTabsIntent intentBuilder = new CustomTabsIntent.Builder()
    
    .setActionButton(shareIcon, shareDescription, pendingIntent)
    .build();

कस्टम मेन्यू आइटम जोड़ना

कस्टम टैब में, ब्राउज़र की ओर से पांच डिफ़ॉल्ट कार्रवाइयां उपलब्ध होती हैं: "आगे बढ़ें", "पेज की जानकारी", "रीफ़्रेश करें", "पेज में खोजें", और "ब्राउज़र में खोलें". इसके अतिरिक्त, आप सात और जोड़ सकते हैं. ये मेन्यू आइटम, आइकॉन पंक्ति और ब्राउज़र के दिए आइटम के बीच डाले जाएंगे. (नीचे दी गई इमेज देखें.) असल संख्या, ब्राउज़र के लागू होने के तरीके पर निर्भर करती है. (उदाहरण के लिए, Chrome के 117 वर्शन में मेन्यू आइटम की संख्या पांच से बढ़ाकर सात कर दी गई थी.) इसलिए, सबसे ज़रूरी आइटम पहले जोड़ें.

सबसे ऊपर दाएं कोने में मौजूद तीन बिंदु वाले मेन्यू की मदद से, अपनी पसंद के मुताबिक कार्रवाइयां ऐक्सेस की जा सकती हैं:

पांच कस्टम मेन्यू आइटम वाला कस्टम टैब.

मेन्यू में कोई आइटम जोड़ने के लिए, टाइटल और PendingIntent वाले CustomTabsIntent.Builder.addMenuItem() पर कॉल करें. जब उपयोगकर्ता किसी मेन्यू आइटम पर टैप करता है, तो ब्राउज़र PendingIntent को सक्रिय कर देगा.

CustomTabsIntent intent = new CustomTabsIntent.Builder()
        ...
        .addMenuItem("Menu item 1", pendingIntent)
        .addMenuItem("Menu item 2", pendingIntent)
        .addMenuItem("Menu item 3", pendingIntent)
        .addMenuItem("Menu item 4", pendingIntent)
        .addMenuItem("Menu item 5", pendingIntent)
        .build();

'बंद करें' बटन को पसंद के मुताबिक बनाना

कस्टम टैब को अपने ऐप्लिकेशन के फ़्लो में बेहतर तरीके से फ़िट करने के लिए, बंद करने के बटन को पसंद के मुताबिक बनाएं. अगर आपको उपयोगकर्ताओं को यह दिखाना है कि कस्टम टैब एक मॉडल डायलॉग है, तो डिफ़ॉल्ट “X” बटन का इस्तेमाल करें. अगर आपको उपयोगकर्ता को यह महसूस कराना है कि कस्टम टैब, ऐप्लिकेशन फ़्लो का हिस्सा है, तो बैक ऐरो का इस्तेमाल करें.

CustomTabsIntent.Builder intentBuilder = new CustomTabsIntent.Builder();
intentBuilder.setCloseButtonIcon(BitmapFactory.decodeResource(
    getResources(), R.drawable.ic_arrow_back));

सबसे नीचे मौजूद टूलबार जोड़ें

सबसे नीचे मौजूद टूलबार, कस्टम टैब में ज़्यादा फ़ंक्शन जोड़ने का एक आसान तरीका है.

नीचे टूलबार वाला कस्टम टैब

CustomTabIntent.Builder.setSecondaryToolbarViews() में RemoteViews ऑब्जेक्ट पास करके, सबसे नीचे मौजूद टूलबार को अपनी पसंद के मुताबिक बनाया जा सकता है और डाइनैमिक तौर पर अपडेट किया जा सकता है.

सबसे पहले, नई लेआउट फ़ाइल बनाकर टूलबार लेआउट का एलान करें, res/layout/custom_tab_toolbar.xml:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:gravity="center">

    <Button xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/ct_toolbar_next"
        android:layout_width="wrap_content"
        android:layout_height="48dp"
        android:layout_margin="8dp"
        android:padding="8dp"
        android:paddingStart="16dp"
        android:paddingEnd="16dp"
        android:text="Next" />

    <Button xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/ct_toolbar_previous"
        android:layout_width="wrap_content"
        android:layout_height="48dp"
        android:layout_margin="8dp"
        android:padding="8dp"
        android:text="Previous" />
</LinearLayout>

अगला चरण BroadcastReceiver को रजिस्टर करना है, जो AndroidManifest.xml फ़ाइल में टूलबार के इंटरैक्शन मैनेज करता है:

<application …>
  <receiver android:name=".CustomTabBottomToolbarBroadcastReceiver" />
</application>

इसके बाद, BroadcastReceiver लागू करें. यह सबसे नीचे मौजूद टूलबार के साथ होने वाले सभी इंटरैक्शन को मैनेज करेगा:

public class BottomToolbarBroadcastReceiver extends BroadcastReceiver {

    @Override
    public void onReceive(Context context, Intent intent) {
        String url = intent.getDataString();
        int remoteViewId = intent.getIntExtra(EXTRA_REMOTEVIEWS_CLICKED_ID, -1);
        if (remoteViewId == R.id.ct_toolbar_previous) {
          // handle previous
        } else if (remoteViewId == R.id.ct_toolbar_next) {
          // handle next
        }
    }
}

आखिर में, टूलबार रजिस्टर करें:

// Create the pending intent
Intent actionIntent = new Intent(
       this.getApplicationContext(), BottomToolbarBroadcastReceiver.class);

PendingIntent pendingIntent =
       PendingIntent.getBroadcast(getApplicationContext(), 0 /* request code */, actionIntent, PendingIntent.FLAG_MUTABLE);          

// Pass the toolbar layout to the RemoteViews instance
RemoteViews secondaryToolbarViews = new RemoteViews(getPackageName(), R.layout.custom_tab_toolbar);
// All toolbar buttons
int[] clickableIds = {R.id.ct_toolbar_next, R.id.ct_toolbar_previous};

// Register the bottom toolbar when creating a new custom tab intent
CustomTabsIntent intent = new CustomTabsIntent.Builder()
    .setSecondaryToolbarViews(secondaryToolbarViews, clickableIds, toolbarPendingIntent)
    .build();

बुकमार्क और डाउनलोड करने के बटन

तीन बिंदु वाले मेन्यू में बुकमार्क और डाउनलोड बटन डिफ़ॉल्ट रूप से चालू होते हैं. इन्हें बंद करने के लिए, CustomTabsIntent.Builder में यह कोड इस्तेमाल करें:

CustomTabsIntent customTabsIntent = new CustomTabsIntent.Builder()
    .setBookmarksButtonEnabled(false)
    .setDownloadButtonEnabled(false)
    .build();

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