Android カスタムタブの概要

カスタムタブは Android ブラウザの機能であり、アプリ デベロッパーは、カスタマイズされたブラウザ エクスペリエンスをアプリ内に直接追加できます。

ウェブ コンテンツの読み込みは、スマートフォンの初期の頃からモバイルアプリの一部でしたが、古いオプションはデベロッパーにとって課題となる可能性があります。実際のブラウザを起動することは、ユーザーにとって負荷の高いコンテキスト スイッチであり、カスタマイズできません。一方、WebView はウェブ プラットフォームのすべての機能をサポートしていないため、ブラウザと状態を共有せず、メンテナンス オーバーヘッドが増加します。

カスタムタブを使用すると、ユーザーはブラウジング中にアプリ内に留まることができるため、エンゲージメントが向上し、ユーザーがアプリを放棄するリスクが軽減されます。これは、カスタムタブがユーザーの好みのブラウザから直接提供され、ブラウザの状態と機能を自動的に共有することで実現されます。リクエスト、権限付与、Cookie ストアを管理するためにカスタム コードを記述する必要はありません。

カスタムタブでできること

カスタムタブを使用すると、ユーザーが使用するブラウザが使用しているレンダリング エンジンでウェブ コンテンツが読み込まれます。すべての API やウェブ プラットフォーム機能は、カスタムタブで利用できます。ブラウジング セッション、保存したパスワード、お支払い方法、住所は、これまでどおりにすべて表示されます。

カスタムタブでカスタマイズできる内容

かなりあります。カスタムタブを使用すると、ブラウザの Chrome とユーザー エクスペリエンスをきめ細かく制御できます。アプリ内で、インテントを使用してカスタムタブを起動します。このインテントを呼び出すときに、CustomTabIntent にさまざまな属性を追加して、目的のエクスペリエンスを実現できます。追加できるカスタマイズの例を次に示します。

  • アプリの他の部分と一致するカスタムの開始アニメーションと終了アニメーション
  • アプリのブランディングに合わせてツールバーの色を変更する
  • ライトモードとダークモードを切り替えてもアプリの色が維持される
  • ブラウザのツールバーとメニューへのカスタム アクションとエントリ
  • カスタムタブの起動時の高さを制御し、ウェブストアでの操作中に動画をストリーミングするなどの機能を有効にします。

また、ユーザーはカスタムタブを最小化して基盤となるアプリを操作し、進行状況を失うことなくいつでも復元してジャーニーを再開できます。これにより、ユーザーはカスタムタブを閉じる代わりに、ウェブとネイティブ アプリの間でシームレスにマルチタスクを行うことができます。この機能は、カスタムタブでデフォルトで有効になっています。

ただし、これはすべてではありません。カスタムタブは非常に強力で、現在も開発中です。各ブラウザでは、これらの機能が利用可能になり次第、そのサポートを追加する必要があります。ほとんどのブラウザで何らかのレベルでサポートされていますが、ユーザーのブラウザで利用できる機能と利用できない機能があることを理解しておくことが重要です。一般的な Android ブラウザで利用できるさまざまな機能については、機能の比較表をご覧ください。

GitHub のサンプルで、この機能を今すぐテストできます。

カスタムタブはどのような場合に使用すればよいですか?

ウェブ コンテンツを読み込む方法に「正しい」方法はありません。状況によっては、WebView が適切なテクノロジーになります。たとえば、アプリ内で独自のコンテンツをのみホストしている場合や、アプリから直接 JavaScript を挿入する必要がある場合、アプリがドメイン外の URL に誘導される場合、カスタムタブに組み込まれた共有状態により、適切な選択肢である可能性が高いと考えられます。カスタムタブのその他のメリットは次のとおりです。

  1. セキュリティ: カスタムタブは Google のセーフ ブラウジングを使用して、ユーザーとデバイスを危険なサイトから保護します。
  2. パフォーマンスの最適化:
    1. アプリケーションからリソースを奪うことなく、バックグラウンドでブラウザを事前にウォームアップする。
    2. URL を事前に読み込むことで、ページの読み込み時間を短縮します。
  3. ライフサイクル管理: カスタムタブを起動するアプリは、タブの使用中にシステムによって強制終了されません。その重要度は「フォアグラウンド」レベルに引き上げられます。
  4. 共有 Cookie ジャーと権限モデルにより、ユーザーはすでに接続しているサイトにログインしたり、すでに付与した権限を再度付与したりする必要がなくなります。
  5. フォームの入力を効率化するための自動入力などのブラウザ機能は、すぐに利用できます。
  6. ユーザーは、統合された [戻る] ボタンを使用してアプリに戻ることができます。

カスタム タブと Trusted Web Activity

信頼できるウェブ アクティビティはカスタムタブ プロトコルを拡張し、そのメリットのほとんどを共有します。ただし、カスタマイズされた UI を提供するのではなく、デベロッパーは UI なしでブラウザタブを開くことができます。独自の プログレッシブ ウェブアプリを、独自の Android アプリ内で全画面で開きたいデベロッパーにおすすめします。

カスタムタブはどこで利用できますか?

カスタムタブは、Android プラットフォームのブラウザでサポートされている機能です。最初に Chrome のバージョン 45 で導入されました。このプロトコルは、ほとんどの Android ブラウザでサポートされています。

このプロジェクトに関するフィードバック、ご質問、ご提案をお待ちしています。よろしければ、crbug.com で問題を報告し、Twitter の @ChromiumDev で質問することをおすすめします。

始める

GitHub デモのほかに、カスタムタブの使用を開始するためのガイドがいくつかあります。

不明な点がある場合は、StackOverflow の chrome-custom-tabs タグを確認してください。