Android开发实践 带你理解使用WebView
来源:互联网 发布:天音淘宝价格 编辑:程序博客网 时间:2024/05/16 16:08
转载请注明出处:http://blog.csdn.net/smartbetter/article/details/51622418
有时候我们会碰到在应用程序中显示一些网页的需求,但是不允许打开系统浏览器,这个时候就要用到系统为我们提供的 WebView 控件了,借助它我们就可以在自己的应用程序里嵌入一个浏览器,从而非常轻松地展示各种各样的网页。android.webkit.WebView本身就是一个浏览器实现,它的内核基于开源WebKit引擎。并且Android还可以通过WebView来实现和js的交互,在程序中调用js代码,只需要将WebView控件的支持js的属性设置为true即可。强大的WebView一定会助力开发者开发出更好的应用程序。
WebView常用方法如下:
更多的请查阅官方文档(https://developer.android.google.cn/reference/android/webkit/WebView.html)
1.加载URL对应的页面
// 需要声明权限 <uses-permission android:name="android.permission.INTERNET"/>WebView webview = (WebView) findViewById(R.id.web_view);webview.getSettings().setJavaScriptEnabled(true); // 设置可以使用jswebview.setWebViewClient(new WebViewClient());if(url.indexOf("http")==-1){ url="http://"+url;}webview.loadUrl(url);
2.加载HTML代码
WebView提供了loadDataWithBaseURL(String baseUrl, String data, String mimeType, String encoding, String historyUrl)方法,参数说明如下:
baseUrl:作为网页输入的网址(一般null)data:需要加载的HTML代码mimeType:指定HTML代码的MIME类型,HTML可指定为text/htmlencoding:指定HTML代码的字符编码historyUrl:历史输入的网址(一般null)
WebView webview = (WebView) findViewById(R.id.webview);StringBuilder sb = new StringBuilder();// 拼接一段HTML代码sb.append("<html>");sb.append("<head>");sb.append("<title> Test </title>");sb.append("</head>");sb.append("<body>");sb.append("<h2> Test Page </h2>");sb.append("</body>");sb.append("</html>");// 使用简单的loadData方法会导致乱码// webview.loadData(sb.toString(), "text/html", "utf-8");// 加载、并显示HTML代码webview.loadDataWithBaseURL(null, sb.toString(), "text/html", "utf-8", null);
3.通过WebView和js的交互
Android中可以通过WebView来实现和js的交互,在程序中调用js代码,只需要将WebView控件的支持js的属性设置为true
Android(Java)与 JavaScript(HTML)交互有四种情况:
1)Android(Java)调用HTML中js代码2)Android(Java)调用HTML中js代码(带参数)3)HTML中js调用Android(Java)代码4)HTML中js调用Android(Java)代码(带参数)
下面示例总结这四种情况,直接上干货:
1.Android-Java
private void showWebView() { // webView与js交互代码 try { mWebView = new WebView(this); setContentView(mWebView); mWebView.requestFocus(); mWebView.setWebChromeClient(new WebChromeClient() { @Override public void onProgressChanged(WebView view, int progress) { JSAndroidActivity.this.setTitle("Loading..."); JSAndroidActivity.this.setProgress(progress); if (progress >= 80) { JSAndroidActivity.this.setTitle("JsAndroid Test"); } } }); mWebView.setOnKeyListener(new View.OnKeyListener() { // webview can // go back @Override public boolean onKey(View v, int keyCode, KeyEvent event) { if (keyCode == KeyEvent.KEYCODE_BACK && mWebView.canGoBack()) { mWebView.goBack(); return true; } return false; } }); WebSettings webSettings = mWebView.getSettings(); webSettings.setJavaScriptEnabled(true); webSettings.setDefaultTextEncodingName("utf-8"); mWebView.addJavascriptInterface(getHtmlObject(), "jsObj"); mWebView.loadUrl("http://192.168.1.121:8080/jsandroid/index.html"); } catch (Exception e) { e.printStackTrace(); } } private Object getHtmlObject() { Object insertObj = new Object() { public String HtmlcallJava() { return "Html call Java"; } public String HtmlcallJava2(final String param) { return "Html call Java : " + param; } public void JavacallHtml() { runOnUiThread(new Runnable() { @Override public void run() { mWebView.loadUrl("javascript: showFromHtml()"); Toast.makeText(JSAndroidActivity.this, "clickBtn", Toast.LENGTH_SHORT).show(); } }); } public void JavacallHtml2() { runOnUiThread(new Runnable() { @Override public void run() { mWebView.loadUrl("javascript: showFromHtml2('IT-homer blog')"); Toast.makeText(JSAndroidActivity.this, "clickBtn2", Toast.LENGTH_SHORT).show(); } }); } }; return insertObj; }
2.js-HTML
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="Expires" content="0"> <meta http-equiv="Pragma" content="no-cache"> <meta http-equiv="Cache-Control" content="no-store,no-cache"> <meta name="Handheldfriendly" content="true"> <meta name="viewport" content="width=100%; initial-scale=1.0; user-scalable=yes"> <meta name="robots" content="all"> <meta name="keywords" contect="doodle, mobile, doodlemobile, game, games"> <meta name="description" content="Make People's Mobile Life More Connected Through Games."> <title> jsandroid_test </title> <script type="text/javascript" language="javascript"> function showHtmlcallJava(){ var str = window.jsObj.HtmlcallJava(); alert(str); } function showHtmlcallJava2(){ var str = window.jsObj.HtmlcallJava2("IT-homer blog"); alert(str); } function showFromHtml(){ document.getElementById("id_input").value = "Java call Html"; } function showFromHtml2( param ){ document.getElementById("id_input2").value = "Java call Html : " + param; } </script> </head> <body> hello IT-homer<br> <br> <br> <form> <input type="button" value="HtmlcallJava" onclick="showHtmlcallJava()"><br> <input type="button" value="HtmlcallJava2" onclick="showHtmlcallJava2()"><br> <br> <br> <br> <input id="id_input" style="width: 90%" type="text" value="null"><br> <input type="button" value="JavacallHtml" onclick="window.jsObj.JavacallHtml()"><br> <br> <br> <input id="id_input2" style="width: 90%" type="text" value="null"><br> <input type="button" value="JavacallHtml2" onclick="window.jsObj.JavacallHtml2()"> </form> </body> </html>
3.运行结果
4.代码解析
1) 允许Android执行js脚本设置
Android(Java)与js(HTML)交互的接口函数是: mWebView.addJavascriptInterface(getHtmlObject(),”jsObj”); // jsObj 为桥连对象
Android容许执行js脚本需要设置: webSettings.setJavaScriptEnabled(true);
2) js(HTML)访问Android(Java)代码
js(HTML)访问Android(Java)端代码是通过jsObj对象实现的,调用jsObj对象中的函数,如: window.jsObj.HtmlcallJava()
3) Android(Java)访问js(HTML)代码
Android(Java)访问js(HTML)端代码是通过loadUrl函数实现的,访问格式如:mWebView.loadUrl(“javascript:showFromHtml()”);
说明:
1) Android访问url网址,需在AndroidManifest.xml文件,配置容许访问网络的权限:
public void JavacallHtml() { runOnUiThread(new Runnable() { @Override public void run() { mWebView.loadUrl("javascript: showFromHtml()"); Toast.makeText(JSAndroidActivity.this, "clickBtn", Toast.LENGTH_SHORT).show(); } }); }
- Android开发实践 带你理解使用WebView
- Android开发实践(三)WebView(网络视图)使用实例
- Android hybrid 开发实践(android webview)
- Android 开发之webview使用
- Android开发 WebView使用注意事项
- android开发之WebView使用
- Android WebView 开发使用笔记
- 带你深入理解Android Handler机制
- 带你深入理解Android Handler机制
- 带你一步步理解使用 ConstraintLayout
- 带你一步步理解使用 ConstraintLayout
- Android开发——带你彻底理解 Window 和 WindowManager
- Android webview控件(一) 使用webview开发浏览器实例
- 【Android】webView 使用 系统自带搜索对话框问题
- [Android开发常见问题-23] Android Handler、Message完全解析,带你从源码的角度彻底理解
- Svn使用实践-android开发
- Android开发如何正确使用WebView
- Android开发---WebView控件的使用
- 电商之梳理JQuery相关知识---前端技术
- Zephyr 教程:内核基础(★★★★★)
- 电商之梳理angular Js相关知识---前端技术
- RPi-002 从GPIO控制到替Pi加上0.96" OLED
- Linux中awk命令正确的求最大值、最小值、平均值、总和
- Android开发实践 带你理解使用WebView
- ubuntu 12.04安装GTK
- 电商之梳理freekmarker相关知识---前端技术
- org.apache.ibatis.type.TypeException: Could not resolve type alias 'VARCHAR'.
- 电商之梳理note js相关知识---前端技术
- Didcuz memcache+ssrf GETSHELL漏洞解决方法
- hdoj1009 贪心
- 我要写代码——跨过程序员的门槛(6)_意外实习
- Hadoop基本操作命令