WebView学习整理

一直有个说法，WebAPP会替代NativeAPP，因为WebAPP是跨平台的，直接在浏览器上运行，这是未来的方向。在浏览developer.android.com时看到其中WebAPP部分，立即吸引了我。但这个WebAPP不同于前述的运行于浏览器之上的WebAPP，而只是一个嵌入到NativeAPP中的WebView界面，类似某个软件里面嵌入了WebPage。不过了解这部分应该有助于以后开发运行在移动平台上的Web应用，以下是WebView部分学习整理。

文档提及了在Android上开发WebAPP的有利处：1、支持viewport属性来调节Web应用的尺寸；2、支持CSS和Javascript。

文档第一部分是Targeting Screens from Web Apps，介绍通过viewport来调节Web应用尺寸，这部分简略浏览了一下。文档第二部分是Building Web Apps in WebView，介绍了嵌入WebView的方法，以及WebView中Javascript调用Android用户代码的方法，以下会重点整理。文档第三部分是调试手段介绍，第四部分是一些易用性和优化建议。

WebView只是显示页面，没有地址栏或浏览键，所以最常见的用途是显示一些需要联网和实时更新的东西，我感觉在线游戏、博客、广告、邮箱等方面用得会比较多。WebView的用法是，创建一个Activity，在其中包含WebView。步骤如下：

第一步，是添加WebView到Acitvity的layout中，使用<WebView>标签。

第二步，是获取internet访问权限。

第三步，是允许WebView使用Javascript。

第四步，是绑定Javascript到Android的用户代码。也即可以写一个界面，通过这个界面Javascript将调用Android的用户代码，而在桌面系统上可能是调用浏览器功能。文档用alert()做了比喻。

在Android上的界面，是一个类：

public class JavaScriptInterface { 【这个界面的名字叫JavaScriptInterface】

    Context mContext;

    /** Instantiate the interface and set the context */

    JavaScriptInterface(Context c) {

        mContext = c;

    }

    /** Show a toast from the web page */ 【这里提供了一个可被Javascript调用的方法】

    public void showToast(String toast) {

        Toast.makeText(mContext, toast, Toast.LENGTH_SHORT).show(); 【调用到这里就是android的show，而不是web代码的show】

    }

}

通过以下方法将上述界面绑定到Javascript并命名为Android：

     webView.addJavascriptInterface(new JavaScriptInterface(this), "Android");

在Web网页上如下调用界面提供的方法：

<input type="button" value="Say hello" onClick="showAndroidToast('Hello Android!')" />

<script type="text/javascript">

    function showAndroidToast(toast) {

        Android.showToast(toast); 【这里调用Android用户代码。那么Javascript需要针对Android设备有一套代码，针对桌面系统有另外一套代码？似乎比较麻烦】

    }

</script>

文档有一句话我没看懂：The object that is bound to your JavaScript runs in another thread and not in the thread in which it was constructed. 文档还介绍了在WebView用用JS调用Android代码隐藏着安全隐患。

Web页面就涉及到点击链接的问题。原本点击链接缺省打开系统浏览器，但下面方法可以修改为用本身这个WebView打开链接：

myWebView.setWebViewClient(new WebViewClient());

还可以有选择地打开系统浏览器，也即做一个url过滤：

private class MyWebViewClient extends WebViewClient {

    @Override

    public boolean shouldOverrideUrlLoading(WebView view, String url) {

        if (Uri.parse(url).getHost().equals("www.example.com")) {

            // This is my web site, so do not override; let my WebView load the page

            return false;

        }

        // Otherwise, the link is not for a page on my site, so launch another Activity that handles URLs

        Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));

        startActivity(intent); 【这里最终会到达系统浏览器】

        return true;

    }

}

myWebView.setWebViewClient(new MyWebViewClient());

Web浏览有回退和前进问题。文档介绍了Activity可以使用设备的后退键来返回上个Web页面，方法是Activity拦截backward键，然后用myWebView.canGoBack()检查有没有回退栈，如果有，调用myWebView.goBack()回退，如果没有，返回系统对回退键的处理。类似，如果是forward键（似乎Android平板才有这个键，手机没有），则调用调用myWebView.goForward()前进。

最近学习浏览http://developer.android.com，发现这是一个巨大的，而且是极其易学易懂的宝库，比网上搜到的各种中英文书籍帖子博客等等更易学易懂，我早该看这里了，也在此建议任何程度的同学都以这个官方文档为主要学习内容。