WebView

WebView的使用

1.简介

来自谷歌官方的介绍:

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 includes methods to navigate forward and backward through a history, zoom in and out, perform text searches and more.

To enable the built-in zoom, set WebSettings.setBuiltInZoomControls(boolean) (introduced in API level CUPCAKE).

大概意思就是说:这个控件能显示一个网页,可以用来做一个浏览器或者在你的Activity里面显示一个网页,可以放大缩小页面,可以回退到历史页面等等,webview有很多方法,我们只介绍常用的几种,这就够了!

2.基本使用

布局这里就不贴出来了,就是一个webview

webView = (WebView) findViewById(R.id.webview);    WebSettings settings = webView.getSettings();    //是否启用js功能    settings.setJavaScriptEnabled(true);    //显示放大缩小按钮,适用于没有对手机进行适配的网页    settings.setBuiltInZoomControls(true);    //实现双击缩放,适用于没有对手机进行适配的网页    settings.setUseWideViewPort(true);     webView.loadUrl("http://www.hdu.edu.cn");

访问一个网页的简单实现,这样访问会使用手机带的浏览器去打开网页,而不是在我们的webview那里,如果想让打开的网页显示在我们设置的webview上,则需要增加一个监听

//设置页面加载时候的监听    webView.setWebViewClient(new WebViewClient(){        //页面开始加载        @Override        public void onPageStarted(WebView view, String url, Bitmap favicon) {            super.onPageStarted(view, url, favicon);        }        //跳转链接        @Override        public boolean shouldOverrideUrlLoading(WebView view, String url) {            webView.loadUrl(url);            //如果我们想让所有的页面都显示在我们定义的webview上而不是在浏览器中打开,则return true            //return false则去调用手机自带的浏览器去打开页面            return true;        }        //页面加载结束        @Override        public void onPageFinished(WebView view, String url) {            super.onPageFinished(view, url);        }    });

目前这样的话还有一个问题,就是我们在按返回键的时候就直接退出了当前的Activity,即使我们在网页里面向内访问了多个网页,不能回退到历史的上一个网页,所以我们要重写onBackPressed()方法

 @Overridepublic void onBackPressed() {    if (webView.canGoBack()){        webView.goBack();    }else {        finish();    }}

有时候为了更好的用户体验,我们可以显示页面加载的进度

 //网页加载进度的监听    webView.setWebChromeClient(new WebChromeClient(){        @Override        public void onReceivedTitle(WebView view, String title) {            super.onReceivedTitle(view, title);            System.out.println("网页的标题是"+title);        }        @Override        public void onProgressChanged(WebView view, int newProgress) {            super.onProgressChanged(view, newProgress);            System.out.println("加载网页的进度"+newProgress);        }    });

3.WebView JS互调

第一种:JAVA调用JS

比如HTML文件中有一个方法,我们的Android应用要调用这个方法,其实很简单:

这个是html中的方法

function funFromjs(){      document.getElementById("helloweb").innerHTML="HelloWebView,i'm from js";  } 

比如我们点击Java中的一个button或者textview或者其他什么调用这个方法,我们只需要在点击事件中,这样写

 mWebView.loadUrl("javascript:funFromjs()");  

格式是固定的,前面是javascript: 后面是方法名.如果html中的方法有参数,比如

function funFromjs(args){      document.getElementById("helloweb").innerHTML="HelloWebView,i'm from js";  }

则我们需要传入参数

mWebView.loadUrl("javascript:funFromjs('参数')");

第二种:JS调用JAVA

比如JS想调用JAVA中TestDemo类中的方法,则我们需要这样写

//第一个参数是被调用类的对象,第二个参数是别名,就是在js中可以使用的名字webView.addJavascriptInterface(new TestDemo(),"alias");

webview介绍这么多基本上满足大家的日常开发,如果你想了解更多,可以参考谷歌的开发文档