AndroidでWebViewのURL読み込み完了を検知する方法を解説

はじめに

この記事では、AndroidアプリにおいてWebViewがURLの読み込みを完了したタイミングを検知（リッスン）する方法を、実際に動作するサンプルコードとともに解説します。

読み込み完了を検知できるようになると、ローディング中のプログレス表示や、読み込み完了時のトースト通知など、ユーザー体験を向上させる処理を簡単に実装できるようになります。

実装手順

ステップ1：新規プロジェクトを作成する

Android Studioを起動し、メニューから File → New Project を選択して新しいプロジェクトを作成します。必要な項目をすべて入力してプロジェクトをセットアップしてください。

ステップ2：レイアウトファイル（activity_main.xml）を編集する

res/layout/activity_main.xml に以下のコードを記述します。上部に進捗を表示するTextView、中央にWebView、下部にURL読み込みを開始するButtonを配置した構成です。

<RelativeLayout xmlns:android="https://schemas.android.com/apk/res/android"
    xmlns:tools="https://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="4dp"
    tools:context=".MainActivity">
    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="24sp"
        android:textColor="#000000"
        android:padding="5dp" />
    <WebView
        android:id="@+id/webView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@id/textView"/>
    <Button
        android:id="@+id/btnLoad"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Load URL"
        android:layout_alignParentBottom="true"/>
</RelativeLayout>

ステップ3：MainActivity.java を編集する

src/MainActivity.java に以下のコードを記述します。

import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Button;
import android.widget.TextView;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {
    WebView webView;
    TextView textView;
    Button btnLoad;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        textView = findViewById(R.id.textView);
        btnLoad = findViewById(R.id.btnLoad);
        webView = findViewById(R.id.webView);
        webView.setWebViewClient(new WebViewClient());
        btnLoad.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                webView.setWebViewClient(new WebViewClient() {
                    public void onPageFinished(WebView view, String weburl) {
                        Toast.makeText(MainActivity.this, "Your WebView is Loaded....", Toast.LENGTH_LONG).show();
                    }
                });
                webView.setWebChromeClient(new WebChromeClient() {
                    public void onProgressChanged(WebView view, int newProgress) {
                        textView.setText("Page loading : " + newProgress + "%");
                        if (newProgress == 100) {
                            textView.setText("Page Loaded.");
                        }
                    }
                });
                webView.loadUrl("https://www.tutorialspoint.com");
            }
        });
    }
}

このコードの重要なポイントは次の2つです。

• onPageFinished()（WebViewClient）：ページの読み込みが完了した瞬間に呼び出されるコールバックメソッドです。ここではトーストで「読み込み完了」を通知しています。
• onProgressChanged()（WebChromeClient）：読み込みの進捗（0〜100%）をリアルタイムに取得できるコールバックメソッドです。進捗をTextViewにパーセント表示し、100%に達したら「Page Loaded.」に切り替えています。

ステップ4：AndroidManifest.xml に権限を追加する

インターネット上のURLを読み込むため、androidManifest.xml に INTERNET権限 を追加します。これを忘れるとWebViewが真っ白なまま何も表示されないので注意しましょう。

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="https://schemas.android.com/apk/res/android" package="app.com.sample">
    <uses-permission android:name="android.permission.INTERNET"/>
    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
</manifest>

アプリを実行してみよう

それではアプリを実行してみましょう。ここでは、実機のAndroidスマートフォンがPCに接続されていることを前提としています。Android Studioでプロジェクト内のアクティビティファイルを開き、ツールバーの Run アイコンをクリックしてください。接続済みのモバイルデバイスを選択すると、端末にアプリの初期画面が表示されます。

「Load URL」ボタンをタップすると、指定したURLの読み込みが開始され、TextViewに読み込み進捗がパーセントで表示されていきます。そして読み込みが完了すると、トーストで完了が通知されます。