AndroidのWebViewアプリを作成する方法【Kotlin】

■はじめに

WebViewだけのアプリを作成する方法を記載します。

環境はKotlinで、Minimum SDKはAndroid8.0としてプロジェクトを作成してください。

■手順

「activity_main.xml」を以下のように書き換えます。

※「TextView」を「WebView」に変更しました。

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <WebView
        android:id="@+id/webView"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

「styles.xml」を以下のように書き換えます。

※ヘッダー部分を非表示にする処理です。

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>

        <item name="windowNoTitle">true</item>
        <item name="windowActionBar">false</item>
        <item name="android:windowFullscreen">true</item>
        <item name="android:windowContentOverlay">@null</item>
    </style>

</resources>

「MainActivity.kt」を以下のように書き換えます。

※WebViewの表示処理です。（Googleの検索トップを表示するようにしています。）

※[パッケージ名]は環境に合わせてください。

package [パッケージ名]

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.webkit.WebView
import android.webkit.WebViewClient
import kotlinx.android.synthetic.main.activity_main.*

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)


        // JavaScriptを有効化
        webView.settings.javaScriptEnabled = true
        // Web Storage を有効化
        webView.settings.domStorageEnabled = true

        webView.webViewClient = object: WebViewClient(){
            override fun shouldOverrideUrlLoading(
                    view: WebView?,
                    url: String?
            ): Boolean {
                view?.loadUrl(url)
                return true
            }
        }

        webView.loadUrl("https://www.google.com/")
    }
}

「AndroidManifest.xml」を以下のように書き換えます。

※「android.permission.INTERNET」を追加してWebアクセスを許可しています。

※[パッケージ名]は環境に合わせてください。

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="[パッケージ名]">

    <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>

■おまけ

上記で実装は完成です。

ただ、シミュレータだとうまく動いてくれません。

※「net::ERR_NAME_NOT_RESOLVED」のエラーが発生しました。

なので、実機で動作確認するようにしてください。