ウェブ コンテンツをプライマリ コンテンツまたは補助コンテンツとしてアプリに埋め込む

Android では、ネイティブ アプリ内でウェブの機能を活用できるため、特定の種類のコンテンツを柔軟かつ効率的に表示できます。

WebView を使用したコンテンツの埋め込み

WebView API を使用すると、デベロッパーはミニブラウザの機能を利用し、アプリ内でウェブ コンテンツを表示できます。これにより、図 1 に示すように、ウェブを活用したエクスペリエンスをアプリ内のコアまたはサポート部分として提供できます。

Google Play に開いた Android アプリ。プライマリ ウェブビューが赤い枠でハイライト表示されています 赤いボックス内に補足テキストが表示された状態で開いている Android アプリ。
図 1. WebView をプライマリ コンテンツ(左)と補助コンテンツ(右)としてアプリに埋め込んだウェブ コンテンツ。

WebView でできること

アプリで WebView を使用すると、次のことができます。

ウェブを埋め込む: WebView は、ボタンやテキスト フィールドと同様に、コンポーネントとしてアプリのユーザー インターフェースに統合されます。

コンテンツを読み込む: WebView は、さまざまなソースからウェブ コンテンツを読み込むことができます。

  • リモート URL: 通常のブラウザと同様に、インターネットからウェブページを取得して表示できます。
  • ローカル ファイル: アプリのリソース内に保存されている HTML、CSS、JavaScript ファイルを読み込むことができます。
  • 動的に生成されたコンテンツ: アプリは HTML コンテンツをオンザフライで生成して WebView にフィードできます。

レンダリング: WebView はブラウザ エンジンを使用して HTML、CSS、JavaScript を解析してレンダリングし、生成されたウェブページをアプリの UI の指定された領域に表示します。

JavaScript を実行する: WebView は、読み込まれたウェブページのコンテキスト内で JavaScript コードを実行できます。これにより、WebView 内での動的な操作と更新が可能になります。

ネイティブ アプリとの連携: WebView の強みが発揮されるのは、この機能です。これにより、ウェブページとアプリ間の双方向通信が可能になります。

  • JavaScript からネイティブ: WebView で実行される JavaScript コードは、アプリのホスト API を呼び出して、カメラ、GPS、センサーなどのデバイス機能にアクセスできます。
  • JavaScript ネイティブ: アプリは、WebView に JavaScript コードを挿入したり、ウェブページのコンテンツを操作したり、ウェブページによってトリガーされたイベントに応答したりすることもできます。

WebView と Chrome などの一般的なブラウザの違いは何ですか?

WebView は、ウェブへのウィンドウのコア機能を提供する高度なカスタム コンポーネントです。WebView の全体的なエクスペリエンスは、ウェブをより幅広くナビゲートするために必要なナビゲーション バーやその他のユーザーニーズを提供するブラウザとは異なり、アプリの設計と目的によって形作られます。

WebView と標準ブラウザの違いについて詳しくは、次の説明をご覧ください。

UI: WebView はウェブ コンテンツの表示に使用され、他の一般的なブラウザ(ホームボタン、URL バー、ナビゲーション、設定など)のような独自のヘッダーや UI はありません。

機能: 多くのブラウザには、ブックマーク、権限、履歴など、ブラウジング エクスペリエンスを拡張するための追加機能が組み込まれています。

アップデート: Android WebView は Android のシステム サービスであるため、アップデートは毎月プッシュされ、アプリに自動的に統合されます。ブラウザは、対応するアプリのアップデートと、エンドユーザーがデバイスにアップデートを適用することを前提としています。

どこから始めればよいですか?

アプリで WebView を使用する方法については、WebView でウェブアプリを作成するをご覧ください。

参考情報

WebView オブジェクトまたはカスタムタブを使用して Android デバイス向けウェブページを開発するには、次のドキュメントをご覧ください。