webView介绍

转载 2015年07月10日 17:29:18


WebView是Android提供给我们用来加载网页的控件,功能很强大。我们常用的手机淘宝,手机京东的Android客户端里面大量使用到了WebView,但是使用WebView比使用其他是更加耗电的,那为什么淘宝和京东还是要使用WebView作为APP里的部分,首先大家知道,淘宝,京东等在移动技术还不热的时候就有了一套完善的网页系统,所以使用WebView可以直接使用之前的逻辑,省时省力省钱,而且作为电商,每天的内容都是不同的,所以大家要及时更新,放在我们客户端来做肯定是不行的,你不能让用户一天下一个版本吧?而且也不能拿我们程序当狗使啊,一天一个版本,谁受得了?



PART_1    WebView基本使用

使用WebView很简单,接下来我们就细细道来。

1. 得到WebView可以通过findViewById()的方法得到,也可以使用new WebView()的方式得到,所以得到WebView是第一步(废话,不得到WebView,你上哪去显示?)


2. 得到了WebView后,那就简单了,随便找个可以加载的链比如“http://www.baidu.com”,使用webView.loadUrl("http://www.baidu.com");就得到我们想要加载的界面。如果想加载我们存放在本地的html文件,比如assets里面,可以使用这个路径:file:///android_asset/xxx.html。


3. 得到了我们想要的界面后,发现如果我们点击其中的按钮并没任何效果,因为默认情况下WebView是不支持javascript的,所以我们要在代码里设置:getSettings().setJavaScriptEnabled(true);

设置了这个以后,页面是不能缩放的,添加这个可以是页面缩放:getSettings().setBuiltInZoomControls(true);


4. 上面点击有效果了,但是发现点击之后,并不是在我们当前的WebView视图中进行转跳,其实这个也好理解,你让人家转跳,但是你又拿着当前的WebView,那它能怎么转跳?所以人家就跟系统请求浏览器去跳转了,如果你的功能刚好是这个,那一切OK,功能实现了,但是如果你的功能不是这,所以得想办法解决啊,怎么解决?看下面:

  1. wv.setWebViewClient(new WebViewClient() {  
  2.     @Override  
  3.     public boolean shouldOverrideUrlLoading(WebView view, String url) {  
  4.         // TODO Auto-generated method stub  
  5.         view.loadUrl(url);  
  6.         return true;  
  7.     }  
  8. });  
代码很容易懂,view.loadUrl(url)就是让WebView加载新的url,下面呢?下面返回true的意思是我就在当前的webView中转跳。


PART_2    WebView返回和获取网页标题

经过上面的那些,其实我们发现了一个问题,怎样回退到我们上个页面?因为我们发现,只要转跳后,按返回键是回不到我们上个url的,只会结束掉当前的Activity,所以这里我们就要复写按键事件了,如下:

  1. @Override  
  2. public boolean onKeyDown(int keyCode, KeyEvent event) {  
  3.     if (keyCode == KeyEvent.KEYCODE_BACK) {  
  4.         if (wv.canGoBack()) {  
  5.             wv.goBack();  
  6.             return true;  
  7.         }  
  8.     }  
  9.     return super.onKeyDown(keyCode, event);  
  10. }  
(注解:wv就是WebView的实例)

好,上面的返回也写好了,但是有个问题,怎么样获取到当前页面的标题?这里其实谷歌早就提供了方法,如下:

  1. wv.setWebChromeClient(new WebChromeClient() {  
  2.     @Override  
  3.     public void onReceivedTitle(WebView view, String title) {  
  4.         MainActivity.this.setTitle(title);  
  5.         super.onReceivedTitle(view, title);  
  6.     }  
  7. });  
获取到标题以后,我这里是将标题设置到ActionBar上面去了,很简单,但是很实用


次奥,看完你一定会说,MD,回退的时候标题根本没有换回来啊?是的,如何解决呢?看下面:

  1. wv.setWebViewClient(new WebViewClient() {  
  2.     @Override  
  3.     public boolean shouldOverrideUrlLoading(WebView view, String url) {  
  4.         // TODO Auto-generated method stub  
  5.         view.loadUrl(url);  
  6.         return false;  
  7.     }  
  8.       
  9.     @Override  
  10.     public void onPageFinished(WebView view, String url) {  
  11.         setTitle(view.getTitle());  
  12.         super.onPageFinished(view, url);  
  13.     }  
  14. });  
看到onPageFinished这个方法了么,看完以后,你一定会跳起来说一句,原来获取title,可以这样,那我其实完全可以不用上面的方法setWebChromeClient()的方法。

推荐篇文章看了你就大致知道为什么了:http://www.eoeandroid.com/forum.php?mod=viewthread&tid=542884


PART 3     js与android交互

首先写一个简单的html页面:

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
  2. <html>  
  3.  <head>   
  4.   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />   
  5.   <title>互调JS</title>   
  6.   <script type="text/javascript">  
  7.     function test() {  
  8.         try {  
  9.             window.external.callApp("afterChosen", 1059);  
  10.         } catch(e) {  
  11.             document.getElementById("content").innerHTML = "call fail!"  
  12.         }  
  13.     }  
  14.   
  15.     function afterChosen(){  
  16.         document.getElementById("content").innerHTML = "callback success!";  
  17.     }  
  18.     </script>   
  19.  </head>   
  20.  <body>   
  21.   <p id="content">最开始的数据</p>   
  22.   <input type="button" value="点击调用app" onclick="test()" />    
  23.  </body>  
  24. </html>  

很简单,就是点击了按钮以后调用test()方法,然后在test()方法中在调用android中的callApp函数。但是为了使得js里面的代码能够正确调用到我们的方法,我们需要加一段这样的代码:

  1. wv.addJavascriptInterface(this"external");  

这里的this代表的是MainActivity.this,然后后面的参数跟我们js代码里写的window.external.callApp()要一致。然后我们在实现callApp方法:

  1. @JavascriptInterface  
  2. public void callApp(final String funcName, final int n) {  
  3.     wv.post(new Runnable() {  
  4.         public void run() {  
  5.             wv.loadUrl("javascript:" + funcName + "()");  
  6.         }  
  7.     });  
  8. }  


这块要注意,我们的webview是一个单独的线程中运行的,如果你直接在UI线程中调用wv.loadUrl("javascript:" + funcName + "()")是会抛异常的,不信你可以试试。。。,wv.post就是将下面执行的代码post到webview所在的线程中,这样就可以顺利的执行了。

回调js函数是要遵循一定的格式的,否则是调不动的,格式很简单就是在我们要调用的函数前面加上: javascript:

看看最后的效果:



OK, 这篇文章就介绍到这里!

相关文章推荐

Android WebView 介绍

在android应用中,使用WebView显示网页内容。如下 1、activity_main.xml布局文件

安卓 webView使用介绍:补充篇

之前写过一篇关于webview的文档,不怎么全面所以补充了一下。对于不足之处希望大家给点意见,共同讨论,如果那里写的不明白可以提出,我会在查询之后为大家更新心得文档,多谢。 下面是我在API文档中翻...
  • YZF11
  • YZF11
  • 2016-05-14 19:21
  • 349

android WebView介绍(一)

原文 http://www.cnblogs.com/lyricgan88/p/3361383.html 在Android手机中内置了一款高性能webkit内核浏览器,在SDK中封装成名为WebV...

WebView详细介绍

常用设置WebSettings mWebSet = mWebView.getSettings(); mWebSet.setJavaScriptEnabled(true); // 支持js mWebSe...

Android WebView简要介绍和学习计划

我们通常会在App的UI中嵌入WebView,用来实现某些功能的动态更新。在4.4版本之前,Android WebView基于WebKit实现。不过,在4.4版本之后,Android WebView就...

WebView 类介绍

WebView java.lang.Object -android.view.View --andorid.view.ViewGroup ---android.widget.Absol...

android WebView加载html5介绍

Android设备多分辨率的问题 Android浏览器默认预览模式浏览 会缩小页面 WebView中则会以原始大小显示 Android浏览器和WebView默认为mdpi。hdpi相当于mdp...

WebView的介绍

WebView介绍WebView的使用简介==WebView 在使用的时候,主要设置三大部分内容:== (1)WebChromeClient 得到浏览器内部的反馈,包括加载情况以...

WebView介绍

本文主要对WebView进行介绍,包括webView 4个可以定制的点、设置WebView back键响应、控制网页的链接仍在webView中跳转、显示页面加载进度、处理https请求、利用a...

Android WebView 详细介绍

Android WebView 详细介绍 WebView(网络视图)能加载显示网页,可以将其视为一个浏览器。它使用了WebKit渲染引擎加载显示网页。 相关: 1、添加权限:AndroidMa...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)