在Android手机中内置了一款高性能webkit内核浏览器，在SDK中封装为一个叫做WebView组件。
一、使用WebView
1.加入权限
<uses-permission android:name="android.permission.INTERNET" />
2.创建一个webView
通过布局
<WebView android:id="@+id/webkit" android:layout_width="fill_parent" android:layout_height="fill_parent" />
或则直接在代码中创建
WebView webView=new WebView(this);
3.通过WebViewClient加载
mWebView.setWebViewClient(new WebViewClient(){ public boolean shouldOverrideUrlLoading(WebView view, String url) { view.loadUrl(url); return true; } });
4.辅助类WebSettings
通过browser.getSettings()获取WebSettings
a)可以集成对JS的脚本支持
browser.getSettings().setJavaScriptEnabled(true);
b)对网页的缩放
browser.getSettings().setSupportZoom(true);//网页缩放
对于android4.0版本(4.1是否存在,有待研究)上述方式是不能够实现的
需要继续加入代码
browser.getSettings().setBuiltInZoomControls(true); browser.getSettings().setDefaultZoom(ZoomDensity.CLOSE);//默认缩放模式 browser.setInitialScale(100);
5.加载本地资源assert目录下文件
browser.loadUrl("file:///android_asset/testChart.html");
6.对于返回的控制
重写WebViewClient的onKeyDown方法
public boolean onKeyDown(int keyCode, KeyEvent event) { if ((keyCode == KeyEvent.KEYCODE_BACK) && browser.canGoBack()) { browser.goBack(); return true; } return super.onKeyDown(keyCode, event); }
7.加入对JS的调用
<script language="javascript"> /* This function is invoked by the activity */ function wave() { alert("1"); // document.getElementById("droid").src="android_waving.png"; alert("2"); } </script> <body> <!-- Calls into the javascript interface for the activity --> <a onClick="window.demo.clickOnAndroid()"><div style="80px; margin:0px auto; padding:10px; text-align:center; border:2px solid #202020;" > Click me! </div></a> </body>
mWebView.addJavascriptInterface(new DemoJavaScriptInterface(), "demo"); final class DemoJavaScriptInterface { DemoJavaScriptInterface() { } /** * This is not called on the UI thread. Post a runnable to invoke * loadUrl on the UI thread. */ public void clickOnAndroid() { mHandler.post(new Runnable() { public void run() { mWebView.loadUrl("javascript:wave()"); } }); } }
ps:貌似android2.3版本会有VM aborting的问题。
如果需要调用alert的话,需要重写WebChromeClient
mWebView.setWebChromeClient(new MyWebChromeClient()); final class MyWebChromeClient extends WebChromeClient { @Override public boolean onJsAlert(WebView view, String url, String message, JsResult result) { /* Log.d(LOG_TAG, message); result.confirm(); return true;*/ return super.onJsAlert(view, url, message, result); } }
当然我们也可以捕获alert的内容,然后进行重写
mWebView.setWebChromeClient(new WebChromeClient() { @Override public boolean onJsAlert(WebView view, String url, String message, final JsResult result) { AlertDialog.Builder b2 = new AlertDialog.Builder(MainActivity.this) .setTitle("alert title").setMessage(message) .setPositiveButton("ok", new AlertDialog.OnClickListener() { @Override public void onClick(DialogInterface dialog, int which) { result.confirm(); // MyWebView.this.finish(); } }); b2.setCancelable(false); b2.create(); b2.show(); return true; } });
感谢vanekey兄的大力支持
更多移步这里:
https://code.google.com/p/android/issues/detail?id=12987
http://stackoverflow.com/questions/10104265/android-webview-javascript-doesnt-fire-the-call-back-function
http://www.linuxidc.com/Linux/2011-05/35782.htm