WebView在开发中的6大坑_Android学习_天涯博客
Android学习交流
今日访问：[$DayVisitCount$]
总访问量：704
开博时间：
博客排名：681210
今天逛知乎的时候，看到一个有关中，WebView 的问题，算是开发中比较常见的问题了吧，而且赞同数比较多的答案，确实回答得还不错，这里小编就整理了一下，分享出来大家借鉴借鉴，避免开发中，遇到类似问题凌乱吧。
& &&&&WebView 的坑很多，主要的比较让人疑惑的坑有如下几个：
1、WebViewClient.onPageFinished()。你永远无法确定当WebView调用这个方法的时候，网页内容是否真的加载完毕了。当前正在加载的网页产生跳转的时候这个方法可能会被多次调用。所以当你的WebView需要加载各种各样的网页并且需要在页面加载完成时采取一些操作的话，可能WebChromeClient.onProgressChanged()比WebViewClient.onPageFinished()都要靠谱一些。
2、WebView后台耗电问题。当你的程序调用了WebView加载网页，WebView会自己开启一些线程，如果你没有正确地将WebView销毁的话，这些残余的线程会一直在后台运行，由此导致你的应用程序耗电量居高不下。对此比较简单粗暴的方式是，在Activity.onDestroy()中直接调用System.exit(0)，使得应用程序完全被移出虚拟机，这样就不会有任何问题了。
3、切换WebView闪屏问题。如果你需要在同一个ViewGroup中来回切换不同的WebView（包含了不同的网页内容）的话，你就会发现闪屏是不可避免的。这应该是Android硬件加速的Bug，如果关闭硬件加速这种情况会好很多，但无法获得很好的浏览体验，你会感觉网页滑动的时候一卡一卡的，不跟手。
4、数据积累问题。开启缓存什么的有利于网页的浏览体验，但你会发现即使是清除了必要的内容，比如Cache、Cookie、Form Data、History、Password等等东西，你的应用程序所占用的存储空间还是会越来越大，到最后只好手动到系统设置的应用信息界面里清除数据了 。
5、滚动条问题。Android System WebView的横向滚动条真是好粗的有木有...
6、webview原生支持js与native代码交互，可惜在4.2以下版本上有安全漏洞，当时被乌云报出来，事情还挺大，各大浏览器厂商都紧急应对，我们也还是想了其他办法，解决了这个问题。
&&&&&& 上面的这些Android WebView中的坑，大家在安卓开发中，肯定都真真切切的遇到过。其实WebView的坑，究其根本大部分都是Webkit等内核的坑，是它发展过程中遇到的一些遗留问题。有些问题可能我们除了正确面对外，别无他法，但是有的问题，我们还是可以进行优化、改进的。如果对于上述的一些坑，大家有很好的解决办法，欢迎分享。
相关文章：《》在Android开发中往往需要实现网页的浏览，webview就是android开发控件中功能极其强大的一员，它完全可以充当一个简易的浏览器，能够自己设置主页。试想，用自己开发的app把主页设成自己技术博客地址，一打开便进入了自己的空间，何其的方便。
在webview使用中有以下几点需要注意：
1、关于访问网络的问题
由于webview需要通过数据通信来访问网络，所以在manifest.xml配置文件中需要进行权限的设置（声明）
&uses-permission android:name=&android.permission.INTERNET&/&
2、如何实现不调用第三方浏览器即可进行页面反应
/*在webview加载网页时，不调用第三方浏览器打开的办法：
* 设置WebViewClient，并重写WebViewClient的shouldOverrideUrlLoading方法
* 返回true为不调用，反之 false为调用第三方浏览器
webView.setWebViewClient(new WebViewClient(){
public boolean shouldOverrideUrlLoading(WebView view, String url) {
// TODO Auto-generated method stub
view.loadUrl(url);
3、网页中包含JavaScript内容时如何设置
android webview之所以功能强大就是能够和js进行交互 把js写成的网页嵌套到app中。
//网页中包含JavaScript内容需调用以下方法，参数为true
webView.getSettings().setJavaScriptEnabled(true);
4、如何使得物理返回键实现页面上翻而不是退出程序
用过浏览器的同学应该都知道，浏览网页时点按手机上的返回键并不会导致程序的退出，而是回到之前打开的网页，这时候就需要重写onKeyDown(keyCode, event)方法 改写物理按键返回的逻辑。以下是设置方法：
//重写onKeyDown(keyCode, event)方法 改写物理按键 返回的逻辑
public boolean onKeyDown(int keyCode, KeyEvent event) {
// TODO Auto-generated method stub
if(keyCode==KeyEvent.KEYCODE_BACK)
if(webView.canGoBack())
webView.goBack();//返回上一页面
System.exit(0);//退出程序
return super.onKeyDown(keyCode, event);
5 、出现net::ERR_CACHE_MISS错误提示
使用缓存的方式是基于导航类型。正常页面加载的情况下将缓存内容。当导航返回,内容不会恢复（重新加载生成）,而只是从缓存中取回内容。可以进行一下代码设置：
//出现net::ERR_CACHE_MISS错误提示
//使用缓存的方式是基于导航类型。正常页面加载的情况下将缓存内容。当导航返回,
//内容不会恢复（重新加载生成）,而只是从缓存中取回内容
if (Build.VERSION.SDK_INT &= 19) {
Toast.makeText(this, &hhahhhhaha&, Toast.LENGTH_LONG).show();
webView.getSettings().setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);
6 、出现net::ERR_NAME_NOT_RESOLVED错误
导致这个错误的因素有很多，我遇到的就比较特殊和纠结。因为用手机调试时需要用流量，鄙人比较穷，就用来电脑开的WiFi，可是出现了这个net::ERR_NAME_NOT_RESOLVED错误，只有用手机数据流量才得以解决。这是我找到的一些解决方法：
DNS 是将网站名称解析为互联网地址的网络服务。
a、把能上网的电脑连上，看一网络连接中的IP、DNS是自动还是指定，如果是指定记下来。
b、再把自己的电脑连上，检查一下自己的电脑的网络连接中的IP、DNS，与能上网的电脑设置成一样再试一下。
c.浏览器设置代理，请检测自己的浏览器是否设置代理或者正在开启代理软件，导致出现打不开网页情况。
d.电脑病毒破坏浏览器组件和系统文件，部分杀毒软件对被木马病毒感染程序进行查杀，但并未进行修复。
e.DNS设置问题，DNS服务器解释出错，需要手动在本地连接进行设置。
7 、若要显示本地文件和本地html文件应该放在哪
android工程目录下单assets文件
webView.loadUrl(&file:///android_asset/icon.jpg&);
基本上的要点就是和这些了，接下来是具体实现：
这是布局文件
其实就是一个大大的webview组件：
&RelativeLayout xmlns:android=&/apk/res/android&
xmlns:tools=&/tools&
android:layout_width=&wrap_content&
android:layout_height=&wrap_content&
tools:context=&.MainActivity& &
android:id=&@+id/webView&
android:layout_width=&fill_parent&
android:layout_height=&fill_parent&
android:layout_alignParentRight=&true&
android:layout_alignParentTop=&true& /&
&/RelativeLayout&
这是主文件：
package com.example.
import java.net.URLE
import android.app.A
import android.os.B
import android.os.B
import android.view.KeyE
import android.webkit.WebS
import android.webkit.WebV
import android.webkit.WebViewC
import android.widget.T
public class MainActivity extends Activity {
WebView webV
final String mimeType = &text/html&;
final String encoding = &utf-8&;
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
webView = (WebView) findViewById(R.id.webView);
/*在webview加载网页时，不调用第三方浏览器打开的办法：
* 设置WebViewClient，并重写WebViewClient的shouldOverrideUrlLoading方法
* 返回true为不调用，反之 false为调用第三方浏览器
webView.setWebViewClient(new WebViewClient(){
public boolean shouldOverrideUrlLoading(WebView view, String url) {
// TODO Auto-generated method stub
view.loadUrl(url);
//网页中包含JavaScript内容需调用以下方法，参数为true
webView.getSettings().setJavaScriptEnabled(true);
//出现net::ERR_CACHE_MISS错误提示
//使用缓存的方式是基于导航类型。正常页面加载的情况下将缓存内容。当导航返回,
//内容不会恢复（重新加载生成）,而只是从缓存中取回内容
if (Build.VERSION.SDK_INT &= 19) {
webView.getSettings().setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);
webHtml();
webImage();
localHtml();
localImage ();
localHtmlImage();
//重写onKeyDown(keyCode, event)方法 改写物理按键 返回的逻辑
public boolean onKeyDown(int keyCode, KeyEvent event) {
// TODO Auto-generated method stub
if(keyCode==KeyEvent.KEYCODE_BACK)
if(webView.canGoBack())
webView.goBack();//返回上一页面
System.exit(0);//退出程序
return super.onKeyDown(keyCode, event);
* 显示网页
private void webHtml() {
webView.loadUrl(&&);
} catch (Exception ex) {
ex.printStackTrace();
显示网络图片
private void webImage() {
webView.loadUrl(&/images/haha.jpg&);
} catch (Exception ex) {
ex.printStackTrace();
* 显示本地图片文件
private void localImage() {
// 本地文件处理(文件名中有空格时用+来替代)
webView.loadUrl(&file:///android_asset/icon.jpg&);
} catch (Exception ex) {
ex.printStackTrace();
* 显示本地网页文件
private void localHtml() {
// 本地文件处理( 文件名中有空格用+来替代)
webView.loadUrl(&file:///android_asset/find.html&);
} catch (Exception ex) {
ex.printStackTrace();
* 显示本地图片和文字混合的Html内容
private void localHtmlImage() {
String data = &测试本地图片和文字混合显示,这是APK里的图片&;
// SDK1.5本地文件处理(不能显示图片)
// SDK1.6及以后版本
// webView.loadData(data, mimeType, encoding);
// 本地文件处理(能显示图片)
webView.loadDataWithBaseURL(&about:blank&, data, mimeType,
encoding, &&);
} catch (Exception ex) {
ex.printStackTrace();
这样，一个简易的个人主页浏览器就完成了。
相关 [android 开发 webview] 推荐：
- 移动开发 - ITeye博客
Android和iOS系统都提供了标准的浏览器控件，在Android中是WebView，iOS中为UIWebView. 在iOS中你实例化一 个UIWebView即可调用loadRequest来加载一个网页，但是在Android中你不仅需要创建一个WebView，还需要做一些其他的事 情，建议初次使用WebView的读者按照以下步骤使用：.
- CSDN博客推荐文章
最近把做好的iPad HybridApp向Android迁移，碰到的坑太多了，让我这个折腾过Android接近4年的老鸟都头疼. 现在把前人遇到的都列出来，再慢慢解决自己的，目前已经解决了android键盘覆盖问题，下面最棘手的问题就是屏幕高度的适配问题了. 1、 Andrid4.1事件穿透BUG 原因不明.
- SegmentFault 最新的文章
在android内打开一个网页的时候，有时我们会要求与网页有一些交互. 而这些交互是在基于javaScript的基础上. 那么我们来学习一下android如何与网页进行JS交互. protected V// 刷新按钮. protected String url = &&;// 网址url.
- 浏览器 - 互联网 - ITeye博客
在Android开发中往往需要实现网页的浏览，webview就是android开发控件中功能极其强大的一员，它完全可以充当一个简易的浏览器，能够自己设置主页. 试想，用自己开发的app把主页设成自己技术博客地址，一打开便进入了自己的空间，何其的方便.
在webview使用中有以下几点需要注意：.
- ITeye博客
使能javascript：. 编写自己的WebViewClient，并在onPageFinished中提取网页源码. 运行，可以看到在showSource(String html)中打印了网页源码. 已有
0 人发表留言，猛击-&&
这里&&-参与讨论. —软件人才免语言低担保 赴美带薪读研.
- 博客园_首页
　　上一篇博文：
Android WebView使用基础已经说了一些Android中WebView的基本使用. 　　本篇文章主要介绍WebView中的JavaScript代码的执行相关，已经JS代码与Android代码的互相调用. 　　（因为本人对Web开发并不是很熟悉，所以如果有哪些地方说得不对，还请指正.
- 移动开发 - ITeye博客
关注微信号：javalearns
随时随地学Java. 目前Android WebView问题越来越多，接下来由爱内测（）的技术工程师为我们介绍几种常见的Android WebView问题：. 1.为WebView自定义错误显示界面: /** * 显示自定义错误提示页面，用一个View覆盖在WebView */ protected void showErrorPage() { LinearLayout webParentView = (LinearLayout)mWebView.getParent();.
在WebView里加载SSL网页很正常，也没什么难度. 但如果要加载的SSL页面的证书有问题，比如过期、信息不正确、发行机关不被信任等，WebView就会拒绝加载该网页. PC上的浏览器会弹出证书错误的对话框，提示你是否要无视错误继续浏览. 实际上在WebView里也可以这样做，以实现加载证书有问题的页面.
- CSDN博客推荐文章
WebView, WebChromeClient和WebViewClient加载网页基本用法.
webview是android中的浏览器控件，在一些手机应用中常会用到b/s模式去开发应用，这时webview的强大功能就会显示出来.
1、webview的几点设置.
权限设置：.AndroidManifest.xml中必须使用许可&android.permission.INTERNET&,否则会出Web page not available错误.
- CSDN博客推荐文章
如有转载，请声明出处: 时之沙:
http://blog.csdn.net/t12x3456. 继上一篇
Android WebView常见问题及解决方案汇总
中归纳了一些处理webview的常见问题，这次要说的是webview中的touch事件:. 有时候在开发中，我们需要对webview加入触摸事件的处理，比如加入滑动效果或者类似于阅读中的翻页效果，这时候我们就需要重写webview中的onTouch方法:.
坚持分享优质有趣的原创文章，并保留作者信息和版权声明，任何问题请联系：@。Android开发中WebView与原生JS的数据交互详解-安卓教程-手机开发-壹聚教程网Android开发中WebView与原生JS的数据交互详解分本文来分享详细的在Android开发中，如何利用WebView与原生JS的数据交互，本教程附有代码和效果图，是一个不可多得的好教程。
关于WebView我们知道目前android市场上的一些应用采用的开发方式大致分为三种：Native App、Web App、Hybrid App。本文主要是Hybrid App中实现的主要技术native组件与js的数据交互的理解以及实现。Android API中提供了WebView组件来实现对html的渲染。所谓的HybridApp开发方式即是汇集了HTML5、CSS3、jS的相关开发技术，以及数据交换格式json/XML。这显然是Web开发工程师的技能。正是因为如此，众多中小企业选择了这种开发方式来减少对android开发工程师的过度依赖，至于这三种开发方式的比较与优劣不在本文考虑之列。有了WebView这个组件，Android应用开发技术也就转嫁到html与java数据交互上来。说白了就是js与WebView的数据交互，这就是本文所要讨论的。WebView与js的数据交互1.&&&&&&& WebView中载入静态页面&将WebView添加到应用中。和原生控件一样，在layout引入WebView控件。代码片段如下：&?xml version=&1.0& encoding=&utf-8&?&&LinearLayout xmlns:android=&/apk/res/android&&&& android:id=&@+id/linearLayout&&&& android:layout_width=&match_parent&&&& android:layout_height=&match_parent&&&& android:background=&#000&&&& android:orientation=&horizontal& &&WebView&&& android:id=&@+id/webview&&&& android:layout_width=&match_parent&&&& android:layout_height=&match_parent& &&& /&&/LinearLayout&载入页面：&webView = (WebView) findViewById(R.id.webview);webView.loadUrl(&file:///file:///android_asset/page.html&);page.html存储在工程文件的assets根目录下。2.&&&&&&& 引入jquery mobile引入js框架让我们编写的html页面更接近于原生控件的显示效果。目前主流的移动应用js框架有：jquery mobile和sencha touch（jquery mobile与sencha touch的选型不在本文讨论范围）。本文选择使用jquery mobile。&首先，在webview添加对js的支持：WebSettings setting = webView.getSettings();setting.setJavaScriptEnabled(true);//支持js增加对中文的支持:WebSettings setting = webView.getSettings();setting.setDefaultTextEncodingName(&GBK&);//设置字符编码设置页面滚动条风格：webView.setScrollBarStyle(0);//滚动条风格，为0指滚动条不占用空间，直接覆盖在网页上jquery mobile提供的标准页面模板TemplateForJQuery.html：&!DOCTYPE html& &html& && &&head& && &&title&Page Title&/title& && &&& &&meta name=&viewport& content=&width=device-width, initial-scale=1&& && &&link rel=&stylesheet& href=&css/jquery.mobile-1.1.1.min.css& /&&& &&script src=&js/jquery.js&&&/script&&& &&script src=&js/jquery.mobile-1.1.1.min.js&&&/script&&/head& &body& &div data-role=&page&&&& &&div data-role=&header&&&& &&& &&h1&Page Title&/h1&&& &&/div&&!-- /header --&&& &&div data-role=&content&&&& &&& &&& &&p&Page content goes here.&/p&&& &&& &&& &&/div&&!-- /content --&&& &&div data-role=&footer&&&& &&& &&h4&Page Footer&/h4&&& &&/div&&!-- /footer --&&/div&&!-- /page --&&/body&&/html&页面依赖的js库、css等均放在assets目录下,目录组织结构如下：运行应用后的截图：下面是button 的截图，与原生控件没什么明显区别，有种以假乱真的感觉：3.&&&&&&& 良好的用户体验运行我们的应用发现，在拥有大量js的页面被载入时，一直处于等待中，这是很糟糕的用户体验。可以加入进度条解决。注意到webview提供的两个方法：setWebViewClient和setWebChromeClient。其中setWebChromeClient方法正是可以处理progress的加载，此外，还可以处理js对话框，在webview中显示icon图标等。对于处理progress的代码片段如下：webView.setWebChromeClient(new WebChromeClient() {&& &public void onProgressChanged(WebView view, int progress) {// 载入进度改变而触发&& &&& &&& &if (progress == 100) {&& &&& &&& &&& &&& &handler.sendEmptyMessage(1);// 如果全部载入,隐藏进度对话框&& &&& &&& &}&& &&& &&& &&& &super.onProgressChanged(view, progress);&& &&& &}});其中通过handler 消息机制来处理UI线程的更新：&&& &&& &handler = new Handler() {&& &&& &&& &public void handleMessage(Message msg) {// 定义一个Handler，用于处理下载线程与UI间通讯&& &&& &&& &&& &if (!Thread.currentThread().isInterrupted()){&& &&& &&& &&& &&& &switch (msg.what) {&& &&& &&& &&& &&& &case 0:&& &&& &&& &&& &&& &&& &pd.show();// 显示进度对话框&& &&& &&& &&& &&& &&& &&& &&& &&& &&& &&& &case 1:&& &&& &&& &&& &&& &&& &pd.hide();// 隐藏进度对话框，不可使用dismiss()、cancel(),否则再次调用show()时，显示的对话框小圆圈不会动。&& &&& &&& &&& &&& &&& &&& &&& &&& &&& &&& &}&& &&& &&& &&& &}&& &&& &&& &&& &super.handleMessage(msg);&& &&& &&& &}&& &&& &};对于setWebViewClient方法，一般用来处理html的加载（需要重载onPageStarted(WebView view, String url, Bitmap favicon)）、关闭（需要重载onPageFinished（WebViewview, String url）方法）。&setWebViewClient和setWebChromeClient的作用：前者主要用于处理webView的控制问题，如加载、关闭、错误处理等；后者主要处理js对话框、图标、页面标题等。4.&&&&&&& 获取java中的数据单独构建一个接口，作为处理js与java的数据交互的桥梁，本文封装的代码AndroidToastForJs.java如下:public class AndroidToastForJs {&& &&& &private Context mCpublic AndroidToastForJs(Context context){&& &&& &this.mContext =&& &}&& &//webview中调用toast原生组件public void showToast(String toast) {&& &&& &Toast.makeText(mContext, toast, Toast.LENGTH_SHORT).show();&& &}&& &//webview中求和public int sum(int a,int b){&& &&& &return a+b;&& &}&& &&//以json实现webview与js之间的数据交互public String jsontohtml(){&& &&& &JSONO&& &&& &JSONArray array = new JSONArray();&& &&& &try {&& &&& &&& &map = new JSONObject();&& &&& &&& &map.put(&name&,&aaron&);&& &&& &&& &map.put(&age&, 25);&& &&& &&& &map.put(&address&, &中国上海&);&& &&& &&& &array.put(map);&& &&& &&& &&& &&& &&& &map = new JSONObject();&& &&& &&& &map.put(&name&,&jacky&);&& &&& &&& &map.put(&age&, 22);&& &&& &&& &map.put(&address&, &中国北京&);&& &&& &&& &array.put(map);&& &&& &&& &&& &&& &&& &map = new JSONObject();&& &&& &&& &map.put(&name&,&vans&);&& &&& &&& &map.put(&age&, 26);&& &&& &&& &map.put(&address&, &中国深圳&);&& &&& &&& &map.put(&phone&,&&);&& &&& &&& &array.put(map);&& &&& &}
(JSONException e) {&& &&& &&& &e.printStackTrace();&& &&& &}&& &&& &return array.toString();&& &}}&Webview提供的传入js的方法：webView.addJavascriptInterface(new AndroidToastForJs(mContext), &JavaScriptInterface&);Html页面jsonData.html设计的部分代码如下：&& &&script type=&text/&&&& &var result = JavaScriptInterface.jsontohtml();&& &var obj = eval(&(&+result+&)&);//解析json字符串&& &function showAndroidToast(toast) && &{&&&&&& &&& &&& &JavaScriptInterface.showToast(toast); &&& }&& &function getjsonData(){&& &&& &var result = JavaScriptInterface.jsontohtml();&& &&& &var obj = eval(&(&+result+&)&);//解析json字符串&& &&& &for(i=0;i&obj.i++){&& &&& &&& &var user=obj[i];&& &&& &&& &document.write(&&p&姓名:&+user.name+&&/p&&);&& &&& &&& &document.write(&&p&年龄:&+user.age+&&/p&&);&& &&& &&& &document.write(&&p&地址:&+user.address+&&/p&&);&& &&& &&& &if(user.phone!=null){&& &&& &&& &&& &document.write(&&p&手机号码:&+user.address+&&/p&&);&& &&& &&& &}&& &&& &}&& &}&& &&& &function list(){&& &&& &document.write(&&div data-role='header'&&p&another&/p&&/div&&);&& &}&& &&/script&&/head& &body& &div data-role=&page& &&& &&div data-role=&header& data-theme=&c&&&& &&& &&h1&Android via Interface&/h1&&& &&/div&&!-- /header --&&& &&div data-role=&content&&&& &&& &&& &&button value=&say hello& onclick=&showAndroidToast('Hello,Android!')& data-theme=&e&&&/button&&& &&& &&button value=&get json data& onclick=&getjsonData()& data-theme=&e&&&/button&&& &&& &&/div&&!-- /content --&&div data-role=&collaible& data-theme=&c& data-content-theme=&f&&&& &h3&I'm &script&document.write(obj[0].name);&/script&,click to see my info&/h3&&& &p&&script&document.write(&&p&姓名：&+obj[0].name+&&/p&&);&/script&&/p&&& &p&&script&document.write(&&p&年龄：&+obj[0].age+&&/p&&);&/script&&/p&&& &p&&script&document.write(&&p&地址：&+obj[0].address+&&/p&&);&/script&&/p&&/div&&& &&div data-role=&footer& data-theme=&c&&&& &&& &&h4&Page Footer&/h4&&& &&/div&&!-- /footer --&&/div&&!-- /page --&&/body&点击say hello按钮运行的截图如下：另外一篇关于webview与js交互对于android初学者应该都了解webView这个组件。之前我也是对其进行了一些简单的了解，但是在一个项目中不得不用webview的时候，发现了webview的强大之处，今天就分享一下使用webview的一些经验。&1、首先了解一下webview。webview介绍的原文如下：A View that displays web pages. This class is the basis upon which you can roll your own web browser or simply display some online content within your Activity. It uses the WebKit rendering engine to display web pages and s methods to navigate forward and backward through a history, zoom in and out, perform text searches and more.从上面你应该了解到了基本功能，也就是显示网页。之所以我说webview功能强大是因为它和js的交互非常方便，很简单就可以实现。&2、webview能做什么？①webView可以利用html做界面布局，虽然目前还比较少人这么使用，不过我相信当一些客户端需要复杂的图文（图文都是动态生成）混排的时候它肯定是个不错的选择。②直接显示网页，这功能当然也是它最基本的功能。③和js交互。（如果你的js基础比java基础好的话那么采用这种方式做一些复杂的处理是个不错的选择）。&3、如何使用webview？这里直接用一个svn上取下的demo，先上demo后讲解。demo的结构图如下：&WebViewDemo.javapackage com.google.android.import android.app.Aimport android.os.Bimport android.os.Himport android.util.Limport android.webkit.JsRimport android.webkit.WebChromeCimport android.webkit.WebSimport android.webkit.WebV/**&* Demonstrates how to embed a WebView in your activity. Also demonstrates how&* to have javascript in the WebView call into the activity, and how the activity &* can invoke javascript.&* &p&&* In this example, clicking on the android in the WebView will result in a call into&* the activities code in {@link DemoJavaScriptInterface#clickOnAndroid()}. This code&* will turn around and invoke javascript using the {@link WebView#loadUrl(String)}&* method.&* &p&&* Obviously all of this could have been accomplished without calling into the activity&* and then back into javascript, but this code is intended to show how to set up the &* code paths for this sort of communication.&*&*/public class WebViewDemo extends Activity {&&& private static final String LOG_TAG = &WebViewDemo&;&&& private WebView mWebV&&& private Handler mHandler = new Handler();&&& @Override&&& public void onCreate(Bundle icicle) {&&&&&&& super.onCreate(icicle);&&&&&&& setContentView(R.layout.main);&&&&&&& mWebView = (WebView) findViewById(R.id.webview);&&&&&&& WebSettings webSettings = mWebView.getSettings();&&&&&&& webSettings.setSavePassword(false);&&&&&&& webSettings.setSaveFormData(false);&&&&&&& webSettings.setJavaScriptEnabled(true);&&&&&&& webSettings.setSupportZoom(false);&&&&&&& mWebView.setWebChromeClient(new MyWebChromeClient());&&&&&&& mWebView.addJavascriptInterface(new DemoJavaScriptInterface(), &demo&);&&&&&&& mWebView.loadUrl(&file:///android_asset/demo.html&);&&& }&&& 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()&);&&&&&&&&&&&&&&& }&&&&&&&&&&& });&&&&&&& }&&& }&&& /**&&&& * Provides a hook for calling &alert& from javascript. Useful for&&&& * debugging your javascript.&&&& */&&& final class MyWebChromeClient extends WebChromeClient {&&&&&&& @Override&&&&&&& public boolean onJsAlert(WebView view, String url, String message, JsResult result) {&&&&&&&&&&& Log.d(LOG_TAG, message);&&&&&&&&&&& result.confirm();&&&&&&&&&&&&&&&&&& }&&& }}&demo.html&html&&&& &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=&width:80&&&&&&&&&&& margin:0&&&&&&&&&&& padding:10&&&&&&&&&&& text-align:&&&&&&&&&&& border:2px solid #202020;& &&&&&&&&&&&&&&&& &img id=&droid& src=&android_normal.png&/&&br&&&&&&&&&&&&&&&& Click me!&&&&&&& &/div&&/a&&&& &/body&&/html&&main.xml&LinearLayout xmlns:android=&/apk/res/android&&&& android:orientation=&vertical&&&& android:layout_width=&fill_parent&&&& android:layout_height=&fill_parent&&&& &&& &&&& &TextView &&&&&&&& android:layout_width=&fill_parent& &&&&&&& android:layout_height=&wrap_content& &&&&&&& android:text=&@string/intro&&&&&&&& android:padding=&4dip&&&&&&&& android:textSize=&16sp&&&&&&&& /&&& &&&& &WebView&&&&&&& android:id=&@+id/webview&&&&&&&& android:layout_width=&fill_parent& &&&&&&& android:layout_height=&0dip&&&&&&&& android:layout_weight=&1&&&&&&&& /&&&&&&& &&/LinearLayout&&4、如何交互？①android如何调用js。调用 形式：mWebView.loadUrl(&javascript:wave()&);其中wave（）是js中的一个方法，当然你可以把这个方法改成其他的方法，也就是android调用其他的方法。②js如何调用android。调用形式：&a onClick=&window.demo.clickOnAndroid()&&代码中的“demo”是在android中指定的调用名称，即&mWebView.addJavascriptInterface(new DemoJavaScriptInterface(), &demo&);代码中的clickOnAndroid()是“demo”对应的对象：new DemoJavaScriptInterface() 中的一个方法。③双向交互。当然是把前面的两种方式组合一下就可以了。&5、讲解demo。现在你一定了解了android和js的交互了。是时候分析一些demo了，根据上面讲的你也应该比较清楚了。具体交互流程如下：①点击图片，则在js端直接调用android上的方法clickOnAndroid()；②clickOnAndroid()方法（利用线程）调用js的方法。③被②调用的js直接控制html。&个人总结：利用webView的这种方式在有些时候UI布局就可以转成相应的html代码编写了，而html布局样式之类有DW这样强大的工具，而且网上很多源码，很多代码片。在UI和视觉效果上就会节省很多时间，重复发明轮子没有任何意义。 上一页： &&&&&下一页：相关内容
斗破战神魔兽宝贝编辑推荐
电脑壁纸相关专题