Z tego przewodnika dowiesz się, jak dodać niestandardową interaktywność na kartach niestandardowych.
Włącz domyślne działanie udostępniania
Jeśli nie określisz niestandardowego działania udostępniania, warto włączyć w rozszerzonym menu domyślne działanie udostępniania w przeglądarce. Ułatwi to użytkownikom udostępnianie linku do oglądanej treści:
CustomTabsIntent.Builder intentBuilder = new CustomTabsIntent.Builder();
intentBuilder.setShareState(CustomTabsIntent.SHARE_STATE_ON);
Dodawanie niestandardowego przycisku działania
W przypadku ważnych działań na pasku narzędzi karty niestandardowej możesz zintegrować niestandardowy przycisk polecenia, który może mieć etykietę tekstową lub ikonę niestandardową. Ikona powinna mieć wysokość 24 dp i szerokość 24–48 dp.
Do paska narzędzi możesz na przykład dodać niestandardowe działanie udostępniania. Aby to zrobić, utwórz obiekt BroadcastReceiver, który będzie wywoływany, gdy użytkownik kliknie działanie udostępniania na karcie niestandardowej.
Zarejestruj BroadCastReceiver w pliku AndroidManifest.xml:
<application …>
<receiver android:name=".ShareBroadcastReceiver" />
</application>
Następnie dodaj nowe zajęcia: ShareBroadcastReceiver. W metodzie onReceive() wyodrębnij wyświetlany obecnie URL z intencji i aktywuj intencję wysyłania.
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);
}
}
Teraz utwórz PendingIntent dla domeny ShareBroadcast i zarejestruj go w usłudze setActionButton(). Przekaż oczekującą intencję wraz z ikoną i opisem.
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();
Dodaj niestandardowe pozycje menu
Karta niestandardowa ma maksymalnie pięć domyślnych działań udostępnianych przez przeglądarkę: „Przekaż dalej”, „Informacje o stronie”, „Odśwież” i „Znajdź na stronie”. i „Otwórz w przeglądarce”. Możesz dodać jeszcze 7. Te pozycje menu zostaną wstawione między wierszem ikon a elementami dostarczonymi przez przeglądarkę. (zobacz ilustrację poniżej). Rzeczywista liczba zależy od używanej implementacji przeglądarki. (Na przykład w wersji 117 Chrome zwiększył liczbę pozycji w menu z pięciu do siedmiu). Najlepiej więc dodać najważniejsze informacje na początku.
Działania niestandardowe możesz wyświetlić za pomocą menu z 3 kropkami w prawym górnym rogu:
Aby dodać pozycję menu, wywołaj CustomTabsIntent.Builder.addMenuItem() z tytułem i PendingIntent. Gdy użytkownik kliknie pozycję menu, przeglądarka uruchomi 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();
Dostosowywanie przycisku zamykania
Aby lepiej dopasować kartę niestandardową do aplikacji, dostosuj przycisk zamykania. Jeśli chcesz, aby użytkownik miał wrażenie, że Karty niestandardowe są modalnym oknem, użyj domyślnego przycisku “X”. Jeśli chcesz, aby użytkownik czuł, że karta niestandardowa jest częścią procesu aplikacji, użyj strzałki wstecz.
CustomTabsIntent.Builder intentBuilder = new CustomTabsIntent.Builder();
intentBuilder.setCloseButtonIcon(BitmapFactory.decodeResource(
getResources(), R.drawable.ic_arrow_back));
Dodaj dolny pasek narzędzi
Dolny pasek narzędzi to bardzo elastyczny sposób dodawania do karty niestandardowej dodatkowych funkcji.
Dzięki przekazaniu obiektu RemoteViews do funkcji CustomTabIntent.Builder.setSecondaryToolbarViews() możesz w pełni dostosować dolny pasek narzędzi i dynamicznie go aktualizować.
Najpierw zadeklaruj układ paska narzędzi, tworząc nowy plik układu (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>
Następnym krokiem jest zarejestrowanie w pliku AndroidManifest.xml usługi BroadcastReceiver, która obsługuje interakcje z paskiem narzędzi:
<application …>
<receiver android:name=".CustomTabBottomToolbarBroadcastReceiver" />
</application>
Następnie wdróż element BroadcastReceiver, który będzie obsługiwać wszystkie interakcje z dolnym paskiem narzędzi:
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
}
}
}
Na koniec zarejestruj pasek narzędzi:
// 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();
Zakładki i przyciski pobierania
Zakładki i przyciski pobierania w menu z 3 kropkami są domyślnie włączone. Aby je wyłączyć, wykonaj następujące czynności
kod w CustomTabsIntent.Builder:
CustomTabsIntent customTabsIntent = new CustomTabsIntent.Builder()
.setBookmarksButtonEnabled(false)
.setDownloadButtonEnabled(false)
.build();
Kolejny krok: jak przyśpieszyć ładowanie treści z internetu na karcie niestandardowej.