Übersicht über benutzerdefinierte Android-Tabs

Benutzerdefinierte Tabs sind eine Funktion in Android-Browsern, mit der App-Entwickler direkt in ihrer App eine benutzerdefinierte Browsererfahrung hinzufügen können.

Das Laden von Webinhalten gehört seit den Anfängen von Smartphones zu mobilen Apps. Ältere Optionen können jedoch für Entwickler Schwierigkeiten mit sich bringen. Das Starten des Browsers bedeutet für Nutzer einen umfangreichen Kontextwechsel, der nicht anpassbar ist. WebViews unterstützen nicht alle Funktionen der Webplattform und geben den Status nicht an den Browser weiter und verursachen keinen Wartungsaufwand.

Benutzerdefinierte Tabs bieten eine bessere Nutzererfahrung als das Öffnen eines externen Browsers. Sie ermöglichen es Nutzern, beim Surfen in der App zu bleiben. Dies erhöht die Interaktion und verringert das Risiko, dass Nutzer die App verlassen. Dazu werden sie direkt vom bevorzugten Browser des Nutzers bereitgestellt und der Status und die von ihm angebotenen Funktionen werden automatisch freigegeben. Sie müssen keinen benutzerdefinierten Code schreiben, um Anfragen, Berechtigungszuweisungen oder Cookiespeicher zu verwalten.

Was sind benutzerdefinierte Tabs?

Wenn Sie einen benutzerdefinierten Tab verwenden, werden Ihre Webinhalte in der Rendering-Engine geladen, die den bevorzugten Browser des Nutzers unterstützt. Dort stehen Ihnen alle API- oder Webplattformfunktionen zur Verfügung, die auch auf dem benutzerdefinierten Tab verfügbar sind. Die Browsersitzung, die gespeicherten Passwörter, Zahlungsmethoden und Adressen werden wie gewohnt angezeigt.

Was kann ich auf einem benutzerdefinierten Tab anpassen?

Ziemlich viel! Mit benutzerdefinierten Tabs können Sie einen Großteil des Browser-Chrome-Browsers und die Nutzererfahrung genau steuern. Innerhalb Ihrer App starten Sie mit einem Intent einen benutzerdefinierten Tab. Wenn dieser Intent aufgerufen wird, können Sie dem CustomTabIntent eine Reihe von Attributen hinzufügen, um genau die gewünschte Erfahrung zu erzielen. Hier sind einige Anpassungen aufgeführt, die Sie hinzufügen können.

Benutzerdefinierte Einstiegs- und Exit-Animationen, die zur restlichen App passen

Ein mobiler Browser, der zwischen Bildschirmen wechselt und mit einer Website endet, die in einem benutzerdefinierten Tab geladen wird

Die Farbe der Symbolleiste wird an das Branding Ihrer App angepasst.

Mobiler Browser, der zu einem benutzerdefinierten Tab mit Farben, die einer Website entsprechen, wechselt

Farbkonsistenz, die in deiner App erhalten bleibt, auch wenn sie zwischen hellem und dunklem Design wechseln.

Und diese Farbkonsistenz bleibt in deiner App erhalten, auch wenn sie zwischen hellem und dunklem Design wechseln.

Benutzerdefinierte Aktionen und Einträge in der Symbolleiste des Browsers und in Menüs

Ein benutzerdefinierter Tab mit seinem Menü und benutzerdefinierten Einträgen.

Sie können die Starthöhe des benutzerdefinierten Tabs festlegen und beispielsweise Videos streamen, während Sie mit Ihrem Web Store interagieren.

Teilöffnung eines benutzerdefinierten Tabs mit festgelegter Höhe.

Nutzer können einen benutzerdefinierten Tab minimieren, um mit der zugrunde liegenden App zu interagieren, und sie jederzeit wiederherstellen, ohne dass ihr Fortschritt verloren geht. So haben Nutzer eine Alternative zum Schließen des benutzerdefinierten Tabs und können nahtlos zwischen dem Web und der nativen App mehrere Aufgaben gleichzeitig ausführen. Die Funktion ist ab Chrome 122 Beta standardmäßig für benutzerdefinierte Tabs aktiviert.

Minimieren Sie einen benutzerdefinierten Tab, um mit der Hintergrund-App zu interagieren.

Das ist bei Weitem nicht alles. Benutzerdefinierte Tabs sind sehr leistungsstark und werden laufend weiterentwickelt. Jeder Browser muss diese Funktionen unterstützen, sobald sie verfügbar sind. Fast alle Support bieten ein gewisses Maß an Unterstützung. Es ist jedoch wichtig zu wissen, welche Funktionen in den Browsern der Nutzer verfügbar sind und welche nicht. In der Tabelle zum Funktionsvergleich kannst du auf einen Blick die Verfügbarkeit der verschiedenen Funktionen in den gängigen Android-Browsern prüfen.

Sie können dies jetzt mit unserem Beispiel auf GitHub testen.

Wann sollte ich benutzerdefinierte Tabs verwenden?

Es gibt nicht nur eine „richtige“ Art, Webinhalte zu laden. In bestimmten Situationen ist WebView die richtige Technologie für den Einsatz. Dies ist beispielsweise der Fall, wenn Sie ausschließlich eigene Inhalte in Ihrer App hosten oder JavaScript direkt aus Ihrer App einfügen müssen. Wenn Nutzer über Ihre App zu URLs außerhalb von Domains weitergeleitet werden, sind diese Tabs aufgrund des gemeinsamen Status in benutzerdefinierten Tabs wahrscheinlich die bessere Wahl. Weitere Stärken von benutzerdefinierten Tabs:

  1. Sicherheit: Benutzerdefinierte Tabs verwenden Safe Browsing von Google, um Nutzer und Gerät vor gefährlichen Websites zu schützen.
  2. Leistungsoptimierung:
    1. Vorwärmen des Browsers im Hintergrund, während das Stehlen von Ressourcen der Anwendung vermieden wird.
    2. Beschleunigen Sie die Seitenladezeit durch spekulatives Laden von URLs im Voraus.
  3. Lebenszyklusverwaltung: Anwendungen, die einen benutzerdefinierten Tab starten, werden während der Verwendung der Tabs nicht vom System entfernt – ihre Bedeutung wird auf die Ebene „Vordergrund“ erhöht.
  4. Freigegebenes Cookie-Jar und Berechtigungsmodell, damit sich Nutzer nicht bei Websites anmelden müssen, mit denen sie bereits verbunden sind, und Berechtigungen, die sie bereits erteilt haben, nicht noch einmal erteilen müssen.
  5. Browserfunktionen wie der Datensparmodus werden gemeinsam genutzt, wenn sie aktiviert sind, sodass Inhalte schneller und kostengünstiger geladen werden.
  6. Synchronisierte AutoVervollständigung auf allen Geräten für besseres Ausfüllen von Formularen
  7. Nutzer können über eine integrierte Zurück-Schaltfläche zur App zurückkehren.

Benutzerdefinierte Tabs im Vergleich zu vertrauenswürdigen Webaktivitäten

Vertrauenswürdige Web-Aktivitäten erweitern das Protokoll für benutzerdefinierte Tabs und teilen die meisten Vorteile. Anstatt jedoch eine benutzerdefinierte UI bereitzustellen, können Entwickler einen Browsertab auch ohne UI öffnen. Es wird Entwicklern empfohlen, die ihre eigene progressive Web-App in ihrer eigenen Android-App im Vollbildmodus öffnen möchten.

Wo sind benutzerdefinierte Tabs verfügbar?

Benutzerdefinierte Tabs sind eine Funktion, die von Browsern auf der Android-Plattform unterstützt wird. Sie wurde ursprünglich in Version 45 von Chrome eingeführt. Das Protokoll wird von den meisten Android-Browsern unterstützt.

Wir freuen uns auf Feedback, Fragen und Vorschläge zu diesem Projekt. Wir empfehlen Ihnen daher, Probleme auf crbug.com zu melden und Fragen auf Twitter @ChromiumDev zu stellen.

Mehr erfahren

Zusätzlich zur GitHub-Demo gibt es eine Reihe von Leitfäden für den Einstieg in benutzerdefinierte Tabs.

Prüfen Sie bei Fragen das Tag chrome-custom-tabs in StackOverflow.