Android
WebView
サーチ…
前書き
WebViewは、アプリケーション内にWebページを表示するビューです。これにより、独自のURLを追加できます。
備考
Androidマニフェストファイルに権限を追加することを忘れないでください
<uses-permission android:name="android.permission.INTERNET" />
WebViewのJavaScriptアラートダイアログ - 動作させる方法
デフォルトでは、WebViewはJavaScriptアラートダイアログを実装していません。 alert()は何もしません。まずJavaScriptを有効にして（明らかに..）、 WebChromeClientを設定して、ページからの警告ダイアログのリクエストを処理するようにするには、次のようにします。
webView.setWebChromeClient(new WebChromeClient() {
//Other methods for your WebChromeClient here, if needed..
@Override
public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
return super.onJsAlert(view, url, message, result);
}
});
ここでは、 onJsAlertをオーバーライドしてから、スーパーインプリメンテーションを呼び出して、標準のAndroidダイアログを提供します。カスタムスタイルのダイアログを作成する場合やログに記録する場合など、メッセージやURLを自分で使用することもできます。
JavascriptからJavaへの通信（Android）
Androidのアクティビティ
package com.example.myapp;
import android.os.Bundle;
import android.app.Activity;
import android.webkit.WebView;
public class WebViewActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
WebView webView = new WebView(this);
setContentView(webView);
/*
* Note the label Android, this is used in the Javascript side of things
* You can of course change this.
*/
webView.addJavascriptInterface(new JavascriptHandler(), "Android");
webView.loadUrl("http://example.com");
}
}
Java Javascript Handler
import android.webkit.JavascriptInterface;
public class JavascriptHandler {
/**
* Key point here is the annotation @JavascriptInterface
*
*/
@JavascriptInterface
public void jsCallback() {
// Do something
}
@JavascriptInterface
public void jsCallbackTwo(String dummyData) {
// Do something
}
}
ウェブページ、Javascriptコール
<script>
...
Android.jsCallback();
...
Android.jsCallback('hello test');
...
</script>
余分なヒント
複雑なデータ構造を渡す場合、可能な解決策はJSONを使用することです。
Android.jsCallback('{ "fake-var" : "fake-value", "fake-array" : [0,1,2] }');
Android側では、お気に入りのJSONパーサーを使用してください：JSONObject
JavaからJavascriptへの通信
基本的な例
package com.example.myapp;
import android.os.Bundle;
import android.app.Activity;
import android.webkit.WebView;
public class WebViewActivity extends Activity {
private Webview webView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
webView = new WebView(this);
webView.getSettings().setJavaScriptEnabled(true);
setContentView(webView);
webView.loadUrl("http://example.com");
/*
* Invoke Javascript function
*/
webView.loadUrl("javascript:testJsFunction('Hello World!')");
}
/**
* Invoking a Javascript function
*/
public void doSomething() {
this.webView.loadUrl("javascript:testAnotherFunction('Hello World Again!')");
}
}
ダイヤラの例を開く
Webページに電話番号が含まれている場合は、電話のダイヤラを使用して電話をかけることができます。このコードは、telで始まるURLをチェックしてから、ダイヤラを開く予定であり、クリックした電話番号に電話をかけることができます。
public boolean shouldOverrideUrlLoading(WebView view, String url) {
if (url.startsWith("tel:")) {
Intent intent = new Intent(Intent.ACTION_DIAL,
Uri.parse(url));
startActivity(intent);
}else if(url.startsWith("http:") || url.startsWith("https:")) {
view.loadUrl(url);
}
return true;
}
コンソールメッセージの印刷またはリモートデバッグによるWebViewのトラブルシューティング
webviewコンソールメッセージをlogcatに出力する
処理するにはconsole Webページからのメッセージを、あなたは上書きすることができonConsoleMessageでWebChromeClient ：
final class ChromeClient extends WebChromeClient {
@Override
public boolean onConsoleMessage(ConsoleMessage msg) {
Log.d(
"WebView",
String.format("%s %s:%d", msg.message(), msg.lineNumber(), msg.sourceId())
);
return true;
}
}
あなたの活動や断片にそれを設定してください：
webView.setWebChromeClient(new ChromeClient());
したがって、このサンプルページ：
<html>
<head>
<script type="text/javascript">
console.log('test message');
</script>
</head>
<body>
</body>
</html>
logcatにログ 'test message'を書き込みます：
WebView：テストメッセージsample.html：4
console.info() 、 console.warn() 、 console.error()もchrome-clientでサポートされています。
ChromeでAndroidデバッグをリモートデバッグする
あなたはデスクトップChromeからリモートデバッグWebviewベースのアプリケーションを実行できます。
Android搭載端末でUSBデバッグを有効にする
Android搭載端末で、[設定]を開き、[開発者オプション]セクションを見つけて、USBデバッグを有効にします。
Android搭載端末を接続して検出する
Chromeページの次のページを開く： chrome：// inspect /＃devices
Inspect Devicesダイアログでデバイスを選択し、 inspectを押します。 ChromeのDevToolsの新しいインスタンスが開発マシンに公開されます。
より詳細なガイドラインとデベロッパーツールの説明は、上で見つけることができますdevelopers.google.com
ローカルファイルを開く/ Webviewで動的コンテンツを作成する
Layout.xml
<WebView
android:id="@+id/WebViewToDisplay"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center"
android:fadeScrollbars="false" />
WebViewToDisplayにデータをロードする
WebView webViewDisplay;
StringBuffer LoadWEb1;
webViewDisplay = (WebView) findViewById(R.id.WebViewToDisplay);
LoadWEb1 = new StringBuffer();
LoadWEb1.append("<html><body><h1>My First Heading</h1><p>My first paragraph.</p>");
//Sample code to read parameters at run time
String strName = "Test Paragraph";
LoadWEb1.append("<br/><p>"+strName+"</p>");
String result = LoadWEb1.append("</body></html>").toString();
WebSettings webSettings = webViewDisplay.getSettings();
webSettings.setJavaScriptEnabled(true);
webViewDisplay.getSettings().setBuiltInZoomControls(true);
if (android.os.Build.VERSION.SDK_INT >= 11){
webViewDisplay.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
webViewDisplay.getSettings().setDisplayZoomControls(false);
}
webViewDisplay.loadDataWithBaseURL(null, result, "text/html", "utf-8",
null);
//To load local file directly from assets folder use below code
//webViewDisplay.loadUrl("file:///android_asset/aboutapp.html");