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

Sebastian Benz

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

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

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

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

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

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

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

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

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

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

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

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

मेन्यू में कोई आइटम जोड़ने के लिए, टाइटल और 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));

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

नीचे दिया गया टूलबार, 'कस्टम टैब' में ज़्यादा सुविधाएं जोड़ने का काफ़ी सुविधाजनक तरीका है.

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

सबसे पहले, एक नई लेआउट फ़ाइल, 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();

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