Android
 Computer >> コンピューター >  >> プログラミング >> Android

AndroidのWebViewでHTMLコンテンツを読み込む方法【サンプルコード付き】

AndroidのWebViewでHTMLコンテンツを読み込む方法

この記事では、AndroidアプリのWebViewを使用して、HTMLコンテンツを読み込み・表示する方法を、ステップごとにわかりやすく解説します。WebViewを活用すれば、アプリ内にWebページやローカルのHTMLを簡単に表示できるようになります。

手順1:Android Studioで新規プロジェクトを作成する

まず、Android Studioを起動し、メニューから「File → New Project」を選択します。必要な情報をすべて入力して、新しいプロジェクトを作成しましょう。

手順2:レイアウトファイル(activity_main.xml)にコードを追加する

res/layout/activity_main.xml に以下のコードを追加してください。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"
   xmlns:app="https://schemas.android.com/apk/res-auto"
   xmlns:tools="https://schemas.android.com/tools"
   android:layout_width="match_parent"
   android:gravity="center"
   android:layout_height="match_parent"
   tools:context=".MainActivity"
   android:orientation="vertical">
   <WebView
      android:id="@+id/web_view"
      android:layout_width="match_parent"
      android:layout_height="match_parent" />
</LinearLayout>

上記のコードでは、HTMLコンテンツを表示するためのWebViewを画面全体に配置しています。

手順3:MainActivity.java にコードを追加する

次に、src/MainActivity.java に以下のコードを追加します。

package com.example.myapplication;
import android.app.ProgressDialog;
import android.os.Build;
import android.os.Bundle;
import android.support.annotation.RequiresApi;
import android.support.v7.app.AppCompatActivity;
import android.webkit.WebChromeClient;
import android.webkit.WebView;

public class MainActivity extends AppCompatActivity {
    @RequiresApi(api = Build.VERSION_CODES.P)
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        final ProgressDialog progressDialog = new ProgressDialog(this);
        progressDialog.setMessage("Loading Data...");
        progressDialog.setCancelable(false);

        WebView web_view = findViewById(R.id.web_view);
        web_view.requestFocus();
        web_view.getSettings().setLightTouchEnabled(true);
        web_view.getSettings().setJavaScriptEnabled(true);
        web_view.getSettings().setGeolocationEnabled(true);
        web_view.setSoundEffectsEnabled(true);

        // HTMLコンテンツを読み込む
        web_view.loadData("<html><body>Hello, world!</body></html>",
            "text/html", "UTF-8");

        web_view.setWebChromeClient(new WebChromeClient() {
            public void onProgressChanged(WebView view, int progress) {
                if (progress < 100) {
                    progressDialog.show();
                }
                if (progress == 100) {
                    progressDialog.dismiss();
                }
            }
        });
    }
}

コードのポイント:

  • loadData() メソッドを使うと、文字列として渡したHTMLを直接WebViewに読み込めます。
  • setJavaScriptEnabled(true) でJavaScriptの実行を有効化しています。
  • WebChromeClientonProgressChanged() でロード進捗を監視し、ProgressDialogの表示・非表示を切り替えています。

手順4:アプリを実行する

それでは、実際にアプリケーションを実行してみましょう。実機のAndroidスマートフォンをパソコンに接続していることを前提としています。

Android Studioでプロジェクト内のアクティビティファイルを開き、ツールバーの「Run」アイコンをクリックします。デバイス選択画面で接続したモバイル端末を選択すると、端末上に以下のような画面が表示されます。

AndroidのWebViewでHTMLコンテンツを読み込む方法【サンプルコード付き】


補足:ProgressDialogは現在非推奨(Deprecated)となっているため、最新の開発環境ではProgressBarやAlertDialogの使用が推奨されます。

  1. AndroidのassetsフォルダからWebViewへHTMLファイルを読み込む方法を徹底解説

    はじめに Androidアプリ開発では、HTMLファイルや画像などの静的コンテンツをアプリ内に組み込みたいケースがよくあります。この記事では、assetsフォルダに配置したHTMLファイルをWebViewで読み込んで表示する方法を、サンプルコード付きでステップごとに解説します。 ステップ1:新規プロジェクトを作成する Android Studioを起動し、メニューから「File」→「New Project」を選択して新しいプロジェクトを作成します。プロジェクト名やパッケージ名など、必要な項目を入力して進めてください。 ステップ2:レイアウトファイル(activity_main.xml)を編

  2. 【Android】URLをエンコードする方法をわかりやすく解説|URLEncoderの使い方

    AndroidでURLをエンコードするには? 本記事では、AndroidアプリでURLを適切にエンコードする方法を、実際に動作するサンプルコードとともに解説します。 URLに検索キーワードなどのパラメータを含めたい場合、スペースや日本語などの特殊文字がそのまま含まれていると、正しくリクエストが送信できないことがあります。そんなときに役立つのが java.net.URLEncoder クラスです。このクラスを使えば、文字列をUTF-8などでエンコードし、URLとして安全な形式に変換できます。 手順1:新しいプロジェクトを作成する Android Studioを起動し、メニューから「File」→