Help us understand the problem. What is going on with this article?

Android StudioでwebViewを使ってみる!

More than 3 years have passed since last update.

概要

Android StudioでwebViewを使って簡単なブラウザアプリを作る時のメモ。
アプリを起動したらサイトを閲覧できるという状況までを作成する。

※環境はMac mini(OS X mavericks)。Android Studioは2015/06/13時点で最新版のものを利用した。

はじめに

はじめに、ブランクアプリを設定し、適当にプロジェクト名をつけておく。

レイアウト

activity_main.xml
<RelativeLayout <!-- 省略-->
    <WebView  xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/webView1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        />
</RelativeLayout>

RelativeLayoutタグの中にwebViewを追加します。
id名を適当につけておく。

AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.xxxx.xxxxxxx.myapplication" >
        <uses-sdk android:minSdkVersion="8" android:targetSdkVersion="15" />
        <uses-permission android:name="android.permission.INTERNET"/>
        <application android:allowBackup="true"
         android:icon="@mipmap/ic_launcher"
         android:label="@string/app_name"
         android:theme="@style/AppTheme" >
        <activity android:name=".MainActivity" android:label="@string/app_name" >
        <intent-filter>
           <action android:name="android.intent.action.MAIN" />
           <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
      </activity>
   </application>
</manifest>

AndroidManifest.xmlのmanifestタグに
<uses-permission android:name="android.permission.INTERNET"/>
を追加。

webView

import android.webkit.WebView;
import android.webkit.WebViewClient;

まず最初に上の2つをMainActivityの中に記述します。

MainActivity.java
public class MainActivity extends Activity {

    @SuppressLint("SetJavaScriptEnabled")
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //レイアウトで指定したWebViewのIDを指定する。
        WebView  myWebView = (WebView)findViewById(R.id.webView1);

        //リンクをタップしたときに標準ブラウザを起動させない
        myWebView.setWebViewClient(new WebViewClient());

        //最初にgoogleのページを表示する。
        myWebView.loadUrl("http://www.google.co.jp");

        //jacascriptを許可する
        myWebView.getSettings().setJavaScriptEnabled(true);
    }


    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }
}

MainActivityの中にこれを記述します。

ローカルのHTMLを呼び出す

ローカルのHTMLを表示する場合は、/プロジェクト名/src/main/にフォルダ(assets)を作り、その中にindex.htmlを作成する。また呼び出すURIを
webView1.loadUrl("file:///android_asset/index.html");
に変更する。

追記

webViewの上下左右に謎の余白が出来るがactivity_main.xmlの中のRelativeLayoutをこのようにすれば余白が消えた。

activity_main.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity"

    >
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away