WebViewの表示

Android, Java, アプリ

この記事は最終更新日から1年以上が経過しています。

AndroidでのWebVIewの表示について書いてみます。
こんな感じで割と簡単に書くことができます。
S3に置いてあるコンパイル済み(Vue.js => JavaScript)のファイルを読み込んでみます。

ゴール

WebView.png

環境

  • AndroidStudio (2.3.3)
  • ビルドスクリプト(gradle : プロジェクト作成時に自動的に生成されたもの)
// Top-level build file where you can add configuration options common to all sub-projects/modules.
 
buildscript {
    repositories {
        jcenter()
    }
    dependencies {
        classpath 'com.android.tools.build:gradle:2.3.3'
 
        // NOTE: Do not place your application dependencies here; they belong
        // in the individual module build.gradle files
    }
}
 
allprojects {
    repositories {
        jcenter()
    }
}
 
task clean(type: Delete) {
    delete rootProject.buildDir
}
 

apply plugin: 'com.android.application'
 
android {
    compileSdkVersion 26
    buildToolsVersion "25.0.0"
    defaultConfig {
        applicationId "com.example.t_okazaki.webview"
        minSdkVersion 20
        targetSdkVersion 26
        versionCode 1
        versionName "1.0"
        testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}
 
dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    androidTestCompile('com.android.support.test.espresso:espresso-core:2.2.2', {
        exclude group: 'com.android.support', module: 'support-annotations'
    })
    compile 'com.android.support:appcompat-v7:26.+'
    compile 'com.android.support.constraint:constraint-layout:1.0.2'
    testCompile 'junit:junit:4.12'
}
 

  • Manifestファイル
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.t_okazaki.webview">
    <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=".Webview">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
 
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
 
</manifest>

  • レイアウト部分
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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="com.example.t_okazaki.webview.Webview">
 
    <RelativeLayout
        android:id="@+id/parent"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:layout_editor_absoluteX="8dp"
        tools:layout_editor_absoluteY="8dp">
 
        <WebView
            android:id="@+id/webView"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            tools:layout_editor_absoluteX="8dp"
            tools:layout_editor_absoluteY="8dp" />
    </RelativeLayout>
 
</android.support.constraint.ConstraintLayout>
 

  • ソース部分
package com.example.t_okazaki.webview;
 
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.util.Log;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
 
import static com.example.t_okazaki.webview.R.id.webView;
 
public class Webview extends AppCompatActivity {
 
    private final String TARGET_URL = "[hogehoge]";
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        try {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_webview);
            WebView myWebView = this._getComponent();
            this._setNoCache(myWebView);
            this._denyStandardBrowser(myWebView);
            this._loadUrl(myWebView, TARGET_URL);
            this._grantJavaScript(myWebView);
        } catch(Exception e) {
            Log.e("[ERROR]","エラーが発生しました。");
        } finally {
            //必ず行う処理
        }
 
    }
 
    private WebView _getComponent() {
        WebView myWebView = (WebView) findViewById(webView);
        return myWebView;
    }
 
    private void _grantJavaScript(WebView myWebView) {
        myWebView.getSettings().setJavaScriptEnabled(true);
    }
 
    private void _loadUrl(WebView myWebView, String url) {
        myWebView.loadUrl(url);
    }
 
    private void _denyStandardBrowser(WebView myWebView) {
        myWebView.setWebViewClient(new WebViewClient());
 
    }
 
    private void _setNoCache(WebView myWebView) {
        myWebView.getSettings().setCacheMode(WebSettings.LOAD_NO_CACHE);
    }
 
}

この記事を書いた人

岡崎拓哉
岡崎拓哉
2016年に入社した新卒。ドラムとインコが好きな人。
最近は、デザイン駆動設計や関数型プログラミングに興味あり。
マネジメントも覚えていきたい系エンジニア。

Android, Java, アプリ