Multitasking mit teilweisen benutzerdefinierten Tabs

Sebastian Benz

Benutzerdefinierte Tabs werden standardmäßig im Vollbildmodus gestartet. Ab Chrome 107 können Sie benutzerdefinierte Tabs verwenden, um im Hochformat eine andere Starthöhe anzugeben. Nutzer können dann beim Ansehen von Webinhalten mit Ihrer App interagieren und gleichzeitig mehrere Dinge gleichzeitig erledigen. Nutzer können den benutzerdefinierten Tab auf Vollbild maximieren, indem sie den Ziehpunkt der Symbolleiste nach oben ziehen und die anfängliche Starthöhe wiederherstellen, indem sie den Ziehpunkt nach unten ziehen.

Für große Bildschirme oder Geräte im Querformat können Sie ab Chrome 120 eine maximale Startbreite angeben, um einen benutzerdefinierten Tab teilweise auf einem Seitenblatt anzuzeigen. Wenn Sie einen Haltepunkt festlegen, können Sie entscheiden, wann ein teilweiser benutzerdefinierter Tab in einem unteren oder einem seitlichen Tabellenblatt geöffnet wird.

Vorbereitung

Um benutzerdefinierte Tabs teilweise verwenden zu können, müssen Sie

• eine neue Browsersitzung mit einem CustomTabsServiceConnection starten und an den Intent für benutzerdefinierte Tabs übergeben.

• starten Sie die Aktivität für den benutzerdefinierten Tab mit startActivityForResult().

Kombinieren Sie beide Ansätze, wenn Sie einen schnellen Start wünschen, falls die Dienstverbindung noch nicht hergestellt wurde.

Ansicht am unteren Rand konfigurieren

Wenn Sie einen benutzerdefinierten Tab in einen teilweisen benutzerdefinierten Tab umwandeln möchten, legen Sie die anfängliche Starthöhe in Pixeln fest. Rufen Sie dazu die Methode setInitialActivityHeightPx() der Klasse CustomTabBuilder auf. Standardmäßig kann die Größe des partiellen benutzerdefinierten Tabs angepasst werden. Sie können jedoch ACTIVITY\_HEIGHT\_FIXED übergeben, um dieses Verhalten zu deaktivieren:

new CustomTabsBuilder().setInitialActivityHeightPx(
    400,
    ACTIVITY_HEIGHT_FIXED
);

Seitenleiste konfigurieren

Um das Verhalten der Seitenleiste zu konfigurieren, legen Sie die anfängliche Startbreite in Pixeln fest. Rufen Sie dazu die Methode setInitialActivityWidthPx() der Klasse CustomTabBuilder auf.

Standardmäßig kann die Größe des partiellen benutzerdefinierten Tabs angepasst werden. Sie können jedoch ACTIVITY\_HEIGHT\_FIXED übergeben, um dieses Verhalten zu deaktivieren:

  CustomTabsIntent.Builder intentBuilder = new CustomTabsIntent.Builder(session)
        .setInitialActivityHeightPx(400)
        .setInitialActivityWidthPx(400);
        .setActivitySideSheetBreakpointDp(800);

Der benutzerdefinierte Tab verhält sich wie ein Seitenblatt, wenn die Breite des Bildschirms größer als der von setActivitySideSheetBreakpointDp() festgelegte Haltepunktwert ist. Wenn die Breite des Bildschirms höher als x ist, verhält sich der benutzerdefinierte Tab wie ein Seitenblatt. Andernfalls verhält es sich wie ein Tabellenblatt am unteren Rand. Wenn kein Haltepunkt angegeben ist, legen Sie für die Browserimplementierung den Standardwert 840dp fest. Wenn x auf <600dp gesetzt ist, sollte die Browserimplementierung standardmäßig auf 600dp gesetzt werden.

Benutzerdefinierten Tab teilweise mit einer vorhandenen Sitzung starten

CustomTabsSession customTabsSession;

// ...

CustomTabsIntent customTabsIntent = new CustomTabsIntent.Builder(customTabsSession)
   .setInitialActivityHeightPx(500)
    .setInitialActivityWidthPx(400);
    .setActivitySideSheetBreakpointDp(800);
   .setCloseButtonPosition(CustomTabsIntent.CLOSE_BUTTON_POSITION_END)
   // ...
   .build();

customTabsIntent.launchUrl(context, Uri.parse(url))

Einen Teil eines benutzerdefinierten Tabs über „startActivityForResult“ starten

private ActivityResultLauncher<String> mCustomTabLauncher = registerForActivityResult(new ActivityResultContract<String, Integer>() {
    @Override
    public Integer parseResult(int statusCode, @Nullable Intent intent) {
        return statusCode;
    }

    @NonNull
    @Override
    public Intent createIntent(@NonNull Context context, String url) {
        CustomTabsIntent.Builder builder = new CustomTabsIntent.Builder(customTabsSession)
                .setInitialActivityHeightPx(500)
                .setInitialActivityWidthPx(400);
                .setActivitySideSheetBreakpointDp(800);
                .setCloseButtonPosition(CustomTabsIntent.CLOSE_BUTTON_POSITION_END)
                .setToolbarCornerRadiusDp(10);
        Intent customTabsIntent = builder.build().intent;
        customTabsIntent.setData(Uri.parse(url));
        return customTabsIntent;
    }
}, new ActivityResultCallback<Integer>() {
    @Override
    public void onActivityResult(Integer statusCode) {
       // ...
    }
});

@Override
public void onCreate(@Nullable Bundle savedInstanceState) {
    Button selectButton = findViewById(R.id.select_button);
    selectButton.setOnClickListener(new OnClickListener() {
        @Override
        public void onClick(View view) {
            mCustomTabLauncher.launch(customTabsIntent.intent);
        }
    });
}

Als Nächstes erfahren Sie, wie Sie Nutzerinteraktionen auf benutzerdefinierten Tabs messen.