Android WebView初体验

Android及iOS的webview的引擎都是webkit，对H5提供支持.
WebView可以使得网页轻松的内嵌到app里，还可以直接跟js相互调用。
webview有两个方法：setWebChromeClient 和 setWebClient
setWebClient：主要处理解析，渲染网页等浏览器做的事情
setWebChromeClient：辅助WebView处理Javascript的对话框，网站图标，网站title，加载进度等
WebViewClient就是帮助WebView处理各种通知、请求事件的。

一. webview组件如何使用

添加权限：AndroidManifest.xml中必须使用许可”android.permission.INTERNET”,否则会出Web page not available错误。
在Activity中生成一个WebView组件：WebView webView = new WebView(this);或者可以在activity的layout文件里添加webview控件：
WebSettings 的常用方法介绍

setPluginsEnabled(true); //支持插件 
setUseWideViewPort(false); //将图片调整到适合webview的大小 
setSupportZoom(true); //支持缩放 
setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN); //支持内容重新布局 
supportMultipleWindows(); //多窗口 
setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK); //关闭webview中缓存 
setAllowFileAccess(true); //设置可以访问文件 
setNeedInitialFocus(true); //当webview调用requestFocus时为webview设置节点 
webview webSettings.setBuiltInZoomControls(true); //设置支持缩放 
setJavaScriptCanOpenWindowsAutomatically(true); //支持通过JS打开新窗口 
setLoadWithOverviewMode(true); // 缩放至屏幕的大小 
setLoadsImagesAutomatically(true); //支持自动加载图片

WebViewClient 的方法全解

doUpdateVisitedHistory(WebView view, String url, boolean isReload) //(更新历史记录) 
onFormResubmission(WebView view, Message dontResend, Message resend) //(应用程序重新请求网页数据) 
onLoadResource(WebView view, String url) // 在加载页面资源时会调用，每一个资源（比如图片）的加载都会调用一次。 
onPageStarted(WebView view, String url, Bitmap favicon) //这个事件就是开始载入页面调用的，通常我们可以在这设定一个loading的页面，告诉用户程序在等待网络响应。 
onPageFinished(WebView view, String url) //在页面加载结束时调用。同样道理，我们知道一个页面载入完成，于是我们可以关闭loading 条，切换程序动作。 
onReceivedError(WebView view, int errorCode, String description, String failingUrl)// (报告错误信息) 
onReceivedHttpAuthRequest(WebView view, HttpAuthHandler handler, String host,String realm)//（获取返回信息授权请求） 
onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) //重写此方法可以让webview处理https请求。 
onScaleChanged(WebView view, float oldScale, float newScale) // (WebView发生改变时调用) 
onUnhandledKeyEvent(WebView view, KeyEvent event) //（Key事件未被加载时调用） 
shouldOverrideKeyEvent(WebView view, KeyEvent event)//重写此方法才能够处理在浏览器中的按键事件。 
shouldOverrideUrlLoading(WebView view, String url) //在点击请求的是链接是才会调用，重写此方法返回true表明点击网页里面的链接还是在当前的webview里跳转，不跳到浏览器那边

① 设置WevView要显示的网页：
互联网用：webView.loadUrl(“http://www.google.com“);
本地文件用：webView.loadUrl(“file:///android_asset/XX.html”); 本地文件存放在：assets文件中
② 如果希望点击链接由自己处理，而不是新开Android的系统browser中响应该链接。给WebView添加一个事件监听对象（WebViewClient)并重写其中的一些方法：
shouldOverrideUrlLoading：对网页中超链接按钮的响应。当按下某个连接时WebViewClient会调用这个方法，并传递参数：按下的url。比如当webview内嵌网页的某个数字被点击时，它会自动认为这是一个电话请求，会传递url：tel:123,如果你不希望如此可通过重写shouldOverrideUrlLoading函数解决：

 public boolean shouldOverrideUrlLoading(WebView view,String url){  
    if(url.indexOf("tel:")<0){//页面上有数字会导致连接电话  
         view.loadUrl(url);  //在当前的webview中跳转到新的url
     }  
     return true;            
}

③ 处理https请求
webView默认是不处理https请求的，页面显示空白，需要进行如下设置：

webView.setWebViewClient(new WebViewClient() {    

        @Override    
        public void onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) {    
            handler.proceed();    
//            handler.cancel();    
//            handler.handleMessage(null);    
        }    
});

onReceivedSslError为webView处理ssl证书设置
其中handler.proceed();表示等待证书响应
handler.cancel();表示挂起连接，为默认方式
handler.handleMessage(null);可做其他处理
另外还有其他一些可重写的方法
-接收到Http请求的事件
onReceivedHttpAuthRequest(WebView view, HttpAuthHandler handler, String host, String realm)
-打开链接前的事件
public boolean shouldOverrideUrlLoading(WebView view, String url) { view.loadUrl(url); return true; }
这个函数我们可以做很多操作，比如我们读取到某些特殊的URL，于是就可以不打开地址，取消这个操作，进行预先定义的其他操作，这对一个程序是非常必要的。

-载入页面完成的事件
public void onPageFinished(WebView view, String url){ }
同样道理，我们知道一个页面载入完成，于是我们可以关闭loading条，切换程序动作。

-载入页面开始的事件
public void onPageStarted(WebView view, String url, Bitmap favicon) { }
这个事件就是开始载入页面调用的，通常我们可以在这设定一个loading的页面，告诉用户程序在等待网络响应。

通过这几个事件，我们可以很轻松的控制程序操作，一边用着浏览器显示内容，一边监控着用户操作实现我们需要的各种显示方式，同时可以防止用户产生误操作。

④ 如果用webview点链接看了很多页以后，如果不做任何处理，点击系统“Back”键，整个浏览器会调用finish()而结束自身，如果希望浏览的网页回退而不是退出浏览器，需要在当前Activity中处理并消费掉该Back事件。
覆盖Activity类的onKeyDown(int keyCoder,KeyEvent event)方法。

//改写物理按键——返回的逻辑
    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        // TODO Auto-generated method stub
        if(keyCode==KeyEvent.KEYCODE_BACK)
        {
            if(webView.canGoBack())
            {
                webView.goBack();//返回上一页面
                return true;
            }
            else
            {
                System.exit(0);//退出程序
            }
        }
        return super.onKeyDown(keyCode, event);
    }

使用缓存

优先使用缓存

webView.getSettings().setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);

不使用缓存：

webView.getSettings().setCacheMode(WebSettings.LOAD_NO_CACHE);

监听webview的滚动事件

监听webview的滚动事件，至少需要获得两个方面的信息：
1.滚动的偏移量 2.滚动的方向
但是WebView并没有对外提供一个类似于setOnScrollChangedListener之类的监听者，只有一个如下的protected方法：

protected void onScrollChanged(final int l, final int t, final int oldl, final int oldt) {}

所以我们可以自定义一个

import android.content.Context; 
import android.util.AttributeSet; 
import android.webkit.WebView; 

public class ObservableWebView extends WebView { 
    private OnScrollChangedCallback mOnScrollChangedCallback; 
    public ObservableWebView(final Context context) { 
        super(context); 
    } 
    public ObservableWebView(final Context context, final AttributeSet attrs) { 
        super(context, attrs); 
    } 
    public ObservableWebView(final Context context, final AttributeSet attrs, 
                        final int defStyle) { 
        super(context, attrs, defStyle); 
    } 
    @Override 
    protected void onScrollChanged(final int l, final int t, final int oldl, 
                        final int oldt) { 
        super.onScrollChanged(l, t, oldl, oldt); 
        if (mOnScrollChangedCallback != null) { 
            mOnScrollChangedCallback.onScroll(l - oldl, t - oldt); 
        } 
    } 
    public OnScrollChangedCallback getOnScrollChangedCallback() { 
        return mOnScrollChangedCallback; 
    } 
    public void setOnScrollChangedCallback( 
        final OnScrollChangedCallback onScrollChangedCallback) { 
            mOnScrollChangedCallback = onScrollChangedCallback; 
        } 
        /** 
        * Impliment in the activity/fragment/view that you want to listen to the webview
        * 这里我们定义了一个OnScrollChangedCallback接口，其中dx和dy分别是滚动的时候，x和y方向上的
        * 偏移量。这个偏移量是根据onScrollChanged方法的四个参数计算出来的：  
        */ 
        public static interface OnScrollChangedCallback { 
            public void onScroll(int dx, int dy); 
        } 
    } 

    mOnScrollChangedCallback.onScroll(l - oldl, t - oldt); 
    //现在一个对外提供了滚动参数的自定义webview： 
    wv = (ObservableWebView) findViewById(R.id.scorllableWebview); 
    wv.setOnScrollChangedCallback(new OnScrollChangedCallback(){ 
    public void onScroll(int dx, int dy){ 
        //这里我们根据dx和dy参数做自己想做的事情 
    } 
});

二：
Webview与js的双向交互才是android的webview强大所在

WebSettings webSettings = mWebView .getSettings();
webSettings.setJavaScriptEnabled(true); 
mWebView.addJavascriptInterface(new Object() { 
    public void clickOnAndroid() { 
        // 加了一个post（new Runble），若不加的话js代码是不被调用的。
        mHandler.post(new Runnable() { 
        }); 
    }
}, “demo”);

Android在4.4之前并没有提供直接调用js函数并获取值的方法，所以在此之前，常用的思路是 java调用js方法，js方法执行完毕，再次调用java代码将值返回。
Android 4.4之后使用evaluateJavascript即可。

private void testEvaluateJavascript(WebView webView) { 
    webView.evaluateJavascript(“getGreetings()”, new ValueCallback() { 
        @Override 
        public void onReceiveValue(String value) { 
            Log.i(LOGTAG, “onReceiveValue value=” + value); 
        }
    }); 
}

先写这些吧，撸一把代码吧。
附上一些了链接
HTML5，js与Android native通信
 JS与移动端webview的相互交互
 WebAPI

Android WebView初体验

猜你喜欢