Questa guida spiega come aggiungere interattività personalizzata alle schede personalizzate.
Attiva l'azione di condivisione predefinita
Se non specifichi un'azione di condivisione personalizzata, è opportuno attivare l'azione di condivisione predefinita del browser nel menu extra per consentire agli utenti di condividere più facilmente un link ai contenuti visualizzati:
CustomTabsIntent.Builder intentBuilder = new CustomTabsIntent.Builder();
intentBuilder.setShareState(CustomTabsIntent.SHARE_STATE_ON);
Aggiungi un pulsante di azione personalizzato
Per le azioni importanti, la barra degli strumenti della Scheda personalizzata ti consente di integrare un pulsante di azione personalizzato, che può avere un'etichetta di testo o un'icona personalizzata. L'icona deve avere un'altezza di 24 dp e una larghezza di 24-48 dp.
Ad esempio, puoi aggiungere un'azione di condivisione personalizzata alla barra degli strumenti. Per farlo, crea una BroadcastReceiver che viene chiamata quando l'utente fa clic sull'azione di condivisione nella scheda personalizzata.
Registra BroadCastReceiver nel file AndroidManifest.xml:
<application …>
<receiver android:name=".ShareBroadcastReceiver" />
</application>
Quindi aggiungi un nuovo corso, ShareBroadcastReceiver. Nel metodo onReceive(), estrai l'URL attualmente visualizzato dall'intent e attiva un intent di invio.
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);
}
}
Ora crea un PendingIntent per ShareBroadcast e registralo tramite setActionButton(). Trasmetti l'intent in sospeso insieme all'icona e alla descrizione.
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();
Aggiungere voci di menu personalizzate
Una scheda personalizzata ha fino a cinque azioni predefinite fornite dal browser: "Inoltra", "Informazioni sulla pagina", "Aggiorna", "Trova nella pagina" e "Apri nel browser". Inoltre, puoi aggiungerne fino ad altri sette. Queste voci di menu verranno inserite tra la riga dell'icona e le voci fornite dal browser. (vedi l'immagine di seguito). Il numero effettivo dipende dall'implementazione del browser sottostante. Ad esempio, con la versione 117, Chrome ha aumentato il numero di voci di menu da cinque a sette. Quindi è meglio aggiungere prima gli elementi più importanti.
Puoi accedere alle azioni personalizzate tramite il menu con tre puntini nell'angolo in alto a destra:
Per aggiungere una voce di menu, chiama CustomTabsIntent.Builder.addMenuItem() con il titolo e un PendingIntent. Quando l'utente tocca una voce di menu, il browser attiva l'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();
Personalizza il pulsante di chiusura
Per adattare meglio una scheda personalizzata al flusso della tua app, personalizza il pulsante di chiusura. Se vuoi che l'utente abbia l'impressione che le schede personalizzate siano una finestra di dialogo modale, utilizza il pulsante “X” predefinito. Se vuoi che l'utente senta che la Scheda personalizzata faccia parte del flusso dell'applicazione, utilizza la Freccia indietro.
CustomTabsIntent.Builder intentBuilder = new CustomTabsIntent.Builder();
intentBuilder.setCloseButtonIcon(BitmapFactory.decodeResource(
getResources(), R.drawable.ic_arrow_back));
Aggiungi una barra degli strumenti inferiore
La barra degli strumenti inferiore è un modo molto flessibile per aggiungere altre funzionalità a una scheda personalizzata.
Passando un oggetto RemoteViews a CustomTabIntent.Builder.setSecondaryToolbarViews(), la barra degli strumenti inferiore può essere completamente personalizzata e aggiornata in modo dinamico.
Innanzitutto, dichiara un layout della barra degli strumenti creando un nuovo file di layout, 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>
Il passaggio successivo consiste nel registrare un elemento BroadcastReceiver, che gestisce le interazioni con la barra degli strumenti, nel file AndroidManifest.xml:
<application …>
<receiver android:name=".CustomTabBottomToolbarBroadcastReceiver" />
</application>
Poi implementa l'BroadcastReceiver, che gestirà tutte le interazioni con la barra degli strumenti in basso:
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
}
}
}
Infine, registra la barra degli strumenti:
// 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();
Segnalibri e pulsanti di download
I preferiti e i pulsanti di download nel menu con tre puntini sono attivi per impostazione predefinita. Per disabilitarle, utilizza il seguente codice
codice in CustomTabsIntent.Builder:
CustomTabsIntent customTabsIntent = new CustomTabsIntent.Builder()
.setBookmarksButtonEnabled(false)
.setDownloadButtonEnabled(false)
.build();
Prossimo passaggio: scopri come velocizzare il caricamento dei contenuti web in una scheda personalizzata.