Kotlin WEBブラウザ

AndroidのChromeは全画面表示できないようなので、アプリケーションでWEBブラウザを実装してみました。 また、ジェスチャー操作が意図せず作動してページが戻ったり、再表示されたりと使い勝手が悪いので ジェスチャー操作を無効にしてみました。環境はAndroid Studio Giraffe(2022.3.1)で作成し、Android10で試しました。 初心者が書いたコードなので、ご利用の際は適宜修正してください。

※この記事は2024/01/26時点の情報です。

activity_main.xml
WEBブラウザを表示する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>

AndroidManifest.xml
インターネットに接続するための権限を設定しました。
具体的には以下の行を追加しました。
<uses-permission android:name="android.permission.INTERNET" />

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">
    <uses-permission android:name="android.permission.INTERNET" />
    <application
        android:allowBackup="true"
        android:dataExtractionRules="@xml/data_extraction_rules"
        android:fullBackupContent="@xml/backup_rules"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/Theme.Webbrowser"
        tools:targetApi="31">
        <activity
            android:name=".MainActivity"
            android:exported="true">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
</manifest>

build.gradle(:app)
一応、build.gradleの内容も掲載しておきます。

plugins {
    id 'com.android.application'
    id 'org.jetbrains.kotlin.android'
}

android {
    namespace 'com.example.webbrowser'
    compileSdk 34

    defaultConfig {
        applicationId "com.example.webbrowser"
        minSdk 29
        targetSdk 33
        versionCode 1
        versionName "1.0"

        testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
    }

    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro'
        }
    }
    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }
    kotlinOptions {
        jvmTarget = '1.8'
    }
}

dependencies {

    implementation 'androidx.core:core-ktx:1.9.0'
    implementation 'androidx.appcompat:appcompat:1.6.1'
    implementation 'com.google.android.material:material:1.11.0'
    implementation 'androidx.constraintlayout:constraintlayout:2.1.4'
    testImplementation 'junit:junit:4.13.2'
    androidTestImplementation 'androidx.test.ext:junit:1.1.5'
    androidTestImplementation 'androidx.test.espresso:espresso-core:3.5.1'
}

MainActivity.kt
今回のメインとなるプログラムです。
WebViewクラスの設定を行いスタートページを表示します。 また、タッチイベントでジェスチャーを処理しないようにしています。

package com.example.webbrowser

import android.os.Bundle
import android.view.MotionEvent
import android.webkit.WebSettings
import android.webkit.WebView
import android.webkit.WebViewClient
import androidx.appcompat.app.AppCompatActivity

class MainActivity : AppCompatActivity() {

    private lateinit var webView: WebView

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

        // WebView
        webView = findViewById(R.id.webView)
        // WebViewの設定
        val webSettings: WebSettings = webView.settings
        // JavaScriptを有効にする
        webSettings.javaScriptEnabled = true
        // WebViewClientを設定
        webView.webViewClient = object : WebViewClient() {}

        // スタートページ
        webView.loadUrl("https://www.google.co.jp/")
    }

    // ジェスチャーイベントを処理しないようにする
    override fun onTouchEvent(event: MotionEvent?): Boolean {
        return false
    }
}

今回のプログラムを実行した結果です。

KotlinでWebView

WEBブラウザの実装と聞くと、どうやって実装するの?と思ってしまいましたが WebViewクラスを使用すると簡単に実装できてしまいました。 ジェスチャーに関してもページが戻ったり、進んだりすることはなくなりました。 エッジを掴んでスワイプするとアプリケーションが閉じられてしまうので 機会があったら修正してみようと思います。

WEBブラウザの実装は理解できましたか?

KotlinでWEBブラウザを実装

よく分からないという人は実際に自分で試してみてくださいね。

管理人情報